Inlämningsuppgift
1. Val av tema
Efter övervägande och utforskning av olika teman för min e-handel, valde jag att gå med Hestia. Till skillnad från det rekommenderade temat, Storefront, tyckte jag att Hestia erbjöd en snyggare och mer stilren layout som jag tyckte passade bättre för min e-handel. Jag tycker att Hestia är ett väldigt enkelt tema och hade anpassningsbara funktioner vilket också var en bidragande faktor till varför jag valde temat.
2. Installation av Google Tag Manager och Google Analytics.
Hur har du gått tillväga vid installation av Google Analytics? Fungerar mätningen som det skall? (visa gärna med skärmdumpar)
Då vi redan hade öppnat upp ett Google Analytics konto så var det väldigt lätt att lägga till en ny webbplats att spåra, genom att lägga till ny egendom och sedan klicka i vad man vill spåra så var allt igång. Efter det får man spårningskoder som man kopplar till andra spårningskanaler så som Google Tag Manager. Där kan man spåra respektive delar, exempelvis e-handelsspårningar och konverteringar.
3. I kursen Digital Marknadsföring skapade du en digital mätplan. Är den mätplanen fortfarande aktuell, eller är det något som tillkommit/fallit ifrån? Använd dig av mätplanen som grund och se till att få dina målmätningar på plats. Jag vill här se att du mäter och följer upp de KPI:er som du tänkt dig, plus att mätningen fungerar.
Jag tycker att jag har följt den digitala mätplanen så gott det går, men man märkte tydligt att det va lite svårt att följa den till 100% då man stötte på olika moment som gjorde att man fick tänka om lite. De KPIer som jag satte upp var väldigt generella som tillhör en e-handel. Men en KPI som jag ville kunna följa upp var hur många som började prenumerera på produkterna och den går att följa upp.
4. Uppföljning kring e-handelsspårning. Visa att det går att köpa och att e-handelsspårningen fungerar.
Det går att genomföra ett köp via Green Clean och man får även en bekräftelse på mejlen. Det går även att spåra hela köpresan i Google Analytics.
5. Hur har du utformat webbplatsens startsida och varför?
Jag har börjat med en tydlig header där man ser loggan tillsammans med navigationslänkar för att kunna guida till olika delar av webbplatsen. Därefter finns det en stor rubrik tillsammans med en övertygande text som förklarar kortfattat vad företaget handlar om. När man sedan fortsätter att scrolla ner så möts man av produktkategori där man ska se några av produkterna som man kan köpa, man kan även se kundrecensioner som kunder har lämnat för att visa en trovärdighet.
Vidare så finns det en “Call-to-action”, i form av en prenumerationstjänst som man direkt kan fylla i som uppmuntrar besökarna att vidta åtgärder som att börja prenumerera. Slutligen, i sidfoten, finns viktiga länkar till andra delar av webbplatsen, juridisk information och länkar till sociala medieplattformar, samt kontaktinformation om öppettider och kontaktuppgifter.
6. Utvalda produkter (bästsäljare eller kanske de med bäst marginal) skall lyftas fram på startsidan. Där bör även finnas usp:ar och en säljande beskrivning av företaget/verksamheten. Hur har du resonerat här?
När man fort kommer in på webbplatsen så möts man av en stor rubrik och en USP, som lyder “Din destination för miljövänliga städprodukter och en hållbar livsstil! Hos oss hittar du ett brett utbud av rengöringsprodukter som inte bara tar hand om ditt hem utan också tar hand om planeten. Utforska vår kollektion av skonsamma och effektiva produkter och låt oss tillsammans göra en positiv skillnad för miljön!” I denna USP ligger störst fokus på miljövänliga städprodukter och en hållbar livsstil. Genom att erbjuda ett brett utbud av rengöringsprodukter som inte bara tar hand om ditt hem utan också tar hand om planeten, skiljer det sig från många traditionella städprodukter som kan vara skadliga för miljön. Denna inriktning tilltalar en målgrupp av konsumenter som vill minska sin miljöpåverkan och välja ett mer hållbart alternativ. Med ett unikt sortiment av miljövänliga produkter som är både skonsamma och effektiva, ger vi kunderna möjlighet att göra val som gynnar både deras hem och planeten. Genom att uppmuntra till en positiv skillnad för miljön förmedlar vi inte bara ett erbjudande utan också ett budskap och ett starkt engagemang för hållbarhet, vilket kan skapa en starkare koppling mellan företaget och våra kunder baserat på delade värderingar och mål.
7. Hur har du lagt upp webbplatsens meny, struktur och navigering?
Beskriv hur du lagt upp dessa delar. Följer det hela en logisk struktur?
Jag ville skapa en så enkel meny som möjligt, jag vill att min webbplats ska vara enkel att förstå och att det ska vara lätt att hitta. Så för att skapa en enkel och lättförståelig menystruktur så har jag åtta stycken med tydliga rubriker för att minska risken för förvirring. Jag har även valt att behålla de mest relevanta högst upp i menyn, medans policys och frågor och svar finns längst ner i footern. Denna minimalistiska design och logiska struktur gör det enkelt för besökarna att hitta den information de behöver och utforska webbplatsen.
8. Det skall finnas statiska undersidor 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.
Jag har tagit en färdig mall från https://www.nordiskehandel.se/forslag-pa-kopvillkor där det inkluderar priser, ångerätt, cookies, leveranser och returer. Jag valde denna mall för att jag tyckte att den passade min e-handel samt hade tydliga villkor. I min integritetspolicy så tog jag exemplet som fanns i WordPress/Woocomerce. Jag tyckte även den är att det var relevant information mot besökarna.
9. Vilka kontaktformulär har du på webbplatsen och vad har de för syften? Det skall finnas minst ett kontaktformulär på webbplatsen.
Jag har ett kontaktformulär där man ska kunna komma i kontakt med butiken som ligger under sidan “Kontakta oss”. Jag har valt att skapa ett kontaktformulär för att kunden lätt ska kunna skicka iväg ett meddelande. Ovan formuläret finns även andra alternativ att komma i kontakt med oss, samt se öppettider.
Jag har även ett “kontaktformulär” som är utformat som ett prenumerationsformulär
som ligger på startsidan men också på en egen sidan som heter “Prenumerera”, i det formuläret går det att fylla i kontaktuppgifter, vilka produkter man vill prenumerera på, hur ofta man vill få hem produkterna samt välja betalsätt och leverans. När man sedan skickar iväg formuläret så får man en bekräftelse på sin mejl att beställningen är mottagen.
10. 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 implementera en shortcode som ett kontaktformulär som man kan hitta under “Kontakta oss”. Den koden kommer ifrån Contact Form 7.
11. Hur har du utformat Webbplatsens footer och varför?
Webbplatsens footer är utformad för att besökarna ska kunna kunna hitta ytterligare information och funktioner. Genom att inkludera öppettider för kundtjänst, telefonnummer och e-postadress ger vi användarna möjlighet att snabbt få hjälp vid behov. Dessutom erbjuder vi länkar till viktiga sidor som köpvillkor, integritetspolicy och information om ingredienser till våra produkter för att ge användarna tillgång till viktig information. Slutligen inkluderar vi även länkar till våra sociala medier för att användarna ska kunna följa oss och hålla sig uppdaterade med nyheter och erbjudanden. Genom att utforma footern på detta sätt gör vi det enklare för användarna att hitta den information de behöver och interagera med vårt företag på olika sätt.
12. 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”?
Webbplatsen får upp ett pop-up-meddelande när man först kommer in på webbplatsen för att signalera för besökarna att det inte går att handla på webbplatsen. Meddelandet kommer även upp i en annan färg än webbplatsen färger för att det ska bli så tydligt som möjligt. För att få upp detta meddelande så redigerar man det i WordPress egna redigerare och där man sedan aktiverar att ett butiks meddelande ska synas.
13. 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. Undantag till detta kan finnas om det främst är tjänster som erbjuds, stäm av med Daniel om så är fallet.
Jag har arbetat med WooCommerce på webbplatsen för att skapa en komplett och engagerad e-handel för besökarna. För att säkerställa att produkterna är lättillgängliga och välorganiserade har jag skapat produktlistor och kategorier. Just nu finns det totalt 12 produkter och fem produktkategorier på min webbplats. För att göra shoppingupplevelsen så smidig som möjligt har jag också lagt till tilltalande produktbeskrivningar för varje produkt. Dessa beskrivningar ger användarna information om produkterna och vad de innehåller. Utöver detta har jag anpassat designen och layouten för att säkerställa att produktlistorna och kategorierna är tydliga och lätta att navigera. Detta innebär att besökarna enkelt kan hitta de produkter de är intresserade av och utforska olika kategorier utan svårigheter. Slutligen har jag implementerat köpfunktioner som lägger till produkter i varukorgen, visar totalpris och möjliggör enkel checkout-process för kunderna.
14. 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 göra alla mina enkla, detta för att alla mina produkter säljs separat men också för att mina besökare lätt ska kunna hitta det de söker. Däremot så har jag länkat produkter till de andra för att uppmuntra till merförsäljning.
15. Hur har du sökmotoroptimerat din webbplats?
Vilka åtgärder har du vidtagit och vad har du fått för resultat? Knyt också gärna an till den sökordsanalys som du gjorde i kursen Digital Marknadsföring.
Jag har sökordoptimerat med hjälp av YOAST SEO-plugin i WordPress för att förbättra synlighet och ranking. En av de åtgärder jag vidtagit är optimering av meta-tags, inklusive meta-titlar och meta-beskrivningar, för varje sida och inlägg, och det har jag implementerat i rubriker och brödtext.. Jag har försökt att använda så relevanta och lockande sökord som möjligt. Dessutom har jag optimerat mina bilder genom att namnge dem med relevanta sökord och inkludera beskrivande alt-attribut. Mina resultat har inte varit det jag har hoppats på, jag har endast nått exponeringar på “miljövänlig fönsterputs” och “köksspray” och inga klick. Så det är något som jag hade kunnat lägga mer tid på för att få mer exponering och klick.
16. Visa på exempel från Google Search Console på sökfraser som du tagit position och eventuellt även drivit trafik på.
17. Hur många indexerade sidor har din webbplats och hur väl stämmer det överens med antalet publicerade? Vad beror eventuell skillnad på?
Av 49 upptäckta sidor så är bara 13 stycken indexerade. Detta kan bero på tekniska problem, dålig länkstrukt eller låg kvalitet på vissa sidor. Med tanke på att webbplatsen är relativt nu så kan det också bero på det. För att kunna indexera resterande sidor så kan man kolla på de tekniska aspekterna, innehållskvalitet och intern länkstruktur. Genom att förbättra dessa faktorer kan jag öka chansen att alla viktiga sidor på min webbplats indexeras korrekt.
18. För att undvika att borttagna sidor indexeras felaktigt, så bör webbplatsägare arbeta med så kallade redirects. Visa på ett par sidor där du gjort detta genom att länka till dessa.
19. Det skall gå att prenumerera på nyhetsbrev, alternativt att anmäla sig till kundklubb. Även i dessa fall är spårning i Google Analytics att rekommendera, men inget måste.
Jag erbjuder två olika prenumerationsalternativ för att passa olika behov. För det första har vi vårt nyhetsbrev, vilket är tillgängligt genom ett popup-fönster och återfinns även längst ner på startsidan. Detta alternativ låter dig hålla dig uppdaterad med de senaste nyheterna och erbjudandena från oss. För det andra erbjuder vi en prenumerationstjänst där du kan prenumerera på specifika produkter. Denna tjänst är också synlig på första sidan och kan enkelt nås genom två andra platser på webbplatsen: en länk längst upp på sidan och en annan under menyn ”Prenumerera”. Det här alternativet ger dig möjlighet att få regelbundna leveranser av dina favoritprodukter direkt till din dörr.
20. Skapa en kampanjsida med Påsk-erbjudande.
Denna kampanjsida skall vara skapat med hjälp av Elementor och innehålla följande delar:
- En textruta med bakgrundsfärg
- Produktbild och text
- Länk till produkten
- Produkten ska ha ett nedsatt pris till 2024-04-01
Beskriv ditt resonemang kring sidan och länka till den i ditt svar.
https://greenclean.webmastern.nu/kampanjer/
Jag skapade min kampanj sida i Elementor. Jag valde att göra min bakgrund grön så att den matchar de andra delarna av webbplatsen. Jag har kopplat min Vårkampanj till vårstädet, och där skrivit en tilltalande text. För att förstärka känslan av påsk och vår anpassade jag bakgrundsfärgen till en ljusgrön nyans, vilket inte bara passar temat för Påsk utan också matchar övriga delar av webbplatsen för en enhetlig estetik. Jag har via Elementor lagt till “Woo on sale product”, och där kunde den direkt hitta alla produkter som är på nedsatt pris. Under min kampanj text har jag tydligt skrivit hur länge kampanjen är giltig.
21. Skicka ett mailutskick med ett speciellt Påskerbjudande till de som prenumererar på nyhetsbrevet eller är med i kundklubben. Lägg först till mailadressen
student@highendmedia.se i mailgruppen. Missa inte att utm-tagga kampanjlänken så att den sedan kan följas upp i Google Analytics.
Jag fick ett problem med Mailchimp och fick aldrig möjligheten att skicka ett kampanjmail.
22. Vilka automail skickas från din webbplats i samband med olika händelser?
Beskriv och visa på exempel.
Jag fick ett problem med Mailchimp och fick aldrig möjligheten att lägga till några automationer.
23. Kunder vill ofta få snabba svar på korta frågor, visa på implementerad chatfunktion och hur den är anpassad för att den passa in i webbplatsens design.
Jag valde att installera Tawk.to-plugin. Detta va den jag hann utforska mest utav, hade jag utforskat andra alternativ så finns det nog bättre ute på marknaden, men den funkar just nu. I denna chatt har jag valt att ta bort “sök fråga” för att om det skulle funka var man tvungen att programmera alla svar, och den tiden fanns tyvärr inte. Så jag har valt att endast ha chattfunktionen.
24. Vad har du implementerat för kopplingar till företagets sociala medier?
Beskriv och visa på exempel.
Jag har valt att länka alla sociala kanaler i footern.
25. Hur har du arbetat med Cookie-hantering och integritetspolicy?
Jag har installerat CookieBot-plugin på min webbplats för att hantera cookie-policy för att uppfylla lagkraven för cookie-hantering och integritet. Med Cookiebot kan vi rapportera och hantera cookies på webbplatsen för att säkerställa att besökarna får tydlig information om vilka cookies som används och deras syfte. Detta hjälper till att öka transparensen och skapa förtroende hos besökarna genom att ge dem kontroll över sina personuppgifter och cookie-inställningar.
26. Vilka andra åtgärder har du vidtagit för att skapa en säker webbplats?
För att säkerställa att min webbplats är säker så har jag för det första skapat en SSL-certifiering för att kryptera dataöverföringar och skydda användarinformation. Utöver detta håller jag min webbplats uppdaterad av plugins, teman och WordPress-versionen för att minimera sårbarheter. Med hjälp av plug-in som Wordfence skyddar jag min webbplats mot kapningar.
27. Hur har du arbetat med att optimera bilder för webben?
Beskriv och visa på exempel.
Jag har valt alla mina bilder från Pexels, jag hittade sedan en fotograf som hade exakt det jag var ute efter och fler olika bilder i samma “serie”. Jag hoppades på att jag skulle hitta bilder i samma tema för att få en mer stilren och realistisk e-handel som möjligt. Jag redigerade sedan bilderna i Canva och beskärde alla bilder till samma storlek. Refillprodukterna fick jag redigera i Photoshop, för att jag ville ha samma bild men olika innehåll i rören för att visa att det var olika “rengöringsmedel”.
28. Visa på exempel på designdelar som du anpassat med hjälp av Elementor.
Vilka tillägg har du använt och varför? Komplett lista önskas.
Jag har använt tillägg som;
- Classic Editor. Ett redigeringsverktyg som är bra att använda för att redigera innehållet på webbplatsen.
- Contact Form 7. Kunna skapa kontakt formulär.
- Cookibot. Ett Cookies-verktyg för att kunna spåra och samla in data från besökare.
- Elementor. Redigeringsverktyg för att kunna skapa snygga layouter till webbplatsen.
- GTM4WP, Google Tag Manager. För att kunna sätta upp relevanta spårningar på webbplatsen.
- Mailchimp. För att kunna skapa automationer kring mailutskick och liknande. Funkade däremot inte för mig.
- Orbit Fox Companion. Ett redigeringsverktyg som skulle vara kompatibel med mitt val av tema, kom inte till användning under arbetet.
- Otter – Page Builder. Ett redigeringsverktyg som skulle vara kompatibel med mitt val av tema, kom inte till användning under arbetet.
- Redirection. För att lätt kunna leda vidare till andra sidor om de inte funkade eller hade ett 404-error. Bra att ha för att kunna indexera sina sidor.
- Tawk.to. Chat-tillägg till webbplatsen.
- WooCommerce. Nödvändigt att ha för att skapa en e-handel.
- WP Child Theme Generator. Genom att använda ett child theme kan användare göra anpassningar i sitt WordPress-tema utan att riskera att förlora ändringar vid framtida uppdateringar av det ursprungliga temat.
- WP Forms Lite. Jag använde detta plug-in för att skapa olika formulär, bland annat för prenumerationsformuläret.
- YOAST SEO. Viktigt att använda sig av för att kunna sökordsoptimera sin webbplats.
30. Google har ett flertal verktyg för att kontrollera Page Speed och mobilvänlighet. Testa verktygen nedan och kommentera resultatet. I de fall du kan göra förbättringar, gör även dessa för att visa på före/efter. https://pagespeed.web.dev/
Dessa är resultatet för mobil och dator.
31. Vid en teknisk validering av din webbplats, finns det några andra brister som du
identifierat? Vilka av dessa har du i så fall åtgärdat och vilka kvarstår att arbeta vidare med?
Båda delarna, mobil och dator, lider av en försämrad prestanda, vilket kan bero på olika tekniska fel. Exempelvis kan det finnas tunga bilder som drar ner hastigheten, eller att det finns för många plug-ins som belastar webbplatsen. När det gäller tillgängligheten finns det brister, eftersom vissa delar kan vara svårlästa på grund av textfärgen eller andra faktorer. Dessa exempel är tagna den 10:e mars och är efter att jag har åtgärdat några av många problem, innan så fanns det ingen som var grön.
32. 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.
Jag har lagt mycket tid åt det visuella delarna på min webbplats, valet av tema och noggrant utvalda bilder för att det ska se så “verkligt” ut som möjligt. Genom att satsa på en minimalistisk design har jag arbetat efter att skapa en webbplats som är enkel att förstå och navigera. Från idé till nästan färdig produkt är jag mycket nöjd med vad jag har uppnått. Under resans gång insåg jag dock att det finns många tekniska delar att ta hänsyn till. Även om den visuella delen är på plats finns det fortfarande brister när det gäller de tekniska aspekterna. Trots detta har processen från idé till skapelse varit lärorik och inspirerande. Man inser hur mycket man kan göra för att skapa en snygg och effektiv webbplats, och det finns möjligheter att ändra och förbättra sig längs vägen.