Kategori: Okategoriserade

1. Skapa en digital mätplan för din webbplats.

Detektivshops business objectives är att ”Utrusta varje nyfiken själ med de verktyg som behövs för att gräva djupare, kartlägga samband och göra det okända synligt.”

Eftersom att webbplatsen är en e-handel som även erbjuder detektivtjänster är strategin och taktiken att sälja produkter (intäkt) och lösa kunders fall (leads).

Mina KPI:er för hemsidan är följande:

Intäktsrelaterade KPI:er:
Totala intäkter – Ett grundläggande nyckeltal som visar hur mycket försäljning som butiken genererar totalt.
Antal transaktioner – Hjälper DetektivShop utvärdera hur många köp som faktiskt har genomförts.
Genomsnittligt ordervärde – Visar kundens köpbeteende och hur lönsam varje order är.
Ej fullföljt köp – Viktig för att identifiera hinder i köpresan och möjligheter att optimera konverteringar.

Leadsrelaterade KPI:er:
Antalet bokningar av Detektiv – Visar hur många som genomför ett lead genom att boka en Detektiv.
Antal kontaktförfrågningar – Mäter hur många som skickar in formuläret och efterfrågar hjälp med ett uppdrag.

2. Visa på de taggar som du skapat i Google Tag Manager för att mäta och följa upp dina KPI:er.
Här vill jag se skärmdumpar som visar på skapade taggar och relaterade triggers. Jag vill också att du i
text förklarar vilken tagg som hänger ihop med vilken KPI.

Nedan finns en lista på alla taggar som är skapade i GTM. Alla taggar är inte specifikt kopplade till mätplanen, men är skapade av nyfikenhet och i lärosyfte.

Här presenteras de i turordning:

Contact From 7: Event som triggas när en besökare fyller i ett kontaktformulär. Den mäter alla kontaktformulär på hemsidan.

Event som triggar och gör det möjligt att spåra:
KPI:er: Totalt antal kontaktförfrågningar
Segment: Hur många som kontaktar via kontaktformulären.
Targets: Få en besökare att ta kontakt.

_____________________________________________________________________________________________________________________________

GA-Tagg: Tagg för konstant variabel för uppkoppling till GA4 – Används mest som en genväg.

_____________________________________________________________________________________________________________________________

GA4 – Event – Detektiv val: Den här taggen spårar vilken detektiv som valts vid offertförfrågningar under sidan tjanster-🔍 . Eventet triggas när besökaren fyllt i kontaktformuläret och valt detektiv. Den  spårar även hur många kontaktformulär som gjorts på en specifik sida.

Förklaring på tillvägagångssätt:
Steg 1. För att kunna hämta data kopplat till drop-down menyn behövdes ett JavaScript finnas på sidan under tjänster så att värdet kunde hämtas.
Steg 2. Därefter behövdes en variabel med datalayer som var anpassat med eventen form_submission och parametern detektiv_namn.

Steg 3. var att skapa en trigger i GTM som reagerar på det anpassade eventet form_submisson som gör att taggen aktiveras när formuläret skickas.

Steg 4. Skapa en tagg som är påkopplat med GA4 och triggar igång utlösare och triggers.

Event som triggar och gör det möjligt att spåra:
KPI:er: Antal bokade detektiver, antal kontaktförfrågningar under tjänster
Segment: Populära detektiver
Targets: Bokningar av detektiv
_____________________________________________________________________________________________________________________________

Event – Ecommerce Events: Den här taggen är ett spårningsskript som är kopplat med WooCommerce.
Med hjälp av den här taggen kan jag följa upp min mätplan som tillhör strategin ”Sälja produkter”.

Event som triggar och gör det möjligt att spåra:
KPI:er: Total intäkt, Antal transaktioner, Genomsnittligt ordervärde, Ej fullföljda köp.
Segment: Populära produktkategorier.
Targets: Fullföljda köp / Avbrutna köp

 

_____________________________________________________________________________________________________________________________

GA4 – Event – Ej vald detektiv: Den här taggen segmenterar värdet ”Önskar förslag” då den inte är specifikt kopplad till en detektiv. Genom att skapa en egen tagg för den kan jag enkelt få en överblick på hur många av mina besökare som behöver råd om vilken detektiv som passar uppdraget.

Events som triggar och gör det möjligt att spåra:
Segment: Antal val av ”önskar förslag” av detektiv, dvs ej vald/ej specifik detektiv.
Targets: Bokningar av detektiv <- men mer specifik kring ej vald detektiv.

_____________________________________________________________________________________________________________________________

GA4 – Event – Klick på Kontakta oss: Event som triggas när en besökare trycker på kontakta oss länken på footern.

Events som triggar och gör det möjligt att spåra:
Segment: Antal klick på ”kontakta oss”.

_____________________________________________________________________________________________________________________________

 

Mailklick: Tagg som spårar hur många besökare som klickar på den klickbara länken ”mailto” på footern. Ej väsentlig för min mätplan, men skapad i utbildningssyfte. 


_____________________________________________________________________________________________________________________________

3. Visa på att dina KPI:er spåras i Google Analytics.

I bild nedan kan jag se mina KPI:er Total intäkt, Antal transaktioner och Genomsnittligt ordervärde.

Bild 2 visar KPI:n Ej fullföljda köp i en funnel. Det går att räkna ut hur många besökare som ej fullföljer sina köp genom att mäta skillnaden på se produkt/lägg i varukorg till betalning.
(*OBS ny bild kommer ersätta skärmdumpen, då data ännu inte hunnits samlas in till GA)

Vi kan se att översikt i realtid faktiskt dokumenterar aktiviteterna på hemsidan.

Det går även att mäta KPI:erna Antalet bokningar av Detektiv och Antal kontaktförfrågningar, dock så lyckas jag inte få fram en snygg visning på dessa KPI:er, men kan visa på att de följs.
*OBS!! Skärmdumparna är tagna ur olika tidpunkter och differerar i värden.

Det går även att spåra och mäta vilka detektiver som har valts. Jag lyckas dock inte lösa någon bra presentation på totalen av värdena.

 

 

 

 

 

 

 

 

 

 

 

4. Visa på hur du tänker dig segmenteringen i en analysfas och beskriv vad detta kan komma att ge
för insikter.

Trafikkällor – Genom att segmentera användarna baserat på trafikkällan får Detektivshop en klar bild av vart trafiken kommer från.
Insikt/värden: Förstå vilka kanaler som genererar mest trafik kan vara värdefullt i syftet att fokusera på det som ger bäst resultat. Man kan även spåra de källor som inte presterar som förväntat och på sikt ändra strategier eller förbättra konverteringar från de kanalerna.

Populära produkter – Segmentering av populära produktkategorier skapar en förståelse av kundresan och det som efterfrågas på webbshoppen.
Insikt/värden: Identifiera de produkter eller kategorier som säljer bäst och utöka utbudet baserat på efterfrågan. Om vissa produkter inte säljer lika bra, kan man undersöka varför och göra ändringar i ex produktbeskrivningen.

Antal sidvisningar – Segmentering av användarna baserat på sidvisningar ger insikter i användarens beteende på webbplatsen.
Insikt/värden: Förstå vilka sidor som är mest/minst populära kan ge information om användarens intressen när de besöker hemsidan. Om vissa sidor har låga eller korta sessioner kan man analysera dem för att se om sidorna behöver förbättras eller om innehållet är relevant.

Populära detektiver – Genom att segmentera populära detektiver kan man spåra vilken expertis eller detektiv som är mest efterfrågad.
Insikt/värde: Informationen kan användas för att optimera resursanvändningen genom att fokusera på de detektiver som bokats flest gånger. Det ger även en inblick på vilken typ av tjänst som efterfrågas samt vilken detektiv eller tjänst som inte är lika aktuellt. En åtgärd man skulle kunna tänkas göra i de fall där en detektivs tjänst inte är lika efterfrågad är att skapa en kampanj eller överväga tjänstens relevans.

5. Visa på ett A/B-test som du satt upp och förklara syftet med detta.

URL till B/test: https://www.detektiv-shop.se/?nab=1 <- Det går tyvärr inte att komma till B versionen via url:en, se bild nedan istället.
Syftet med A/B testet är att testa om fler klick till tjänster-🔍 ökar från startsidan.

För att göra det skapade jag en ny version av startsidan (B) med en container som presenterar tjänsten och en bild på detektiverna. Det finns även en knapp som tar besökaren direkt till sidan /tjänster.
Det jag vill testa är att se om fler besökare hittar till sidan om det finns en informationstext och bild på detektiverna med en länk.

B Testet mäter hur många besökare som trycker på knappen.

A sidan (control version) mäter antal klick som kommer från headern.

På så sätt kan jag spåra om B testet är något som jag borde implementera för att leda fler besökare till sidan tjänster och på sikt generera fler leads.

 

Av datan insamlad av Nelio kan vi se att testet faktiskt fungerar och att B testet har varit framgångsrikt.

1. Webbplatsens domän och namn

Domän: detektiv-shop.se
Namn: DetektivShop

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?

Svar: Jag har valt att använda mig av Storefront eftersom det rekommenderades och är särskilt anpassat för WooCommerce. Hade jag börja om hade jag kanske valt att använda mig av ett tema som fungerar bättre med Elementor. Samtidigt har jag lärt mig mycket genom att testa mig fram och lösa olika hinder själv, vilket har gett mig mer självförtroende i WordPress.

 

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

Svar: På min startsida möts man av texten ”Välkommen till din Detektivshop online – Din partner i alla uppdrag”, syftet med texten är att informera samt bygga en personlig relation till kunden.
Genom att vara en partner till kunden vill jag skapa känslan av att Detektivshop förstår och kan tillgodose kundens behov.

 

Längre ner på startsidan finns även två kategorier med knappar som tar besökaren direkt till kategorierna teknik och kontorsmaterial (utredningsstationen). Här använder jag bakgrundsbilder för att skapa en mer visuellt tilltalande design.

Jag har även med ett block med ”Bästsäljare”, där jag lyfter fram Detektivshops mest ”köpta produkt” skuggnytt, här har jag valt att ha en säljande och informativ text med en shortcode för produkten direkt på startsidan.

Det finns även CTA för ”get the look” – som innehåller kategorier från Kläder & Assessorer  och ”get the supplies” – som innehåller produkter från kategorin Utrustning. På så sätt lyfter jag fram alla fyra huvudkategorier direkt på startsidan för att ge ett smakprov på vad shoppen har att erbjuda.

På botten av sidan hittar man en länk till produktkatalogen.

Jag har valt att inte ha någon ”om oss” sektion på startsidan eftersom temat, budskapet och utbudet genomsyrar helheten. Man kan istället hitta ”om oss” både på headern och footern.

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

Loggan: När man kommer till hemsidan möts man av butikens logga, den är skapad i procreate och är inbäddad med en länk som tar besökaren till startsidan. Det är ganska vanligt på hemsidor och brukar hjälpa kunder att navigera till startsidan om man råkat tappa bort sig. Loggan fyller även en funktion som talar om för kunden om hemsidans identitet och varumärke.

Menyer: Jag har valt att dela upp mina menyer i tre delar för att enkelt kunna separera, anpassa och skapa ”luft” emellan dem. Anledningen var att jag ville göra det lättåskådligt för besökaren att navigera på hemsidan, utan att känna sig överväldigad. Alla tre menyer finns i headern och är uppdelade i tre kategorier, ”Webbshoppen/produkter” ”information och tjänster” samt ”kundhörnan”.

Från vänster till höger:
Meny 1: Hamburgaren/”Webbshoppen/produkter” – Jag har valt att använda en hamburgermeny för mina produkter, då jag ville skapa en separerat meny som skiljer sig från de andra menyerna. Tanken är att man som kund ska kunna differentiera mellan shop och information. Hamburgermenyer har även börjat bli allt vanligare inom e-handel (ex lyko.com). En orsak skulle kunna bero på att vi idag oftast handlar från mobiltelefoner och surfplattor, där menyerna oftast är hamburgermenyer. På så sätt kan allmänheten ha börjat associerar hamburgermenyer med ”butiksidan/produktkatalogen”.

Under produktmenyn kan man navigera mellan:
Produkter  – En överskådlig sida där man kan läsa om de olika kategorierna samt se utbudet för underkategorierna.
Utbud – Man hittar även de fyra huvudkategorierna i den här menyn och genom att trycka på plus visas även underkategorierna.
Produktsortering – Underkategorierna har emojis för att man som kund enkelt ska kunna identifiera innehållet med hjälp av symboler.
slutet – Det finns även en sida som visar hela produktkatalogen om man skulle vilja ha det mer överskådligt.

Meny 2:” information och tjänster” – Här hittar man [om oss]  [tjänster] och [kundservice]. Navigeringsmenyerna finns på headern, så man enkelt kan hitta information om företaget, detektivtjänster samt kundfrågor.

Meny 3: ”kundhörnan” – I den här menyn finns [Mitt konto] och [Kassa]. Jag har dessutom en sökfunktion samt varukorg (shoppingbag).

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.

Svar: Mina statiska undersidor finns både i header och footer.
På header hittar man dem i menyraden. På Kundservice sidan har jag valt att samla FAQ, Policy, Kontaktformulär och integritetspolicy med knapplänkar till sidorna.

På Footer har jag istället valt att länka till sidorna med inbäddad text. Man kommer även till sidan ”om oss” genom att trycka på texten.

Detektivshops villkor:
Integritetspolicy: Här finns information om hur personuppgifter lagras och hur man går till väga för att radera personuppgifter.
Återbetalnings- och returpolicy/Policy: Eftersom att jag har en detektivshop har jag valt att erbjuda mina kunder diskret leverans, där produktinformation och logotyper inte syns på förpackningen. Det för att mina kunder ska känna sig säkra att deras identiteter inte avslöjas. Leveranstiden är på 2-5 arbetsdagar beroende på tillgänglighet i lager. Detektivshop erbjuder även 30 dagars öppet köp förutsett att produkterna är i originalförpackning. Detektivshop erbjuder dok inte returer för förbrukningsvaror, exempelvis kolpulver eller bläck, av säkerhetsskäl.

Alla mina texter under FAQ, Policy samt integritetspolicy är tematiska och jag nämner att Detektivshop är en demoshop i utbildningssyfte med fiktiva svar.

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

Svar: Jag har valt att använda mig av två kontaktformulär. Det ena hittar man under Kontakt och det andra under Tjänster.
Kontakt – är till för frågor och fungerar som en kundtjänst.
Tjänster – här kan man skicka in ett case som man behöver hjälp med. Detektivshop erbjuder nämligen hjälp från 4 ”olika” experter inom området detektivarbete.

 

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

Svar: Man hittar klickbara länkar till mejl och telefon på footer, under Huvudkvarteret, a.k.a adress:

 

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

Jag har valt att använda mig av 3 shortcodes på min startsida. Bästsäljare visar en specifik produkt, medan de andra två ”get the look” och ”get the supplies” visar produkter från två olika kategorier.

Här är shortcode för en enskild produkt

Här är en shortcode för kategorin Förklädnader och Accessoarer

 

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

Svar: Ja, jag har utformat både min footer och header själv med hjälp av UAE (Ultimate Addons for Elementor Lite).
Jag har en container som visar en varningstexten ”⚠️ OBS! Det här är en demoshop och går inte att handla från!⚠️” som rullar, med hjälp av HTML.
Jag har även en container uppdelad i tre block med länkar till statiska sidor, Om oss med en lite kortfattad USP, samt ett block med en fiktiv adress och kontaktuppgifter.
Längst ner på botten hittar man även en copyrightstämpel som försvann när jag avaktiverade storefronts footer.

Jag valde att göra min egen footer då det var frustrerande att ändra css med Storefronts begränsningar. Jag ville även hålla min footer informativ, kort och anpassningsbar.

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”?

Svar: som jag nämnde på fråga 9 har jag en rullande text på min footer med en varningstext ”⚠️ OBS! Det här är en demoshop och går inte att handla från!⚠️” . Jag har även nämnt att det här är en demobutik under FAQ och Policy. Det finns även varningstext i mina mejlmallar där jag skrivit ” beställningar kommer inte att skickas”.

11. I vilken utsträckning och hur har du arbetat med WooCommerce på webbplatsen?

Svar: Jag har över 49 produkter i min butik, med 4 huvudkategorier och 17 underkategorier.
Läs mer om kategorierna här: https://www.detektiv-shop.se/produkter/

Jag har ett ganska tydligt tema på min butik och har därför valt produkter och kategorier som stämmer överens med temat. Alla mina produkter har namn och beskrivningar som kan förknippas med detektivarbete. Jag ville skapa en röd tråd och har haft väldigt roligt under processen.

Utredningsstationen – innehåller kontorsmaterial och sådant man skulle kunna tänkas behöva för att skapa en kartläggningstavla.
Förklädnader och Accessoarer – innehåller produkter som är typiskt förknippade med detektiver.
Utrustning – innehåller produkter som kan hjälpa på spåret, ex förstoringsglas.
Teknik – innehåller kameror och ljudutrustning, något som en detektiv kan tänkas behöva.

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

Svar: Jag har valt att arbeta med enkla produkter men har 4 produkter med varianter. Under trenchcoat har jag som exempel varianter på storlekar och i kategorin Inkognitohörnan kan man hitta mustascher och skägg i olika modeller.

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

Svar: Jag har anpassat de flesta sidor med elementor. Man kan se det på startsidan, produktsidan, Om oss, tjänster, kundservice samt i footer och header.

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

Jag har valt att använda mig av följande:

Classic Editor – för att kunna få en bättre redigeringslayout i WordPress.
Contact Form 7 – för att kunna skapa kontaktformulär enkelt.
Elementor – För att kunna anpassa min hemsida och designa den.
One.com – Förinställd, något med performance?
Performance Cache – Gör hemsidan snabbare, förinställt, har inte valt att ta bort
StoreCustomizer – Ger fler val för att kunna redigera Woocommerce, knappar osv
Ultimate Addons for Elementor Lite – Gör det möjligt att redigera header och footer + fler tilläggsval i elementor
Variation Swatches for WooCommerce – Fler tilläggsval i elementor som är anpassade med Woocommerce
WooCommerce – Gör det möjligt att kunna handla på butiken.

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.

Svar: Jag har använt mig av tilläggen ovan, samt CSS. Med CSS har jag bland annat lagt till en hover effekt på mina produkter. Min logga har jag designat själv, jag har valt ett genomgående tema med färgval samt hover-effekter. Jag tycker min webbshop är rolig och unik. Den är tematisk och håller konsekvent fast i sin karaktär.

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.
1. Menyerna är lättåtkomliga och följer en logisk struktur. Alla länkar leder till rätt sidor samt att sökfunktionen fungerar. Det finns flera genvägar för information och sidan är i helhet enhetlig.
2. Alla produkterna har produktbeskrivningar och namn som är tematiska. Kunderna kan även läsa och lämna recensioner om produkterna.
3. Jag har implementerat flera fungerande element som shortcodes, kontaktformulär och klickbara länkar, vilket gör webbplatsen både interaktiv och användbar. Det finns även en extra tjänst där Detektivshop erbjuder sina kunder detektivhjälp (Tjänster🔍).

b. Peka på tre delar som du inte är lika nöjd med eller tycker att du hade behövt arbeta vidare med. 

1. Begränsningarna med Storefront och Woocommerce har gjort det svårt att utforma sidan som jag hade önskat. Exempel är butikssidan där jag hade velat visa produkterna i samma tema som under  https://www.detektiv-shop.se/produkter/ , samt att produktbilderna hade kunnat visas bättre.
2. Det hade varit kul att implementera ett community i form av ett forum, där detektiver kan posta anonyma meddelanden. Jag hade även velat arbeta mer på kundsidan samt ha en chattfunktion.
3. Hemsidan är tyvärr inte mobilanpassad och jag hade behövt lägga ner mer tid samt förstå hur man anpassar en webbplats på ett ultimat sätt för mobilversioner.