Förstå och förbättra CTR på startsidan
•Descargar como PPTX, PDF•
0 recomendaciones•58 vistas
En case-presentation om ett projekt jag gjort med Thule där vi analyserad och optimerade startsidan för att bättra matcha de förväntningar besökarna har. Föreläsning för Internet i fokus i Malmö från 2018-04-10.
Recomendados
Recomendados
Más contenido relacionado
Destacado
Destacado (20)
Förstå och förbättra CTR på startsidan
- 1. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 1
- 3. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 3
- 4. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 4 Thule.com 70+ marknader 20+ språk 10M+ organisk trafik* *Årligen - Uppskattning från ahrefs
- 5. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 5
- 6. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 6 Start Kategori Produkt 28% 31% 30%
- 7. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 7 Start Kategori Produkt 28% 31% 30% Ryggsäckar Barnvagnar Blå backpacking ryggsäck Thule Urban Glide Thule Thule.com
- 8. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 8 Kategori Mest sökvolym Störst konkurrens Produkt Mycket sökvolym Medel konkurrens Start Låg sökvolym Låg konkurrens 3 1 2
- 9. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 9
- 10. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 10 Startsidan i fokus • Trafikkällor • Bounce Rate • Time on page • Next page path
- 11. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 11 Startsidan i fokus Trafikandel Organisk sök Direkt Hänvisning Betald sök Social
- 12. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 12 Startsidan i fokus • Bounce Rate • Lägre är bättre.Vi vill inte att besökarna ska lämna oss direkt • Time on page • Stannar besökaren länge nog för att ta del av innehållet? • Next page path • Var tar besökaren vägen efter startsidan?
- 13. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 13 Next page path
- 14. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 14 Next page path • Var tar besökaren vägen efter startsidan? • ~5-10% klickar på startsidans innehåll • ~60-70% går direkt på menyn • ~20-30% lämnar webbplatsen5-10% 50-60%
- 15. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 15 Startsidan i fokus • Vad vet vi om besökaren? • googlat ”Thule” • skrivit www.thule.com • klickat på en länk till thule.com • navigerar sig snabbt bort från sidan • använder sällan klickbara ytor
- 16. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 16 Startsidan i fokus Bekanta med Thules varumärke Vill navigera sig vidare Har ett mål med sitt besök
- 17. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 17
- 18. SERVA BESÖKARNA – SNABBARE & BÄTTRE! Thules startsida ska hjälpa besökaren nå sitt mål, så snabbt och enkelt som möjligt. 2018-04-10 18
- 19. SERVA BESÖKARNA – SNABBARE & BÄTTRE! Thules startsida ska hjälpa besökaren nå sitt mål, så snabbt och enkelt som möjligt. 2018-04-10 19
- 20. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 20 Ny startsida • Mest populära kategorier först • Stora inspirerande bilder • Introducerande texter • Nyheter inbäddat i listan
- 21. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 21 50-60% 15-30% …och lägre bounce rate 5-10% 60-70%
- 22. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 22 Var det allt? Nix! • Vidareutvecklad design • A/B-tester • Användartester • Personalisering • Mer webdesign
- 23. SERVA BESÖKARNA – SNABBARE & BÄTTRE! Thules startsida ska hjälpa besökaren nå sitt mål, så snabbt och enkelt som möjligt. 2018-04-10 23
- 24. SERVA BESÖKARNA – SNABBARE & BÄTTRE! Mäta laddtider 2018-04-10 24 Laddtester Real User Monitoring
- 25. SERVA BESÖKARNA – SNABBARE & BÄTTRE! Laddtider och Bounce Rate 2018-04-10 25 21% 25% 27% 34% 41% 46% 52% 56% 62% 70% 2 sekunder3 sekunder4 sekunder5 sekunder6 sekunder7 sekunder8 sekunder9 sekunder 10 sekunder 11 sekunder Bounce Rate
- 26. SERVA BESÖKARNA – SNABBARE & BÄTTRE! Laddtider och Sidvisningar p besök 2018-04-10 26 7.2 6.0 5.3 4.4 3.8 3.4 2.9 2.8 2.5 2.4 2 sekunder3 sekunder4 sekunder5 sekunder6 sekunder7 sekunder8 sekunder9 sekunder 10 sekunder 11 sekunder Sidvisningar p besök
- 27. SERVA BESÖKARNA – SNABBARE & BÄTTRE! 2018-04-10 27 Mek-dags! • http/2 • Laddar ”allt” på samma gång • Responsiva bilder • Laddar rätt bilder till rätt skärm • Lazy loading • Laddar fullstora bilder sist av allt
- 28. SERVA BESÖKARNA – SNABBARE & BÄTTRE! Gör det själv! • Identifiera målgruppen och dess behov • Var kommer de ifrån? • Vad gör de? • Formulera ett mål utifrån besökarnas ambitioner • Hur mäter ni förbättringar? • Efterforska, testa och implementera förändringar • Samla in all kompetens som behövs • A/B-tester, KPIer, användartester, laddtider 2018-04-10 28
- 29. SERVA BESÖKARNA – SNABBARE & BÄTTRE! Tack till Thule! 2018-04-10 29
- 30. TACK FÖR ATT NI LYSSNAT! Vi söker AdWords-specialister i Malmö! 2018-04-10 30
Notas del editor
- Mitt namn är Linus och jag är byråchef här i Malmö för Web Guide Partner. Här nere är vi nyöppnade, men har funnits i Stockholm sedan länge och där har jag ca 30 kollegor. Vi är specialiserade inom digital synlighet och digitala strategier, med spets inom organisk och betald sök, men vi erbjuder också tjänster inom sociala medier och digital analys, och det är kring det sista ämnet jag tänkte prata lite idag.
- Som ung körde jag motocross, och det hände då och då att vi åkte på träningsläger, och det är ett av dem tillfällena som ofta återkommer till mig. Det är nämligen så I motocross, precis som i många andra motorsporter, finns ett särskilt sätt att köra igenom kurvor på platt mark. Det kallas för att man skär apex, och i grunden kan man säga att det handlar om att köra igenom kurvan så flackt som möjligt och på så sätt bibehålla så mycket fart som möjligt. Även som unga motocrossförare, visste vi detta. Men så på detta specifika träningsläger stannar vår tränare oss vid en av banans kurvor, och han ställer frågan hur en kurva ska tas. Någon räcker upp handen o säger att vi ska ta den så flackt som möjligt. ”Varför i hela friden gör ni inte det då?!” och när han tar ett steg åt sidan så ser vi våra spår, mörka i jorden, mitt i banan, precis där dom INTE ska vara… Trots att vi egentligen visste hur en sväng skulle tas, så gjorde vi fel, och fortsatte vi köra i samma spår. Helt enkelt för att det var det alla andra gjorde, det såg vi ju på spåren i marken! Problemet här var att förarna körde där på sina motorcyklar. Varv på varv, och de är så upptagna med att köra fortare, bromsa senare, växla smartare, att de inte har tid att fundera på om de ens kör i rätt spår. Det är en dum sak att göra i motorsport, men som ni kommer se snart, kan det vara dumt i webbutveckling också.
- För att ta er igenom min föreläsning idag ska vi kika på ett case som jag gjort tillsammans med Thule. Thule.com är en stor och ganska komplex sajt med många språk och marknader, mycket produkter, men också en kul sajt då den har mycket trafik, vilket betyder att även små justeringar och ändringar kan få stort utfall. Under mina 2,5 år hos Thule hann vi göra en hel del projekt, och jag har fått tillåtelse att gå igenom ett av de allra sista med er nu. Men vi börjar från början..
- När jag började jobba på Thule, gjorde vi en analys av all vår inkommande trafik. Inte förvånande var det organisk sök som stod för den största andelen, och störst på organisk sök är, som vi alla vet, Google. Det är inte osannolikt att samma sak gäller era webbplatser.
- Det som kanske förvånade mig en aning var hur den organiska trafiken var fördelad; Ungefär en tredjedel av den organiska trafik landade på en produktsida, en tredjedel på kategorisida och en tredjedel på startsidan. En liten andel på 10% landade direkt på support, reservdelar, inspiration osv.
- Vi kunde snabbt konkludera ungefär vilka sökord som förknippades med vilka typer av sidor. Till startsidan kom mest organisk trafik där sökaren hade Googlat på varumärket, tex Thule eller thule.com. Till kategorisidorna kom ord och fraser som kunde vara brandade, men de stora volymerna låg på kategorinamn som ryggsäckar, barnvagnar, takboxar. Till produkterna kom oftast besökare som sökt på ett specifikt produktnamn, men även en del long tail trafik.
- Efter lite fortsatta analyser valde vi att prioritera vårt arbete där vi såg mest sökvolym och tuffast konkurrens, så det var Kategorierna först, Produkterna sen och sist startsidan. Det är relevant att lyfta fram i detta sammanhanget, för precis som med alla andra tips ni får under dagen idag är det viktigt att prioritera rätt saker. Jag säger inte att er startsida inte är viktig. När vi hade jobbat med och lanserat nya kategorisidor, gjort vad vi kunnat och velat med våra produktsidor, så var det startsidans tur att sättas under lupp, och det ska vi återuppleva nu.
- Ungefär så här såg Thules startsidan ut runt tiden jag börjar jobba med dem. En bra och tydlig meny in till produktkategorierna, en stor bildkarusell som användes för att pusha nyheter eller säsongsprodukter och under fanns 6 st ”puffytor” där vi lyfte produktnyheter, kampanjer eller genvägar in på andra delar av sajten.
- Vi ville förstå vem som kom till startsidan och vad de ville göra där, för att att på så sätt serva dem besökarna bättre. Poängen var att försöka lägga fokus på vad besökarna ville åstadkomma, snarare än att lägga fokuset på vad VI ville säga och vad VI ville nå ut med. Och det skulle visa sig, att de sakerna inte alls låg i linje med varandra.
- Vi började med att försöka förstå var besökarna kommer ifrån, det skulle också ge oss en ide om vilka förväntningar de kom in med. Precis som med övriga sajten var organisk sök en stor kanal in till startsidan, men här var även direkttrafik med i leken, och hänvisningstrafiken var högre än snittet. Vad säger det oss? Vi vet att startsidan rankar på mycket brandade termer, som Thule eller thule.com. Direkttrafiken betyder att besökarna har sparat ett bokmärke, eller faktiskt matat in www.thule.com i browsern. Det här är alltså besökare som redan känner till Thule. Ungefär samma resonemang går att dra om hänvisningstrafiken – besökare som klickat på en länk till thule.com har antagligen gjort det från en artikel, eller en länkad logga hos en ÅF. De har då också en kännedom om Thule, och kanske tom kännedom om specifika produkter.
- Sen började vi kolla på vad de redan gjorde. Mest värde fick vi genom att i Google Analytics kolla på tre specifika metrics; Bounce rate, tid på sidan, och Nästa sida. Bounce rate vill vi ska vara så låg som möjligt. Det är ingen självklarhet, men för den här sidan är det ändå så. Hade det funnits ett nyhetsflöde eller en informationsfilm eller liknande hade vi kanske varit nöjda med en hög BR om det inneburit att besökaren tog del av detta. Thule hade redan en ganska låg Bounce rate, men vi ville hålla ett öga på den siffran så den inte påverkades negativt av våra ändringar. Tid på sidan avslöjade för oss ifall besökaren ville navigera sig bort på en gång, eller faktiskt hängde kvar för att ta del av informationen som ändå fanns. Det visade sig att den genomsnittliga besökaren var inte kvar på sidan länge nog för att se bild två i bildspelaren, vilket givetvis fick oss att ifrågasätta dess prominenta placering. Det mest intressant var att se hur besökaren navigerade sig vidare från startsidan.
- En hade kunnat tro att den stora majoriteten av besökarna väljer att klicka på någon av de stora grafiska ytorna på startsidan. Det här är ju trots allt vad vi på Thule valt att prioritera, kanske beroende på säsong eller produktsläpp. Dessutom täcker de en stor del av skärmytan, både på mobil och desktop. Men.. så var det inte. Faktum är att det i vissa marknader var så lite som 5% som klickade på någon av dessa ytorna. Den största majoriteten av besökarna gick raka vägen upp i menyn för att navigera sig vidare till webbplatsen. Vi ska hålla kvar lite här.
- Ungefär så här såg fördelningen ut, med skillnader I olika marknader. I vissa fall så lite som 5% som valde att klicka på någon av dessa klickbara ytorna. 1 av 20. Men varför så lite? Kommer ni ihåg vad vi sa om vem som kommer till startsidan? De vet redan vilka Thule är! Det betyder också att de gått till Thules webbplats av en specifik anledning - kanske vill de kolla takboxar eller se priset på en specifik barnvagn. Kanske hitta en återförsäljare som säljer ryggsäckar, eller så är de redan kunder och vill hitta manualer eller reservdelar till en specifik produkt. Det verkar varje fall väldigt få som tänker "Jag ska nog gå till www.thule.com och se om de har några nyheter på sin startsida..."
- Så vad vet vi då om besökarna som kommer till Thule.com? Det vi kunde fastställa var: De har googlat “Thule”, klickat på en länk eller skrivit “www.thule.com” i adressfältet. De navigerar sig snabbt bort från startsidan, men det är sällan de använder de klickbara ytorna.
- Besökarna är alltså bekanta med Thules varumärke, de vill navigera sig vidare för de har ett mål med sitt besök.
- Varför har Thule designat sin startsida så då? Om det nu inte är så många som vill hitta produktnyheter? Adidas gör det, Volvo gör det, Apple gör det. Jag tror helt enkelt att Thule gjorde samma sak som jag gjorde när jag körde motocross. De gick helt enkelt på alla andras spår, vad alla andra gjorde. Så vi bestämde oss för att hoppa av hojen ett tag. Ställa oss vid sidan av och ställa frågan, om vi struntar i hur alla andra kör. Hur tror vi att det mest effektiva spåret skulle sett ut? Översatt till jobb-språk: Om vi inte tittar på konkurrenterna, utan bara på våra besökares behov; Vad ska vår startsida göra?
- Svaret på frågan var; Vår startsida ska hjälpa besökaren nå sitt mål, så snabbt och enkelt som möjligt.
- Vi bestämde oss alltså för två saker. Och den ena delen; “enkelheten” resulterade i ett nytt designförslag på startsidan.
- Det här blev vad vi gjorde. Det är mer eller mindre en lista med de mest populära kategorierna först. En trevlig miljöbild och en text som introducerar produktkategorin och skapar rätt förväntning hos besökaren. Här finns också möjligheten att lyfta fram vissa produktnyheter på specifika kategorier. Tex om Thule släpper en ny cykelhållare, så kan den visas i bilden och nämnas i texten. Det här gav resultat!
- Interaktionerna med menyn var fortfarande hög, upp till 1/3 av besökarna gick direkt på menyn, men upp till 2/3 gick istället på de nya klickbara ytor på startsidan. Utöver detta sjönk Bounce rate. Var detta allt? Klara nu?
- Vi satte igång direkt efter lansering med A/B-tester, några som var positiva och som fungerade ännu bättre än den nuvarande designen. Trots att jag inte är kvar, vet jag att Thule inte vilar på hanen på detta. Projektet är inte klart! Hade jag varit i deras skor hade nästa steg varit att köra fler intervjuer och användartester, samt att börja implementera personalisering. I nuläget är sorteringen på de generellt sätt mest populära kategorierna, men det vore coolt om återkommande besökare hade fått ordningen satt efter hur deras intresse ser ut. All datan som smalas in kan sen gå som input till en webdesigner som skapar en layout som sen kan implementeras och testas.
- Men sen bestämde vi oss för att göra en sak till. Det var nämligen inte bara goda nyheter med den nya designen. Fler stora bilder betydde mer data att ladda ner, och saker som AB-testing och personalisering tar också en del tid att ladda och utföras. Så för att leva upp till “snabbt” var vi tvungna att lägga en del fokus på att förbättra webbplatsens laddtider. Några av de mest avgörande teknikerna tänkte jag belysa!
- Precis som med webbstatistik gäller det att mäta förbättringar i laddtider. Vi använde två olika tekniker. Laddtesterna är bra för de kan utföras på alla webbplatser, och du får resultat vid begäran. Populära verktyg är Google Page Speed Insights, eller Yahoos Yslow. Med något av dessa verktyg får du reda på hur lång tid de olika delarna på din server och webbplats tar på sig för att generera en färdig sida. Nackdelen med dessa verktyg är att de oftast körs från en särskild plats, tex från en server i USA eller Tyskland och när du kör testet vet du inte vad för andra resurser som är igång just då. Kanske utförs en schemalagd tjänst eller så har ni mycket trafik just när testet görs. Det gör att resultaten kan variera, och därmed också vara ganska missvisande. På Thule kompletterade vi laddtesterna med en sk Real User Monitoring tjänst. Vad den gör är helt enkelt att tajma alla besökares laddtider, från det att första raden HTML läses till att den är fullt laddad. Det görs varje gång, oavsett tid på dygnet, land eller enhet, vilket ger ett mycket mer rättvist resultat. RUM-tjänsten avslöjade också något viktigt för oss.
- Vi kunde nämligen börja se sambandet mellan sidornas laddtid och bounce rate. Och det på ett vis som jag aldrig sett det förut. Om besökaren laddade sidorna på 2 sekunder, var Bounce rate 20% Om besökaren laddade sidorna på 3 sekunder, var Bounce rate 25% Om besökaren laddade sidorna på 8 sekunder, var det fler en hälften som bouncade.
- Laddtider och Sidvisningar per besök. En besökare som laddade sidorna på 2 sekunder, kollade i snitt på 7 sidor, och en besökare som laddade sidorna på 3 sekunder, kollade i snitt på 6 sidor, men om sidan laddar på 8 sek eller mer, så kollade de i snitt på färre mindre än 3 sidor. Och vet ni vad som är ”sida 3” på thule.com, om resan startat på startsidan? Det är produkter!
- Så vi samlade hela teknikteamet med våra utvecklare på Consid och hostingleverantör för att tillsammans hitta och välja ut förbättringar att göra på Thule webbplats. Jag kan varmt rekommendera det arbetssättet – samla all kompetens i ett rum, släpp alla pekpinnar och ifrågasättande, fokusera på vad som kan göras. Vi fick en lista på ca 25 åtgärder, som alla i rummet fick vara med att prioritera och värdesätta. Tre av dem var extra relevanta för själva startsidan. http/2 Vi började med att aktivera http/2. Vad det innebär i kort är att browsern kan begära flera saker från en server samtidigt. Traditionellt sett, med det gamla http protokollet, säger en browser ”Hej servern, kan du skicka mig den här filen?”. När den är skickad kan browsern fråga efter nästa fil och sen nästa osv. Men med http/2 kan browsern istället säga ”Hej servern! Kan du skicka dem här 8 bilderna, dessa CSS-filerna och den här javascriptfilen” och allting skickas på samma gång. Det är en väldigt tacksam sak att göra, för så länge en webbplats använder SSL-certifikat, så kan http2 enkelt aktiveras av er hostingleverantör. Responsiva bilder Vi ändrade också all markup för våra bilder, och lade till src set, så att de hämtar rätt bildstorlek till rätt skärmstorlek. En stor iMac Retina ska få stora högupplösta skarpa bilder, men på en liten iPhone skärm ska vi ladda in optimerade, små bilder. Lazy loading Och för att toppa av allt det här implementerade vi Lazy loading. Med hjälp av automatisk bildbehandling och javascript så väntar vi med att ladda in de stora bilderna tills allt annat är inladdat. Det gör eg. inte att webbplatsen laddar snabbar, men det gör den upplevda laddtiden mycket bättre, och ofta är det just den som är avgörande för besökarna.
- Identifiera målgruppen och dess behov Var kommer de ifrån? Vad gör de? Formulera ett mål utifrån besökarnas ambitioner Hur mäter ni förbättringar? Efterforska, testa och implementera förändringar Samla in all kompetens som behövs A/B-tester, KPIer, användartester, laddtider
- Tack till Thule som låtit oss gå igenom detta case!
- TACK FÖR ATT NI LYSSNAT! Vi söker AdWords-specialister i Malmö! Kontakta linus.Larsson@wgp.se