Laddningstid – hur får du din sajt/hemsida att ladda snabbare?
En hemsidas laddningstid är mycket viktig, både för att ranka högt på Google och för att ge användarna en god upplevelse. Efter en dålig erfarenhet går besökarna ofta tillbaka till sökmotorn och väljer en annan, snabbare, hemsida bland sökresultaten. Men hur kollar du upp din laddningstid och vad kan du göra för att förbättra den?
Häng med för att lära dig om några av de faktorer som påverkar en hemsidas laddningstid. Efter att du läst detta har du garanterat några nya saker att göra för att se till att den laddar snabbt och fungerar på bästa sätt.
Av Stefan Nordström
- Konsult inom digital marknadsföring
- 8 års erfarenhet som in-house och frilansare
- Expertområden: SEO, copywriting, nyhetsbrev, konverteringar, digital strategi
- LinkedIn | Mail | Instagram
Varför behöver du en snabb hemsida?
En hemsida som laddar långsamt kan ha stor negativ påverkan på din sökmotoroptimering (SEO). Detta är något Google prioriterar alltmer i sin algoritm. Orsaken är deras allt större fokus på användarvänliga hemsidor.
Tålamodet med långsamma sidor är också kortare ju mer vi använder mobila enheter för att surfa. För de som bedriver affärer på nätet innebär en långsam hemsida helt enkelt färre kunder.
Här går vi igenom vanliga problem som skapar långsamma laddningstider. Låt inte dessa tekniska aspekter förstöra din SEO. Gör det till en konkurrensfördel på Google istället!
Det första intrycket
Användarupplevelsen är ofta synonym med upplevelsen av varumärket. Den kan till och med vara det första intrycket. Därför bör man inte förstöra det första intrycket med långa laddningstider. Det finns saker att göra åt det. Många av dem är ganska enkla.
Hur många gånger har man inte suttit och varit irriterad på en hemsida som tar flera sekunder på sig att ladda och återvänt till Google för att hitta en annan sida med samma produkt eller information? När detta händer är chansen att minimal att man återvänder till hemsidan man en gång övergett på grund av den långsamma laddningen.
Hur mäter du din hemsidas laddningstid?
Det bästa sättet att mäta hur snabbt en hemsida laddar är att testa den med Google PageSpeed Insights. Med PageSpeed Insights får du ett betyg mellan 1 och 100 på hur snabb din hemsida är. Du får också en lista med möjliga åtgärder för att förbättra laddningstiden. Summeringen är ett utmärkt sätt att komma igång med arbetet.
Oftast handlar om det om någon av dessa orsaker, som vi kommer gå igenom djupare i resten av artikeln:
- Optimera bilders storlek
- Flytta eller ta bort script
- Snabbare server
- Cache
- Minimera kod
- Hoppa över långsamma iframe-flöden
Optimera bilder för snabbare laddningstid
Dåligt optimerade bilder är den vanligaste orsaken till långsamma laddningstider. Många gånger räcker det med att se till att en bild är lika stor som hemsidans maximala bredd och Photoshop-renderad med ”spara för webb”-funktionen. En bra måttstock är att försöka få ned till storleken till under 500 kB.
Det är viktigt att välja rätt när du väljer mellan .jpg och .png-format eftersom det kan spara mängder med laddningstid. Detta är både den enklaste och den viktigaste åtgärden för att få sin hemsida att ladda snabbare.
Om du inte har Photoshop så finns det andra möjligheter än att spara som webb via programmet. Web Resizer är ett snabbt och smidigt verktyg där man kan ladda upp sina bilder för att optimera storleken. Det går till och med att editera storleken. Mycket bra verktyg!
De flesta använder WordPress, och det finns en hel del plugins som hjälper till att optimera bilder på hemsidorna, som t ex:
Hur bred behöver bilden egentligen vara?
En början är att ta reda på den maximala bredden på sidan där bilden ska publiceras. Mitt nuvarande WordPress-tema har t ex ca 750 pixlar i bredd för ett inlägg som detta. När man sparar ut optimerade bilder från Photoshop behöver de inte vara bredare än sidan. Ofta bidrar denna åtgärd till att man sparar en hel del filstorlek.
I vissa fall är inte bilden tänkt att täcka hela hemsidans bredd. Då kan det också vara läge att tänka till. Om du publicerar många liknande poster, som t ex blogginlägg eller recensioner, se till att ha ett bestämt format.
Jag brukar skriva musikrecensioner där jag alltid sparar ut albumomslagen i 400*400 pixlar. Det sparar en hel del arbete samtidigt som det garanterar att hemsidan laddar så snabbt som möjligt. Därför rekommenderar jag att hitta ett format för t ex bloggposter som du sedan följer.
Hur stora får bilder vara på en hemsida som laddar snabbt?
Jag har sett, och ser fortfarande, en del hemsidor med bilder som är alldeles för stora; ibland kan det handla om flera MB. Dessa stora bilder är en katastrof för laddningstiden och kan bidra till flera sekunders extra laddning.
Min rekommendation är att filstorleken åtminstone bör ligga under 500 kB för att inte bidra till alltför långsam laddning. Nedan följer en kort genomgång av vad man bör tänka på med de olika filformaten.
.jpg
.jpg är det vanligaste formatet och också det format man oftast bör välja för sina bilder på digitala plattformar. När man sparar för webb som jag nämnt tidigare dras kvaliteten ned gradvis. Det blir ofta en kompromiss mellan filstorlek och bildkvalitet.
.png
.png är främst ett alternativ vid två tillfällen; för frilagda bilder eller bilder med mycket få färger som t ex logotyper. png-bilder är i de allra flesta fall tyngre att ladda än jpg. Det är mycket vanligt att de som inte kan så mycket om bildformat och laddningstider laddar upp .png-bilder och använder på hemsidor.
.gif
.gif är ett format som fortfarande är vanligt på nätet. Det bör dock främst användas för animerade bilder, vilket inte riktigt är fallet när man tittar på olika hemsidor. En orsak är .gif-formatet orsakar tunga filer som tar lång tid att ladda.
Flytta eller ta bort ”renderblockerande” (render-blocking) script
Javascript och CSS kan orsaka långsamma laddningstider när de placeras på fel plats i koden. T ex kan de ligga högt upp i koden och laddas före hemsidans text och bilder. Detta kan göra att innehållet laddas onödigt långsamt. Google kallar det för ”render blocking”.
Vad kan man göra åt det beror mycket på hur man ändrar sin hemsida. I ren html-kod kan man ofta flytta scripten manuellt till en plats där de fungerar utan att påverka laddningstiden. I olika CMS kan det vara allt från mycket jobbigt till mycket enkelt.
Om man använder WordPress finns det ett flertal plugins som enbart syftar till att flytta renderblockerande kod till en plats där den inte försämrar hemsidans laddningstider.
Få servern att ladda snabbare
Hemsidans server kan ha stor effekt på laddningstiden. Hosting-lösningen kan definitivt försämra laddningstiderna så mycket att placeringen på Google påverkas. Det kan vara värt att byta webbhotell.
Om man har en extern lösning går det ofta att göra efterforskningar kring vilka företag som erbjuder snabba servrar. HostingFacts är en bra jämförelseportal där man kan se prestanda, pris och andra viktiga fakta om ett flertal hosts. Innan man signar upp sig för webbhotell kan det definitivt vara en god idé att titta på recensioner och undersöka serverhastigheten.
Snabbare hemsida med cache
Ett sätt att få hemsidan att ladda snabbare utan att göra något med hemsidans innehåll i sig är att använda sig av cache, eller ”cacha”. När man cachar sin hemsida lagras den på ett sätt som gör att innehållet inte behöver laddas om lika mycket. Cache är mycket effektivt för återkommande besökare som redan laddat in hemsidan, men även för nya besökare.
Om man är duktig på kod i t ex WordPress kan man själv göra åtgärder som gör att hemsidan cachas. Det vanligaste är dock att använda en cache-plugin. Nedan följer några exempel på populära WordPress-plugins som cachar ditt innehåll:
Minimera CSS, HTML och JavaScript
CSS, HTML och JavaScript-koden kan vara onödigt tung att ladda. I de flesta CMS finns det åtgärder eller plugins som gör att koden minimeras storleksmässigt samtidigt som den utför samma uppgift. Och tur är nog det, för det är inte många som jobbar med content som vill sitta och kopiera detaljerade kodsnuttar. Därför är det bra att använda WordPress eller ett annat CMS av hög kvalitet.
Minimerad kod kan ses som en småsak, men det är ändå en detalj som kan påverka din sökmotoroptimering i längden.
Hoppa över långsamma iframe-flöden
Det finns fortfarande de som importerar sina flöden från t ex Facebook, Twitter och Instagram på sina startsidor. Oftast görs detta genom att använda en iframe. Flöden kan ge ett visst ökat engagemang på sociala medier, men att importera dem via iframe innebär en ökad laddningstid.
Teknologin är förlegad och kan leda till problem med mer än laddningstiden. I de allra flesta fall är det värt att hoppa över dessa flöden för att istället få hemsidan att ladda snabbare. Istället för iframes kan man t ex jobba med länkar till sina sociala medier.
Intressant forskning om laddningstid och förlorade kunder
På conversionista.se finns en intressant artikel om långsam laddningstid och dess effekt på konverteringar och affärer. Bland annat konstateras att bara 100 ms långsammare laddningstid leder till 5 % mindre försäljning. Å andra sidan leder 2 sekunder snabbare laddningstid till 66 % högre konvertering.
Besökarnas tålamod är 2-3 sekunder medan snittladdningstiden på de 100 största e-handelssajterna är runt 5,5 sekunder. Detta glapp innebär så klart en stor möjlighet till affärer för de som faktiskt har hemsidor som uppfyller användarnas förväntningar.
Behöver du hjälp med digital marknadsföring?
Laddningstid är bara en av de många saker som behöver fungera för att man ska lyckas med digital marknadsföring. Efter att ha tittat på den finns det fortfarande en mängd saker kvar att tweaka.
Om du behöver hjälp med din digitala marknadsföring har du hittat rätt. Jag är nämligen en content marketing-expert som hjälpt många företag med allt från SEO till copywriting och nyhetsbrev. Intresserad? Välkommen att connecta med mig på LinkedIn eller e-maila nordstromstefan86@gmail.com!
Lär dig mer:
SEO-copywriting – att skriva för sökmotorer ->
10 tips för att få till rubrikerna i sitt content ->
0 kommentarer