Kategori: Uncategorized

Publicerad den av

Uppgift

Svara på frågor

1. Webbplatsens domän och namn

Domän: https://www.larue.se/

Namn: La Rue

2. Val av tema. Vad har du för tema på din webbplats och vad behöver normalt sett övervägas vid val av tema?
Om du inte använt dig av rekommenderat tema, motivera ditt val.

Jag har valt temat Storefront till min webbplats La Rue. Det var det temat som rekommenderades av läraren, och det är ett väldigt vanligt tema för de som använder e-handelsplattformen WooCommerce.

När man ska välja tema till en hemsida, särskilt en e-handel, är det några saker som är viktigast att tänka på:

  1. Att det fungerar med e-handel: Temat måste vara gjort för att sälja saker. Det måste funka klockrent med WooCommerce (kassasystem, produktsidor och varukorg). Storefront gör det bäst eftersom de som gjort WooCommerce också har gjort Storefront.
  2. Att det är mobilvänligt (responsivt): Folk handlar mycket med mobilen idag. Hemsidan måste se bra ut och vara enkel att använda på alla skärmar – från mobiler till datorer.
  3. Hur snabbt det är: Ett snabbt tema är viktigt för kunderna och för att Google ska gilla sidan. Jag valde Storefront för att det är känt för att vara snabbt och rent kodat.
  4. Att man kan ändra utseendet: Jag måste kunna ändra färger och typsnitt så att det passar mitt märke ”La Rue”. Ett bra tema låter mig göra det enkelt.

Jag valde alltså Storefront för att det är stabilt, snabbt och specialbyggt för att sälja mina väskor. Det var det säkraste och bästa valet för skoluppgiften.

3. Normalt sett lyfts utvalda produkter (bästsäljare eller kanske de med bäst marginal) eller
kategorier fram på startsidan. Där brukar även finnas usp:ar och en säljande beskrivning
av företaget/verksamheten. Hur har du gjort och varför? Förtydliga gärna med
skärmdumpar.

På startsidan framhäver jag en ’Om oss’-sektion som ger en säljande beskrivning av företaget. Klicka här för att läsa mer om oss: https://www.larue.se/about/
Jag använder mig mycket av CTA genom exemplevis ”läs om vår historia” eller ”se kollegtionen”. Jag visar även upp våra produkter som trendar samt våra nyheter lite längre ner på sidan.




4. Hur har du lagt upp webbplatsens meny, struktur och navigering?
Se till att dessa följer en logisk struktur och beskriv hur du lagt upp dessa delar.

Jag har utformat webbplatsens struktur med fokus på användarvänlighet och logisk navigering för att besökaren snabbt ska hitta den information och de produkter de söker.
Huvudmenyn (Toppnavigering)
Huvudmenyn är utformad för att ge snabb tillgång till de viktigaste kategorierna och informationen:
Hem: Enkel återgång till startsidan.
Produkter: Denna flik innehåller en dropplist (dropdown-meny) som direkt leder till olika produktkategorier (som parfymer för dam/herr och andra produkter) för effektiv produktsökning.
Nyheter: Låter besökare snabbt se de senaste lanseringarna eller erbjudandena.
Om oss: Ger snabbt en säljande beskrivning av företaget och leder vidare till en sida för djupare information.
Kontakt/Kundservice: Samlar all viktig information för kundsupport och kontaktvägar.

Sidfot (Footer) Navigering
För att underlätta för kunden och minska antalet klick, har jag inkluderat de viktigaste kundtjänstlänkarna i sidfoten:
KUNDSERVICE: Innehåller direktlänkar till sidor som FAQ, Policy och Kontakta oss. Detta ger kunden en genväg för att hitta svar utan att behöva söka i toppmenyn.
INFORMATION: Innehåller viktiga sidor som Om oss och Uppgift.

5. Det skall finnas statiska undersidor på webbplatsen som tydligt beskriver ”Om oss”,
”Kontakt”, plus de leveransvillkor och köpvillkor som gäller. Även frakt och returer bör
beröras i samband med detta.
Beskriv här även varför du valt just de villkor som du valt.

Webbplatsen är utrustad med nödvändiga statiska undersidor för att säkerställa full transparens och ge kunderna all viktig information före, under och efter ett köp. Samtliga undersidor nås enkelt via huvudmenyn under fliken Kundservice, men för enklast möjliga tillgång finns de viktigaste länkarna även samlade i sidfoten (footern).

Sidorna som finns tillgängliga är:

Vid utformningen av villkoren har jag utgått från lagkrav, branschstandard och kundens behov. Jag har valt att inkludera all nödvändig information i policyn, såsom köp, betalning och frakt.

  • Prissättning och betalning: Alla priser anges tydligt i SEK inklusive moms. Betalning sker via faktura vid leverans.
  • Frakt och Leverans: Jag har valt att erbjuda gratis frakt för att minska antalet avbrutna köp. En tydlig leveranstid på 1–3 arbetsdagar har angetts för att skapa realistiska kundförväntningar.
  • Ångerrätt och Retur: Jag har valt 14 dagars öppet köp, vilket är minimikravet enligt svensk lag. I policyn anges tydligt hur returprocessen hanteras och vart kunden kan maila vid returfrågor.
  • Förtroende: Policyn inkluderar även information om hur LA RUE arbetar med GDPR, vilket är avgörande för att bygga förtroende och visa att vi hanterar kunddata på ett ansvarsfullt sätt.

6. Vilka kontaktformulär har du på webbplatsen och vad har de för syften? Det skall finnas
minst ett kontaktformulär på webbplatsen.

Webbplatsen har ett centralt kontaktformulär (https://www.larue.se/contact/) som även nås via Kundservice (https://www.larue.se/kundservice/).

Formuläret är det primära sättet för kundsupport och är utformat för att:

  • Förenkla kontakten: Gör det enkelt för kunder att skicka in ärenden utan att behöva använda extern e-post.
  • Säkerställa spårbarhet: Samlar in nödvändig information direkt för att snabbt kunna dirigera och hantera kundfrågor.

Detta system optimerar kommunikationen och underlättar LA RUE:s interna hantering av supportärenden.

7. Visa på att det finns klickbara mail- och telefon-länkar på din webbplats.

All direktkontaktinformation i sidfoten (footern) är klickbar.
Jag använder tel: för telefonnummer och mailto: för e-postadressen.
Detta gör att kunden omedelbart kan ringa eller skicka e-post genom ett enda klick, vilket är avgörande för en snabb och friktionsfri kundservice.

8. I vilket sammanhang har du använt dig av shortcodes? Det skall finnas minst ett
användande av shortcode på webbplatsen.

 

Jag använder den inbyggda WooCommerce shortcoden ”products” för att dynamiskt visa de trendande produkterna på startsidan.

Med attribut som på dena bild…kan jag styra hur många produkter som visas och hur de presenteras i rutnätet.

9. Hur har du utformat Webbplatsens footer och varför?

 

Jag har byggt sidfoten (footern) med hjälp av ett Rutnät eller Behållar-block i min sidbyggare för att uppnå en tydlig layout i tre kolumner.

I varje kolumn har jag använt listelement och rubriker för att strukturera innehållet:

  • Kundservice och Information: De två första kolumnerna innehåller listor med de viktigaste statiska sidlänkarna (FAQ, Policy, Om oss, Uppgift).
  • Kontaktinformation: Den tredje kolumnen samlar all kontaktinformation (adress, telefon, e-post). Här har jag säkerställt att alla länkar är klickbara med hjälp av tel: och mailto: -protokollen.

För att tydligt markera vad som är klickbart har jag stylat länkarna med en understrykning, som försvinner när muspekaren dras över texten. Detta visar intuitivt för besökaren att elementet är interaktivt.

 

10. Vilka åtgärder har du vidtagit för att det tydligt skall framkomma att det är en demobutik
och att det faktiskt inte går att handla ”på riktigt”?

Jag har använt WooCommerce-funktionen ”Butiksmeddelande”, som jag hittade under Anpassa WooCommerce Butiksmeddelande.

Genom att aktivera butiksmeddelandet med texten ”This is a demo store for testing purposes — no orders shall be fulfilled.”, visas detta som en permanent global banner i sidans nedre kant. Detta säkerställer att demostatusen tydligt framgår för alla besökare

11. I vilken utsträckning och hur har du arbetat med WooCommerce på webbplatsen?
Det skall finnas produkter i någon form att köpa på webbplatsen. Produkterna skall vara minst tio
till antalet och antalet kategorier minst tre. Beskriv vad du gjort och hur du gått tillväga.

Jag har byggt upp en fullständig e-handelsstruktur i WooCommerce.

Produkter och Kategorier:

  • Katalogen innehåller fler än 10 produkter.
  • Produkterna är uppdelade i fyra kategorier (Damparfym, Herrparfym, Bodylotions, Kits).
  • Varje produkt har pris, bild, beskrivning och doftnoter.

Navigering & Presentation:

  • Kategorierna nås via drop-down-menyn under ”Produkter”.
  • Jag använder WooCommerce shortcodes (products)för att dynamiskt visa utvalda produkter i sektionen ”TRENDING” på startsidan.

Inställningar: Jag har konfigurerat inställningar för att visa pris inklusive moms, aktiverat faktura vid leverans som betalsätt, samt ställt in nödvändig frakt och e-postmeddelanden.

12. Vilka produkttyper har du arbetat med och varför?
Här handlar det alltså om enkel/grupperad/variabel/nedladdningsbar/etc. Visa på exempel.

Jag har valt att enbart arbeta med produkttypen Enkel Produkt (Simple Product) för hela LA RUE:s sortiment, inklusive parfymer, bodylotions och alla våra Kits.

 

  • Exempel: Alla våra individuella parfymer (som LA RUE AIR och LA RUE SOIRÉE), bodylotions och även våra Kits.
  • Motivering: Detta är den mest effektiva och logiska produkttypen för LA RUE eftersom:
    1. Fast Varuutbud: Alla våra produkter, inklusive parfymer och bodylotions, säljs i en standardiserad storlek och har därför inga varianter (som storleks- eller färgval).
    2. Enkla Köp: Våra Kits säljs som en enda, färdigpackad paketlösning med ett fast pris. Kunden ska alltså köpa hela paketet med en enda ”Lägg i varukorgen”-knapp, precis som en enkel produkt.
    3. Optimerad Hantering: Genom att hålla oss till den enkla produkttypen minimeras komplexiteten i lagerhanteringen, vilket gör administrationen av webbplatsen snabb och smidig.

Denna strategi ger den bästa och mest strömlinjeformade kundupplevelsen för fasta fysiska produkter.

13. Visa på exempel på designdelar som du anpassat med hjälp av Elementor.

Jag har använt Elementor (eller liknande sidbyggare) för att anpassa viktiga designdelar som t.ex.:

  • FAQ-sidan: Jag använde Accordion/Dragspel-widgeten för att skapa expanderbara frågor och svar, vilket ger en renare och mer effektiv presentation.
  • Startsidan (Hero): Huvudsektionen byggdes med Flexbox/Behållare. Detta gjorde det möjligt att centralt placera bilden och inkludera en klickbar länk (”Se kollektion”) som fungerar som en direkt ”call-to-action”.

14. Vilka tillägg har du använt och varför? Komplett lista önskas.

Jag har använt flera tillägg för att bygga och optimera webbplatsen. WooCommerce är kärnan och hanterar hela e-handelsfunktionaliteten (produkter, kassa, betalningar). För design och layout har jag använt Elementor och Ultimate Addons for Elementor (UAE), vilket gett mig flexibiliteten att skapa unika layouter, som dragspel/accordion-funktionen på FAQ-sidan. För att hantera kundkommunikation har jag installerat WPForms Lite, vars syfte är att skapa det kontaktformulär som finns på webbplatsen.

  • Elementor
  • Classic Editor
  • UAE
  • WooCommerce
  • WPForms

15. Vilka andra åtgärder har du vidtagit för att skapa en snygg, inspirerande och effektiv
webbplats som på bästa sätt levererar utifrån din affärsidé?
Presentera resultat i text och bild.

(BIFOGAR BILDER NEDAN)

Jag har vidtagit ett antal design- och innehållsåtgärder för att skapa en snygg, inspirerande och effektiv webbplats som på bästa sätt levererar utifrån LA RUE:s affärsidé: 

1. Visuell Varumärkesupplevelse (Inspirerande & Snygg) 

  • Atmosfärisk Hero-sektion: Startsidan möter besökaren med en stor, högupplöst bild av blommor och en centralt placerad parfymflaska. Detta skapar omedelbart en lyxig och känslomässig atmosfär, avgörande för en parfymbutik. 
  • AI-Genererade Produktbilder: För att säkerställa ett exklusivt och unikt utseende har alla produkter på webbplatsen (t.ex. LA RUE AIR och LA RUE SOIRÉE) fått sin inspiration från andra varumärken, men är sedan skapade som egna produkter med hjälp av AI-genererade bilder. Detta ger en konsekvent, professionell och unik fotograferingsstil. 
  • Konsekvent Färgpalett: Webbplatsen använder en mjuk och lyxig färgpalett (rosa/nude-toner) i både bakgrunder och rubriker. 

2. Effektivitet och Användarupplevelse 

  • Tydlig Navigering & CTA: Toppmenyn är logisk och den centrala knappen ”Se kollektion” leder effektivt besökaren från inspiration till köp. 
  • Kundservice och Tillit: Den konsekventa placeringen av kontaktlänkar och en tydlig sidfot (footer) med adresser och klickbara länkar bygger förtroende och säkerställer att kunden enkelt kan få hjälp. 

3. Leverans av Affärsidén 

  • Informativt Produktinnehåll: Jag har säkerställt att varje produktbeskrivning är detaljerad och inkluderar specifika doftnoter. Detta är avgörande för att kompensera för avsaknaden av doftprov online. 
  • Produktfokus: Genom att använda WooCommerce shortcodes (products) exponeras aktuella produkter direkt på startsidan, vilket driver försäljning. 

16. Validera din egna webbplats utifrån de kriterier som lyfts fram i föreläsningsmaterialet. 
a. Peka på tre delar som du tycker att du tycker att du gjort riktigt bra.
b. Peka på tre delar som du inte är lika nöjd med eller tycker att du hade behövt arbeta vidare med.

Jag har tittat kritiskt på min webbplats och är nöjd med hur jag lyckats fånga känslan av lyx. Men jag ser också var jag behöver fixa till saker för att sidan ska bli ännu bättre och enklare att använda. 

a. Tre Saker Jag Har Gjort Riktigt Bra 

  1. Snygg Känsla och Kvalitet: Jag har lyckats skapa en lyxig och inbjudande känsla som passar parfym. Startsidan med blommor och flaskan skapar direkt rätt stämning, och jag har använt en mjuk och snygg färgpalett i rosa toner. Att jag använde AI för att skapa unika och professionella produktbilder gör att alla flaskor ser konsekventa och exklusiva ut. 
  1. Lätt att Hitta & Göra Affär: Sidan är lätt att använda. Jag har satt in en stor knapp (”Se kollektion”) som snabbt tar besökaren från att titta till att handla. Jag har också samlat all viktig information, som adresser och telefonnummer, i sidfoten, och gjort så att numret och mejladressen går att klicka på direkt i mobilen. 
  1. Ärligt om Demobutiken: Jag har varit tydlig och ärlig med att det är en testbutik. Jag ställde in Butiksmeddelandet i WordPress så att en permanent blå text visas längst ner på alla sidor, så ingen kan missa att det inte går att handla på riktigt. 

b. Tre Saker Jag Hade Behövt Jobba Vidare Med 

  1. Bättre i Mobilen: Även om sidan ser bra ut på datorn, skulle jag behöva lägga mer tid på att testa och fixa så att allt ser perfekt ut även när man kollar på en liten mobilskärm. Saker som bilder och rutnät måste skalas optimalt på alla telefoner. 
  1. Tydligare Klick-signaler: Jag har gjort så att understrykningen under länkar försvinner när man pekar på dem. Det är lite otydligt. Jag borde ändra det så att länkarna istället byter färg eller får en ny understrykning när man pekar på dem. Det skulle göra det mycket tydligare att man kan klicka. 
  1. Bättre Doftinformation: Det är svårt att sälja parfym online. Jag har löst det med bra text om doftnoter, men jag skulle vilja lägga till något roligare, som en frågesport (quiz) som matchar kunden med rätt parfym, eller små bilder på produktsidan som symboliserar doften (t.ex. en bild på vanilj) för att hjälpa kunden att föreställa sig hur det luktar.