“The internet has to be fast” - Steve Jobs

 

Laadtijden, een onderwerp waar je ondertussen al lang van op de hoogte bent of wat door dit artikel leidt tot een openbaring. Het onlangs gepubliceerde ‘Ecommerce Page Speed & Web Performance Spring 2013’ rapport van State of the Union komt namelijk met opzienbarende berichten. Anno 2013 worden pagina’s van webshops er volgens het rapport niet sneller op. In tegendeel, laadtijden zijn juist binnen een jaar met 22% gestegen!

Dit terwijl de laadtijd van je webshop direct invloed heeft op je page views, de bounce rate, de klanttevredenheid, het aantal terugkerende bezoekers met als gevolg een daling in conversie en je inkomsten. Hoog tijd dus om de essentie van laadtijden nogmaals te benadrukken en kritisch naar de prestaties van jouw webshop te kijken. In dit artikel nemen we je mee in de eerste stap van laadtijdverbetering: inzicht & analyse.

‘Verwende’ consumenten

Binnen de e-commerce branche krijgen we steeds meer te maken met ‘verwende’ consumenten. Het productaanbod moet duizenden producten bevatten en consumenten willen vandaag bestellen, het product morgen in huis hebben, geen verzendkosten betalen en het liefst gratis retourneren. Hoge eisen dus met weinig geduld. Internetgebruikers klikken over het algemeen snel weg als iets te lang duurt, zelfs als het gaat om een fractie van een seconde. De tijd dat de consument het geduld heeft om te wachten is voorbij.

100 milliseconde extra is -1% omzet

meten is weten

Het ‘wachten’ is een cruciaal gevolg van de laadtijd van je shop. In het verleden heeft onderzoek aangetoond dat elke extra 100 milliseconde aan laadtijd, leidt tot 1% minder omzet. 1% minder omzet, een percentage dat alleen maar stijgt naarmate je site trager wordt. Niet alleen voor webwinkeliers is de laadtijd belangrijk maar ook andere grote online partijen zoals Google bouwen hele policies om het sneller maken van het internet heen. Zo bestaat er zoiets als Google’s Gospel of Speed. In het leven geroepen om de internetgebruiker zo snel mogelijk van dienst te kunnen zijn.

Google rankingfactor

Fast is better than slow’ is dan ook de lijfspreuk van Google. Met de zoekresultaten wil Google de gebruiker zo snel mogelijk van dienst zijn. De laadtijd van pagina’s vormen daarom een onderdeel in de ranking van je webshop of pagina’s binnen de zoekresultaten. Niet alleen de positie in de organische zoekresultaten wordt hierin meegenomen, ook de kwaliteitsscore van een advertentie binnen het Google Adwords netwerk wordt door een trage laadtijd beïnvloed. Een lage rankingsfactor heeft minder traffic naar je shop als gevolg. Onderzoek wijst uit dat elke +500 milliseconden aan extra laadtijd leidt tot 20% minder verkeer naar je shop.

Speed isn’t just a feature, it’s the feature - Urs Hoelzle, Google’s search guru and SVP of Infrastructure

Gebruiksvriendelijkheid

Naast de vindbaarheid heeft een langere laadtijd door de consumentenverwachting ook direct invloed op de gebruiksvriendelijkheid van je shop. Consumenten willen niet wachten. Yahoo kwam er in 2008 al achter dat 400 milliseconde extra laadtijd het aantal bezoekers die de pagina verlaat voordat deze volledig geladen met 5% tot 9% laat stijgen. De bezoeker van je shop wijkt snel af naar een andere webshop en de kans dat hij/zij je webshop nog eens zal bezoeken is gering. Een fractie van een seconde aan extra laadtijd kan dus al voldoende zijn om een negatieve gebruikerservaring bij je consument te creëren.

Gemiddelde laadtijd is met 22% gestegen

Het onderzoek wijst uit dat de gemiddelde volledige laadtijd van een homepage voor een first-time bezoeker in 2012 lag op 7,25 seconde. In tegenstelling tot de 5,94 seconde in 2011. Een stijging van 22%. Maar waar ligt dit aan? Het antwoord is simpel. Het laden van een gemiddelde webpagina bestond in december 2012 uit 79 verzoeken (‘requests’) voor bijvoorbeeld afbeeldingen, html en css/javascript etc. In december 2011 bedroeg dit aantal 73 verzoeken. Een stijging van 8%. Het laden van deze elementen gaat van browser naar de host-server en weer terug en kost tijd. Elke round-trip van browser naar server kan 50 milliseconden bedragen, wat al snel oploopt naarmate je shop over veel verschillende bronnen beschikt.

Pagina’s worden groter en complexer

Twee redenen liggen aan de stijging van de laadtijden ten grondslag:

  • Pagina’s worden steeds groter
    In een tijd waarin de consument zeer visueel is ingesteld worden afbeeldingen en video’s steeds belangrijker. Shops maken veel gebruik van afbeeldingen in de vorm van sfeer- of productafbeeldingen die bijdragen aan de laadtijdvertraging. In december 2011 bedroeg een webpagina ongeveer 665kB aan grote terwijl dit eind 2012 op 1163kB ligt. Een stijging van 75% in 2 jaar tijd. Voor 2014 wordt er zelfs een stijging verwacht naar een gemiddelde grote van 2000mB.
  • Pagina’s worden steeds complexer
    Niet alleen worden de pagina’s groter, ze worden ook complexer. Denk aan alle extra elementen die deel uitmaken van je webpagina’s. De social media buttons bij elk product, maar ook je analytics of de advertentieruimtes. Al deze elementen bevatten informatie die van externe servers moeten worden gehaald wat tijd kost. Daarbij kunnen storingen die zich bij die servers voordoen effect hebben op de laadtijd van de pagina.

De laadtijd analyse - Hoe en waar kun je de laadtijd voor jouw webshop checken?

De noodzaak is dus duidelijk maar hoe kun je de laadtijd van jouw webshop checken? Je kunt beginnen eerst zelf een paar analyses uit te voeren. Allereerst wil je weten wat de laadtijd van je shop nu is. De volgende tools helpen je hierbij:

Google Analytics

google analytics sitesnelheid

Het is binnen Google Analytics mogelijk om de gemiddelde laadtijd van je gehele webshop maar ook op paginaniveau na te gaan. Login in op je Analytics account > Content > Sitesnelheid. Google Analytics geeft je de mogelijkheid om op 3 niveaus de snelheid van je site te analyseren:

  • De algemene laadtijd van een paginaweergave.
  • De uitvoeringssnelheid of laadtijd van een discrete hit, gebeurtenis of gebruikersinteractie die je wilt bijhouden.
  • De snelheid waarmee de browser het document parseert en beschikbaar maakt voor gebruikersinteractie.

De rapporten die hier vervolgens uitkomen geven je de mogelijkheid om te beoordelen hoe goed je shop presteert wat betrekking tot de snelheid waarmee de gebruikers de inhoud kunnen zien en er interactie mee kunnen hebben. Op deze manier is het mogelijk de gebieden ter verbetering te identificeren maar ook bij te houden. Wat dit allemaal precies inhoudt lees je hier. Google Analytics geeft alleen de laadtijden aan, voor de daadwerkelijke benodigde werkzaamheden zijn andere tools beschikbaar.

Afbeelding 1: Google Analytics > Sitesnelheid

Google Page Speed Online Tool

Google Page Speed Oline

Met de Page Speed Online Tool geeft Google je de mogelijkheid om te zien in hoeverre en door middel van welke werkzaamheden je webshop geoptimaliseerd kan worden. Vul eenvoudig het domein van je shop in en kijk welke score je krijgt van 1 tot 100. Een hogere score staat voor weinig ruimte ter verbetering en een lage score tot veel ruimte ter verbetering. Daarbij geeft de tool je ook directe handvatten welke elementen je binnen je webshop kunt verbeteren d.m.v. de segmenten; ‘high priority’, ’medium priority’ and ‘low priority’ verbeterpunten.

Vul ook eens de domeinnaam van je concurrenten in en zie hoe jouw shop ten opzichte van je concurrenten presteert. Een minpunt van deze tool is wel dat de tool niet aangeeft hoe snel de pagina’s daadwerkelijk worden geladen.

Google Page Speed Result

Afbeelding 2: Resultaat Google Page Speed Online Tool

Pingdom.com

Een andere tool die je veel informatie geeft is Pingdom.com. Pingdom is een Full Page Test tool die je helpt met het identificeren van de laadtijd van je webshop en je leert hoe je jouw webshop sneller kan maken. De site is toegankelijk en gemakkelijk in gebruik. De verschillende resultaat-tabbladen geven je een gemakkelijk inzicht. Let wel op dat je bij het invullen van je domein ook de ‘Settings’ onder de invoerbalk verandert in ‘Test from Amsterdam’.

Pingdom

Afbeelding 3: Pingdom

Yslow

Voor de iets gevorderde insights kun je ook Yslow van Yahoo op je browser installeren. Yslow is een goede tool, die op verschillende browsers geïnstalleerd kan worden. Yslow analyseert pagina's en vertelt je waar de vertraging optreed. Na het draaien van een duidelijke analyse met Yslow is een betere response tijd van 25% tot 50% mogelijk na het oplossen van de vertragingsproblemen met Yslow.

Yslow

Afbeelding 4: Yslow

Het ‘Exceptional Performance’ team van Yslow heeft 34 elementen geselecteerd die de snelheid van je webshop bepalen. Yslow gebruikt hier 23 elementen van voor de analyse verdeelt over 7categorieën, de zogenoemde ‘Web Performance Best Practices and Rules’.

Web Performance Best Practices & Rules

Afbeelding 5: Yslow Web Performance Best Practices and Rules

Knelpunten

34 mogelijke laadtijd vertragers. Dat is niet niks. Om dit zelf op te pakken is soms te lastig of te technisch maar een paar verbeterpunten kun je zelf al doorvoeren.

Afbeeldingen

Een van de grootste knelpunten die de laadtijd vertragen zijn in veel gevallen de afbeeldingen binnen je shop. Afbeeldingen duren vaak het langst om te laden. Dit kunnen zijn afbeeldingen van producten of sfeerimages, maar ook onderdelen van het design van je webshop kunnen de boosdoener zijn. Dit valt relatief gemakkelijk te verbeteren:

  • Controleer de daadwerkelijke grootte van de gebruikte afbeeldingen
    Analyseer of de grootte van de afbeeldingen ook daadwerkelijk de grootte is die op de website wordt getoond. Soms wordt een plaatje op de website getoond in 100x100 pixels, terwijl het plaatje 1000x1000 pixels groot is.
  • Optimaliseer je afbeelding voor webcontent
    Controleer of de afbeelding geoptimaliseerd is voor web content, hier worden minder hoge eisen aan gesteld dan bijvoorbeeld plaatjes voor drukwerk.

Caching

Een van de snelste manieren om de prestaties van je webshop te verbeteren is het aanzetten van caching. Dit zorgt dat vaak gebruikte content niet opnieuw wordt gegenereerd, maar dat de website bezoeker direct en snel toegang krijgt tot de content. Caching slaat dynamische content tijdelijk statisch op. Voor Magento gebruikers, log in met je Magento webshop. Ga naar Systeem > Cache beheer en schakel alle caching opties in.

‘Meten is weten’.

Door middel van deze relatief eenvoudige werkzaamheden kun je op een snelle manier al heel wat laadtijd vertraging wegnemen. Zorg voordat je aan de optimalisatie werkzaamheden begint dat je eerst een analyse maakt van de huidige situatie. Na het uitvoeren van deze relatief eenvoudige werkzaamheden kun je dan duidelijk het verschil en de verbetering in je laadtijden zien. Er zijn zoals gezegd nog veel meer werkzaamheden die verricht kunnen worden naast het optimaliseren van je afbeeldingen en de caching. Afhankelijk van je kennis kun je dit zelf of door je e-commerce ontwikkelbureau laten oppakken. In een vervolg artikel over laadtijdverbetering komen de meer technische werkzaamheden aan bod. Hoe dan ook, het verbeteren van de laadtijden van je webshop blijft een kwestie van optimalisatie. Dus handen uit de mouwen en aan de slag! En onthoud;

"When you speed up service, people become more engaged - and when people become more engaged, they click and buy more."

Toelichting

Naast zelf aan de slag te gaan kun je ook je e-commerce ontwikkelbureau een laadcheck voor je laten uitvoeren. MediaCT heeft voor meerdere van haar klanten dergelijke succesvolle projecten opgepakt. Wil je meer weten over de mogelijkheden? Neem dan contact met ons op.