1.Val av tema
Jag har använt det rekommenderade temat storefront med tillägget Child theme configurator. Storefront passade bra med min typ av verksamhet, som är en e-handel där jag säljer ridkläder. Vid uppdateringar av temat är risken att vår sida kan förändras, därav skapade vi ett child theme som utgår ifrån storefront och utifrån den kan du göra förändringar på din webbplats. Vid val av tema är det viktigt att du utgår ifrån vad för typ av verksamhet du har och hur du kommer vilja anpassa din webbplats. Det kan också vara bra att titta på resencioner på temat du tänkt välja för att se om det fungerat bra för andra användare.
2.Installation av Google Tag Manager och Google Analytics
Efter att ha skapat konton på GTM och GA4 ville jag koppla ihop min webbplats med GTM och det gjorde jag genom tillägget GTM4W. Där behövde jag lägga in mitt tag manager ID. När stegen där var klara ville jag koppla ihop GA4 och GTM, det gjorde jag med hjälp av mitt measurement-id. Jag skapade sedan en Google analytics-tagg i GTM, där jag valde en utlösare för att aktivera taggen.
3. målmätning enligt digital mätplan
Min idé på webbplats ändrade sig lite under kursens gång och jag har därmed inte följt min digitala mätplan. Några kpier jag valde när mätplanen gjordes var antal klick och försäljningsvärde, dessa är fortfarande relevanta för mitt företag och kan följas upp i GA4.
4. Uppföljning kring e-handel
Här testade jag att köpa skärp elegant.
5.Hur har du utformat webbplatsens startsida och varför?
https://riderschoice.webmastern.nu/
På startsidan har jag en text som förklarar vad vi som företag erbjuder. Jag har även lagt in en bild med länk till vår påskkampanj, samt urval av produkter som visar nyheter och bästsäljare, dessa har jag lagt in med hjälp av shortcodes. Jag har valt att skapa startsidan på detta sätt för att man ska få en bra bild av vad vi som företag erbjuder och lätt ska kunna klicka sig runt mellan olika produkter.
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? Jag har lagt in en shortcode som lyfter fram våra bästsäljare, även en med ”nyheter” detta för att lyfta fram produkterna på ett snyggt sätt och inspirera kunderna till att vilja handla av oss. I texten har jag tagit med vilka typer av produkter vi säljer och att vi erbjuder ridkläder för alla discipliner, samt ett brett utbud av storlekar.
7.Hur har du lagt upp webbplatsens meny, struktur och navigering?
Jag har lagt till kategorierna: dam, herr, accessoarer, outlet, om oss, samt underkategorier för att kunna sortera ännu mer. Jag har valt dessa för att det ska vara lätt för besökarna att hitta det de söker.
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.
Jag jämförde med andra E-handelssidor och såg vad de har för villkor, och ut efter den information jag hittade som lät passande för mitt företag bad jag chat gpt skriva ihop en text som innehöll det jag ville. Hade det varit en riktig e-handel jag skulle skapat hade jag tagit hjälp för att skriva korrekta villkor och fraktalternativ, men då detta är en demo butik tyckte jag att jämföra med andra webbsidor gav mig en bra bild av vad som var rimligt.
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 som jag installerat med hjälp av tillägget ”contact form 7” detta valde jag då det rekommenderades och var lätt att använda och enkelt att spåra. Kontaktformuläret är till för att kunna kontakta oss på ett smidigt sätt
10.I vilket sammanhang har du använt dig av shortcodes? Det skall finnas minst ett användande av shortcode på webbplatsen.
Jag har använt shortcodes för att visa bästsäljare och nyheter i startsidan. På min kampanjsida har jag även där valt en shortcode som visar produkter som ingår i min påskkampanj.
11.Hur har du utformat Webbplatsens footer och varför?
I footern har jag lagt in maillänk och telelänk, för att det ska vara lätt att nå kundservice. Jag la även in länkar till våra viktiga undersidor som köp och leveransvillkor, returpolicy och FAQ. Det fyllde ut mer och gör det lätt att hitta viktig information. Jag har även lagt in våra sociala medier med hjälp av sociala ikoner som fanns att välja i elementor.
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”?
Jag har ett butiksmedelande så när du går in på sidan står det ”detta är en demobutik för teständamål- inga beställningar kommer att behandlas” och texten förvinner inte om du inte klickar bort den själv. Vid köp av produkt får du upp att betalning sker kontant vid leverans, vilket också tyder på att köpet ej behandlas.
13.I vilken utsträckning och hur har du arbetat med WooCommerce på webbplatsen Vilka produkttyper har du arbetat med och varför?Jag har flera kategorier med ca 2-3 produkter till varje kategori, samt att jag har underkategorier för att kunna filtrera mer.För att lägga till en produkt har jag skapat en kategori, därefter skapat mina produkter och sorterat in dem i rätt kategori.Jag går in på produkter och väljer ”lägg till ny” sedan har jag valt produktnamn, beskrivningar, bilder och med hjälp av yoast, metabeskrivning, fokusnyckelord och ändrat texterna efter punkterna man får upp. Jag väljer även vad för typ av produkt och eftersom jag säljer kläder är det mest variabel produkt eftersom det är olika storlekar. När det är klart klickar jag publicera.
14.Vilka produkttyper har du arbetat med och varför?
Jag har flest variabel då jag säljer olika storlekar på produkterna, men mössor som är ”one size” har jag lagt in som enkel produkt
15.Hur har du sökmotoroptimerat din webbplats?
Jag har använt mig mycket av tillägget Yoast SEO då den var enkel att följa och gav tips när jag skapade produkterna. Genom Yoast har jag även kunnat välja pagetitel, metabeskrivning och sökord. Tyvärr har google tagit så lång tid på sig att indexera mina sidor så jag har inte kunnat jobba så mycket i searchconsole, men hade jag kunnat följa upp med searchconsole hade jag fått en bättre uppfattning om hur bra mina sökord leverarade
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å?
Jag har 7 sidor indexerade sidor och 23 publicerade. Jag har försökt lägga in sidorna manuellt men då får jag upp att kvoten har överskridits, så det har inte fungerat för mig att få sidorna indexerade. Sedan har jag en sida som ej indexerats men det är en feed sida som jag inte vill ska synas. Jag har upptäckt att det är ett problem på search console då google inte upptäcker mina produktsidor. Jag har totalt 23 sidor publicerade + 21 produkt sidor som inte vill synas på search console.
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.
Nedan är exempel på på 404 sidor som jag omdirigerat till startsidan
19.Det skall gå att prenumerera på nyhetsbrev, alternativt att anmäla sig till kundklubb.
.20.Skapa en kampanjsida med Påsk-erbjudande
Jag valde att ha -20% på utvalda produkter. Jag la in produkterna med hjälp av en shortcode som sorterade ut produkterna med nedsatta priser så jag inte behövde lägga in de manuellt. Med detta kan kunden klicka in på önskad produkt genom ett enkelt klick på kampanjsidan.
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.
22.Vilka automail skickas från din webbplats i samband med olika händelser?
De automail som skickas från min webbplats sker genom woocommerce och är:
- misslyckad beställning
- avbruten beställning
- behandlar beställning
- färdigbehandlad beställning
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 har använt ett chatbot tillägg som heter tidio. Jag har anpassat designen genom att lägga i min logga och ändrat färger så det är enhetligt med min hemsida. Nu har gratis perioden gått ut så måste betala för att få använda tillägget fullt ut, men premiumversionen var mycket bra och fungerade som jag ville genom att ta information från våra FAQ, köp och leveransvillkor och returpolicy sidor svarade den utifrån informationen som står där.
24.Vad har du implementerat för kopplingar till företagets sociala medier?
Jag har i footern lagt in ikoner, men då webbsidan inte finns på riktigt kommer du bara till facebook/instagram startsidor
25.Hur har du arbetat med Cookie-hantering och integritetspolicy?
För att jobba med cookies har jag laddat ner ett tillägg som heter cookiebot. Där var det bara att skapa ett konto och la in att följa GDPR, sedan har jag kryssat i gtm4wp att de inte skulle ske någon spårning innan användaren godkänt de.
26.Vilka andra åtgärder har du vidtagit för att skapa en säker webbplats?
För få en säker webbplats har jag SSl certifiering och ladda ner tillägget Wordfence.
27.Hur har du arbetat med att optimera bilder för webben?
Jag har redigerat bilder i photoshop för att få dem i önskat format samt beskära bilderna, sedan har jag komprimerat bilderna på https://compressjpeg.com/ Detta har jag gjort för att bilderna inte ska vara förstora så det påverkar hastigheten på hemsidan.
28.Visa på exempel på designdelar som du anpassat med hjälp av Elementor.
Min startsida och kampanjsida är både designade i elementor. Där har jag genom att lägga till behållare och widgets kunnat ändra färg,text rubriker och bilder.
29.Vilka tillägg har du använt och varför? Komplett lista önskas.
- Woocommerce – e-handelsverktyg
- Wordfence security – För säkerheten och motvärka virus
- Contactform 7 – För kontaktformuläret
- Elementor – För enkel design
- Classic editor – redigeringsverktyg
- Cookiebot – för att få cookies på hemsidan
- Childtheme configurator – temat på hemsidan
- GTM4WP – För att få igång/synka google tag manager
- Mailchimp – nyhetsbrev mm
- Redirection- för att hantera omdirigeringar
- Yoast- ett Seo verktyg
- Tidio chat- chatbot
30.Google har ett flertal verktyg för att kontrollera Page Speed och mobilvänlighet.
Jag provade använda verktyget och lade in startsidan, där fick jag allt grönt förutom performance som var på 80%. Vad jag förstår tar min cookiebanner mycket plats och det vet jag inte hur eller om man kan ändra det. Sedan varnar den för bilder som är för stora, men då jag har beskärt och komprimerat bilderna vet jag inte hur jag ska lösa det. Några fler varningar om bilder men det är för tekniskt för mig att lösa. Det står även att jag kan dra ner på oanvänd css, men jag vet inte vart jag kan hitta det.
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?
Bristerna jag kan hitta på min webbplats är indexering och mobilvänlighet.
Eftersom det inte fungerar att indexera fler sidor kan inte Google hitta dem. Jag har försökt jobba med detta genom att lägga in sidorna manuellt men får alltid upp att kvoten överskridits. Detta är ett jättestort problem då sökmotorerna inte hittar mina sidor och därmed har jag sämre chans att synas.
Något jag märkte vid den tekniska valideringen var att jag behöver jobba mer med mobilvänligheten, sidorna syns inte på samma sätt i mobile som i desktop. Designen blir inte samma och det ser jag som ett problem då det flesta besökare använder mobilen. I föregående uppgift märkte jag även där att performance var väldigt låg på mobile, men för tekniskt för mig att kunna lösa idag.
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é?
Jag har ändrat sidhuvudet på webbsidan och ändrat färger så det är enhetligt, samt lagt till min logga. På startsidan har jag lagt in inspirerande bilder och urval av produkter (både för designen men också för funktionalitet). Jag har redigerat mina bilder i photoshop eller canva för att få dem lite roligare med text på, exempel på det är påskkampanj bilden på startsidan eller bilden neden som finns på vår FAQ sida.
Min plan var från början att ha en bild som sidhuvud men jag fick inte till bilden i den storlek jag önskade och jag insåg att det är temat som inte låter mig ändra. Hade jag vetat att temat var så begränsat hade jag valt att byta tema, men har inte vågat ändra då det är risk att allt försvinner på sidan. Jag har fokuserat på att allt ska fungera och designen har kommit därefter.
