Så påverkar sidhastigheten din konverteringsgrad och så förbättrar du den

En kund landar på din produktsida och väntar. Två sekunder. Tre sekunder. Sidan laddar fortfarande. När den äntligen är klar har kunden gått vidare. Besökare tänker inte medvetet på sidhastighet, men de känner av den direkt. En butik som laddar på två sekunder…

Utkast

Sidhastighet är en konverteringsfaktor som många butiker förbiser, eftersom den varken är ett designproblem, ett marknadsföringsproblem eller ett produktproblem. Den är ett infrastrukturproblem. Men effekten är lika tydlig som för andra konverteringsproblem. Varje halv sekund extra laddtid sänker konverteringsgraden mätbart, särskilt på mobilen, där människor redan är otåliga och ofta har långsammare uppkoppling.

Hur påverkar sidhastigheten konverteringen i e-handel?

Sambandet mellan sidhastighet och konvertering är väl belagt i forskning från Google, stora webbhandlare och flera oberoende studier. En sekunds fördröjning i laddtid leder till sju procent färre konverteringar. Fem sekunders fördröjning kan sänka konverteringen med 40 procent eller mer. Konverteringen på mobil sjunker ännu brantare vid fördröjningar, eftersom mobilbesökare har långsammare uppkoppling och mindre tålamod.

Effekten förstärks i hela butiken. Varje sida som laddar långsamt är ett tillfälle för en besökare att bli irriterad och lämna. Din startsida, dina produktsidor, din kassa. Den som väntar sju sekunder på en produktsida är redan irriterad innan hen sett produktbilden. Många stänger fliken och söker efter samma produkt någon annanstans.

Sidhastighet påverkar också placeringen i sökmotorerna. Google räknar sidhastighet som en rankingfaktor för både dator- och mobilsökning. En långsammare butik hamnar under snabbare konkurrenter för samma sökord, vilket ger färre besök från början. Förlusten från långsamma sidor drabbar både direkta besök och organisk söktrafik.

Vad gör att webbutiker laddar långsamt?

De flesta långsamma butiker är inte långsamma av design. De blir det med tiden när bilder läggs till, tillägg hopar sig eller serverinfrastrukturen inte är optimerad. Om du förstår orsakerna kan du prioritera vad som ska fixas först. Mer om hur varje del av butiken påverkar besökarens upplevelse hittar du i hur du utformar en kassasida som minskar avhopp och hur du gör din webbutik mobilvänlig. Det finns fem huvudorsaker.

För stora bilder

Bilder är oftast de största filerna på en produktsida. Ett produktfoto på tre megabyte i stället för trehundra kilobyte lägger till sekunder i laddtiden. Många butiker laddar upp bilder i full upplösning utan att anpassa filstorleken för webben. Bilden ser bra ut, men tar dubbelt så lång tid att ladda som den behöver. Mobilanvändare drabbas mest, eftersom deras uppkoppling är långsammare och skärmarna mindre, vilket gör högupplösta bilder onödiga.

Ooptimerad kod och skript

När butiker lägger till funktioner, recensioner, chattwidgetar, analysverktyg och marknadsföringspixlar laddar varje del ännu ett skript. Skript blockerar sidans rendering medan de laddar. En butik med 15 skript från tredje part kan lägga flera sekunder bara på att ladda dem innan sidan visas. Vissa skript är nödvändiga. Många är det inte, eller kan skjutas upp tills sidan redan syns för besökaren.

Långsam hosting eller innehållsleverans

Vissa hostingleverantörer är snabbare än andra. En butik på föråldrad infrastruktur som inte cachar statiska filer eller levererar innehåll från avlägsna servrar svarar långsammare än en butik på modern, geografiskt spridd infrastruktur. Besökare i olika länder får olika hastighet beroende på var servern ligger i förhållande till dem.

Ooptimerade serversvar

Tiden det tar för servern att svara på en sidförfrågan beror på hur effektivt den hanterar förfrågningar och bygger sidor. Databaser utan rätt index, sidor som kör komplicerade frågor vid varje laddning eller serverkod som inte är optimerad för prestanda kan lägga till en hel sekund eller mer innan något innehåll ens börjar visas. Det syns mindre än bildoptimering, men ger ofta stora vinster.

Resurser som blockerar renderingen

CSS- och JavaScript-filer som blockerar renderingen kan lägga till sekunder innan sidan syns för besökaren. Om din butik laddar CSS- eller JavaScript-filer som måste bearbetas innan något visas på sidan ser besökaren en blank skärm tills filerna är klara. Om du ändrar vilka resurser som blockerar och vilka som kan laddas i bakgrunden förbättras den upplevda hastigheten kraftigt, även om den totala laddtiden är densamma.

Hur mäter du webbutikens sidhastighet?

Du kan inte förbättra det du inte mäter. Börja med att ta reda på hur snabbt din butik laddar i dag.

Google PageSpeed Insights

Googles verktyg PageSpeed Insights ger ett hastighetsbetyg för vilken webbadress som helst och listar de problem det hittar. Verktyget är gratis och kräver ingen installation. Gå till pagespeed.web.dev, ange din webbadress och du får betyg för mobil och dator med konkreta förbättringsförslag. Förslagen är rangordnade efter uppskattad effekt. Börja med de som ger störst effekt.

Verktyg för detaljerade hastighetstester

Särskilda testverktyg ger mer detaljerade vattenfallsdiagram som visar exakt vilka resurser som tar längst tid att ladda och var förseningarna uppstår. Du kan testa från olika platser i världen och med olika typer av enheter och nätverkshastigheter. Det hjälper dig att förstå om den låga hastigheten gäller överallt eller bara vissa regioner, eller mobil jämfört med dator.

Din analys

Ditt analysverktyg bör visa laddtid för olika sidor och trafikkällor. I WEMASY Analytics visas det som ett mått på sidprestanda. Jämför laddtiderna för dina viktigaste sidor. Om produktsidorna laddar märkbart långsammare än startsidan är det ett konkret problem att undersöka. Om mobilsidorna är långsammare än datorsidorna pekar det mot ett problem med bilder eller rendering. En fullständig guide till hur du förstår besökarnas beteende med analys finns i hur du använder analys för att förstå hur besökare beter sig i din butik.

Testa på riktiga enheter

Lita inte bara på verktyg. Öppna butiken på en riktig smartphone med vanlig 4G-uppkoppling och se hur lång tid sidorna tar att ladda. Då märker du hur butiken faktiskt känns för en verklig kund. Verktyg mäter specifika värden, men användarens upplevelse väger tyngre. En butik som känns omedelbar är snabbare än en som tekniskt får höga poäng men frustrerar besökare med dröjsmål de kan känna.

Vilka är de snabbaste vinsterna för bättre sidhastighet?

Vissa förbättringar tar timmar att genomföra. Andra tar minuter och ger mätbart resultat direkt.

Optimera bilderna

Bildoptimering är oftast den förbättring som ger mest effekt för minst arbete. Använd ett komprimeringsverktyg för att minska filstorleken utan att kvaliteten märkbart försämras. Ett produktfoto på 3 MB kan ofta komprimeras till 300 KB utan synlig skillnad. Komprimera alla bilder innan du laddar upp dem, inte efter. Välj rätt format: JPEG för fotografier, PNG för bilder med transparens, WebP för maximal komprimering i moderna webbläsare. Visa olika bildstorlekar för olika enheter. En mobiltelefon behöver inte en bild på 4000x4000 pixlar. Mer om effektiva produktbilder som också presterar bra tekniskt finns i hur du utformar produktsidor som får folk att köpa.

Ta bort oanvända tillägg och skript

Gå igenom alla skript från tredje part som körs i din butik. Analys, chatt, recensioner, marknadsföringspixlar, widgetar. Stäng av allt som inte aktivt bidrar till din verksamhet. Varje skript ger extra tyngd och gör sidan långsammare. Om du inte använder det, ta bort det. Om du behöver flera verktyg, överväg att samla dem. I stället för fem olika tjänster för olika syften laddar en plattform som samlar flera funktioner snabbare än fem separata.

Aktivera cachning

Cachning sparar statiska filer i besökarens webbläsare eller på mellanliggande servrar så att de inte behöver laddas ned igen vid varje besök. Webbläsarcachning sparar mycket laddtid för återkommande besökare. Cachning på serversidan sparar färdiga versioner av dina sidor så att servern slipper bygga sidan från grunden vid varje förfrågan. De flesta moderna hostingplattformar stöder båda. Läs hostingleverantörens dokumentation eller be dem aktivera cachning om den inte redan är på.

Minimera CSS och JavaScript

Minifiering tar bort onödiga tecken från kodfiler utan att ändra hur de fungerar. En korrekt minifierad CSS- eller JavaScript-fil är 20 till 30 procent mindre än originalet. Har du tillgång till butikens kod är minifiering enkelt. Om inte, fråga hostingleverantören eller utvecklaren om minifiering redan är aktiverad. Den bör vara på som standard på varje modern hostingplattform.

Skjut upp JavaScript som inte är kritiskt

JavaScript som inte behövs direkt när sidan laddar kan vänta. Chattwidgetar, analys, marknadsföringspixlar. De behöver inte laddas innan sidan visas för besökaren. Om du skjuter upp dem tills huvudsidan syns förbättras den upplevda hastigheten tydligt. Sidan känns snabb även om den totala laddtiden är densamma, eftersom besökaren ser innehåll direkt i stället för att stirra på en blank skärm medan skript laddar.

Hur lång tid tar det innan hastighetsförbättringar ger resultat?

Ändringar i sidhastighet ger resultat direkt. En besökare som kommer till din butik i morgon bitti upplever den snabbare sidan. Förbättrad konvertering syns inom några dagar om trafiken är tillräckligt stor för att mäta, eftersom ändringen påverkar alla besökare samtidigt.

Till skillnad från A/B-testning behöver du inte köra en hastighetsförbättring som ett test. Om PageSpeed Insights hittar ett problem och du åtgärdar det är din butik snabbare. En snabbare sida har ingen nackdel. Alla besökare drar nytta av den direkt.

Enda förbehållet är att hastighet är en av många faktorer som påverkar konverteringen. Om butiken har en trasig kassa, en förvirrande produktsida eller grundläggande förtroendeproblem flyttar hastighetsoptimering ensam inte konverteringen dramatiskt. Hastighetsförbättringar fungerar bäst som en del av en bredare strategi för konverteringsoptimering. En samlad översikt över allt som påverkar konverteringsgraden finns i vad konverteringsoptimering är och varför det spelar roll.

Spelar sidhastighet olika roll på mobil och dator?

Sidhastighet spelar större roll på mobil än på dator. Mobilbesökare har långsammare uppkoppling, har ofta bråttom och lämnar direkt om sidan inte laddar snabbt. Skillnaden i effekt på konverteringen är stor. En butik som konverterar fem procent på dator kanske konverterar två procent på mobil, och hastighet är en stor del av det gapet.

Mobilbesökare är också känsligare för stora bildfiler. En produktbild på tre megabyte som tar tre sekunder att ladda på en datoranslutning med bra bandbredd kan ta tio sekunder på en 4G-telefon. Testa butiken på en riktig mobil för att få en realistisk bild av hur den känns.

Ett specifikt mobilproblem att se upp för är att bilder optimerade för datorskärmar ofta är för stora för mobilskärmar. Om du visar responsiva bilder som skalas rätt för varje skärmstorlek, i stället för att tvinga in en bild i datorstorlek på en mobilskärm, minskar du både filstorlek och laddtid.

Hur samspelar sidhastighet med andra konverteringsfaktorer?

Sidhastighet existerar inte isolerad. Den samverkar med förtroende, design, produktsidor och kassa. En snabb sida med en förvirrande layout tappar ändå besökare. En långsam sida med snygg design tappar dem ännu snabbare. Sambandet är multiplicerande, inte additivt.

En butik som är snabb, skapar förtroende och har en tydlig väg till köp konverterar betydligt mer än en butik som bara är snabb. Hastighetsförbättringen sker i samspel med alla andra faktorer. Därför är konverteringsoptimering en systematisk process och inte en enda åtgärd. En närmare titt på hur A/B-testning hjälper dig hitta vad som håller tillbaka konverteringsgraden finns i hur du A/B-testar din webbutik.

Så hjälper WEMASY dig med sidhastighet och konvertering

WEMASY:s e-handelssystem bygger på optimerad hostinginfrastruktur med inbyggd bildkomprimering, webbläsarcachning och prestandaoptimering. Produktsidorna laddar snabbt som standard eftersom plattformen hanterar bildstorlekar, minifiering och serversvar utan att du behöver konfigurera något. Mobilsidor optimeras automatiskt för mindre skärmar och långsammare uppkoppling. Analys av laddtid finns inbyggd i Analytics och insikter, så att du kan följa hastigheten på dina sidor och se vilka som behöver uppmärksamhet. Se alla funktioner i prisplanerna.

Vanliga frågor

Vad är en bra laddtid för en webbutik?

De flesta källor rekommenderar en laddtid under två sekunder för den första visningen och under tre sekunder för full laddning inklusive alla bilder och resurser. Allt under två sekunder ger en snabb upplevelse som minimerar avhopp. Mellan två och fyra sekunder är acceptabelt men påverkar konverteringen mätbart. Över fyra sekunder är långsamt och bör åtgärdas. Det här är riktlinjer, inte hårda regler. En butik som laddar på 1,5 sekunder konverterar bättre än en som laddar på 2,5 sekunder, även om båda ligger inom det acceptabla intervallet. Med WEMASY:s webbplatsbyggare kan du ställa in detta direkt i din butik.

Påverkar sidhastigheten placeringen i sökresultaten?

Ja. Google räknar uttryckligen sidhastighet som en rankingfaktor för både dator- och mobilsökning. Allt annat lika hamnar en snabbare butik högre än en långsammare för samma sökord. Det betyder att sidhastighet påverkar din konverteringsgrad på två sätt: direkt, genom att snabbare sidor konverterar fler besökare, och indirekt, genom att högre placeringar ger fler besökare. En fullständig genomgång av sökoptimering för webbutiker finns i hur du bygger en SEO-strategi för din webbutik.

Kan jag förbättra sidhastigheten utan utvecklare?

Många förbättringar som ger stor effekt kräver ingen kodning. Bildoptimering, borttagning av onödiga tillägg och aktivering av cachning går att göra i de flesta plattformars administration. Vissa förbättringar, som att skjuta upp JavaScript eller ändra serversvar, kan kräva utvecklartillgång eller kunskap. Om din butik ligger på en modern plattform som WEMASY är de flesta av dessa optimeringar redan gjorda som standard. Har du en egenbyggd butik eller en äldre plattform kan en utvecklare hjälpa dig hitta snabba vinster och genomföra dem.

Vad är skillnaden mellan first contentful paint och laddtid?

First contentful paint är ögonblicket då det första innehållet (text, bild och så vidare) visas på sidan. Laddtid är ögonblicket då alla viktiga resurser har laddats klart. First contentful paint kommer först och är det besökaren uppfattar som "hur snabb känns den här sidan?" En sida med två sekunders first contentful paint men åtta sekunders full laddtid känns snabb för besökaren, eftersom innehållet syns snabbt även om vissa bakgrundsresurser fortfarande laddar.

Ska jag prioritera sidhastighet eller design?

Båda är viktiga, men hastighet väger tyngre eftersom en vacker sida som tar tio sekunder att ladda tappar konverteringar snabbare än en enkel sida som laddar på två sekunder. Rätt svar är en snabb, välgjord sida. Om du måste välja, prioritera hastighet först. En snabb, enkel sida konverterar bättre än en långsam, vacker. Men acceptera inte det falska valet. Moderna designverktyg och plattformar ger sidor som är både vackra och snabba.

Använd det direkt
på din egen webbplats.

Börja gratis med WEMASY och bygg din sajt på några minuter.