Er is altijd een hoop om te doen, de snelheid van je website. Als opdrachtgever wil je zekerheid dat gebruikers soepel door je website navigeren. Dus je vraagt jouw agency om een garantie te geven op de PageSpeed van de nieuwe website die je laat bouwen. Logisch. Maar wat is eigenlijk een goede PageSpeed score? En hoe belangrijk is die? Wat kun je zélf doen om deze score hoog te houden? En wat mag je verwachten van het bureau dat jouw website maakt?
Wat is een goede PageSpeed score?
Om maar met de deur in huis te vallen. Als wij een website opleveren dan mikken we op een PageSpeed score (performance) van minimaal 80 op mobiel en op desktop van 90 of hoger. Maar. Dat is wel zonder het gebruik van externe scripts.
Als je alle live scripts, analytics, tracking, cookiewalls, embeds en video’s meeneemt in de score, dan is een score van 60 of hoger op mobiel prima. Op desktop is 80 zeker haalbaar.
Die verschillen kunnen groot zijn en in de praktijk zijn ze soms nog groter dan wat ik hierboven schets. Waarom dat zo is leg ik verderop uit.
Waarom is een snelle website belangrijk?
Een snelle website is belangrijk om een aantal hele simpele redenen. Als je website snel laadt en snel werkt, dan geeft dat jouw bezoeker vertrouwen. Het valt niet op als de website snel is, het valt vooral op als die niét snel is. Een snelle website oogt professioneel, een langzame website voelt niet goed.
En als een website niet goed voelt, gaan bezoekers weg. Ze gaan andere websites bezoeken en haken af in het aankoopproces van een webshop. Want bij een trage webshop leeft altijd de vraag: “komt mijn order (en belangrijker: mijn betaling) wel goed aan?”. En dat is natuurlijk een absolute no-go. Bezoekers haken af, je bounce rate gaat omhoog. En snelheid heeft invloed op conversie.
De positie van je website in de zoekmachines is ook belangrijk, en hangt ook voor een deel samen met de snelheid ervan. Het is niet zo dat een snelle website wordt beloond door Google met een hoger plekje. Maar een trage website (echt traag) kan wél leiden tot een lager plekje. Een significant snellere concurrent heeft de voorkeur van Google.
Wat maakt een website snel?
Er zijn een aantal factoren die jouw website snel maken. Bijvoorbeeld hoe snel er iets zichtbaars verschijnt op het scherm van de gebruiker (de “First Contentful Paint”). Of hoe snel het grootste onderdeel van de pagina is ingeladen en zichtbaar is (de “Largest Contentful Paint”). Of hoe lang het duurt om allerlei scripts in te laden en te verwerken zodat je pagina goed werkt (de “Total Blocking Time”).
Niet elk onderdeel weegt even zwaar. Total Blocking Time weegt zwaarder dan bijvoorbeeld Largest Contentful Paint.
De “Cumulative Layout Shift” meet geen snelheid maar stabiliteit. Oftewel: verspringt de pagina nog terwijl de bezoeker er al naar kijkt? Denk aan tekst die wegschuift op het moment dat je hem leest, of een knop die net verplaatst als je erop wilt klikken. Van alle onderdelen ligt deze het dichtst bij de kwaliteit die een bezoeker écht ervaart. En hij telt voor een kwart mee in je score.
Een CLS onder de 0,1 is goed, en dat is vooral een kwestie van netjes programmeren: placeholders reserveren voor content die later inlaadt, in de CSS vastleggen hoe groot afbeeldingen worden, en fonts zo inladen dat er niets knippert. Het is daarmee ook het onderdeel waar een opdrachtgever nauwelijks invloed op heeft en een developer juist volledig.
Hoe goed deze metrics scoren wordt bepaald door allerlei factoren. De CSS moet klaar zijn voordat er iets te zien is voor de gebruiker. Scripts moet je juist niet meteen allemaal laden, want dat vertraagt de boel. En het is zonde als op elke pagina scripts worden meegeladen die maar op een enkele plek iets doen. Afbeeldingen kunnen ook te groot zijn of er worden allerlei externe media ingeladen zoals YouTube embeds.
Een andere metric is de “Time to First Byte”, oftewel hoe snel reageert de server op een verzoek. Hoe eerder hoe beter. Dit wordt vaak bepaald door de kwaliteit van de server waar je website op draait. Goedkopere servers of servers waar meer load op zit halen reageren langzamer dan kwalitatief betere (en dus duurdere) servers.
Wat kun je zelf doen om je website snel te maken?
Als opdrachtgever, product owner of beheerder van een website kun je een aantal keuzes maken om je website snel te maken:
- Zorg voor snelle en kwalitatieve webhosting. Goedkopere servers zijn vaak niet optimaal geconfigureerd en zijn dus trager. Goedkoop is altijd duurkoop.
- Zorg voor een goede SLA met periodieke updates. Verouderde software is onveilig en kan de boel vertragen. De prijzen van een SLA (hosting met updates) variëren bij de meeste agencies tussen de €150 en €300, afhankelijk van frequentie van updaten of extra support.
- Voeg niet zomaar allerlei functionaliteiten toe. Wees voorzichtig met plugins die je zelf kunt installeren, die kunnen de site vertragen. Allerlei embeds of iframes maken een site ook langzamer.
- Upload afbeeldingen in een goed formaat. Vrijwel ieder CMS kan een plaatje croppen en comprimeren maar het origineel al een stuk kleiner maken vóórdat je die in de site upload is ook mooi meegenomen.
Welke Google PageSpeed scores mag je verwachten van jouw webbureau?
Wanneer je je website laat ontwikkelen door een webbureau, is het goed om het te hebben over de snelheid. En je mag ook wat verwachten. Alleen is het wel goed om realistisch te kijken naar de daadwerkelijke invloed van een developer of een bureau op de PageSpeed scores.
Want een website kan door een developer razendsnel worden opgeleverd. Maar zodra alle live scripts gekoppeld worden, kan die snelheid opeens een stuk minder worden. Tegelijkertijd heb je die scripts wel nodig, want jij als opdrachtgever wil wel data verzamelen in Google Analytics. En van de marketeers moest nu eenmaal dat filmpje van 35 seconden in de header, want die past zo goed bij het merk. En uiteraard mag de calculator die je wil embedden van een externe partij niet ontbreken, anders kunnen de eindgebruikers niet goed zien wat hun rendement is. Oh ja, je moet ook voldoen aan de AVG, dus er moet ook nog maar een externe cookiewall voor!
Door al die functionaliteiten toe te voegen daalt de snelheid van je website. Dat wil zeggen, de PageSpeed scores. En het feit dat ze dalen is niet altijd slecht. Als je op mobiel zonder al die scripts een score haalt van 85 en mét scripts 65, dan is dat nog steeds niet slecht. Zeker niet als de ervaren snelheid door een gebruiker gewoon goed is. Navigeer je lekker snel door een site? Dan is dat prima.
Wat wij bij Van Ons vaak doen, is een PageSpeed berekenen inclusief en exclusief de externe scripts. Als een website exclusief externe scripts laag scoort, dan is er voor de developer nog werk aan de winkel. Wij vinden een score van 90 op desktop exclusief externe scripts eigenlijk het minimale wat een website moet halen. Voor mobiel is dat 80 of hoger.
Belangrijk hierbij: de scores in PageSpeed zijn een momentopname. Als je twee keer achter elkaar dezelfde pagina meet, kun je twee verschillende scores krijgen. De getallen moet je dus altijd als bandbreedte zien en niet als één hard getal. Om tot een bruikbaar cijfer te komen, meten wij de website een aantal keer door en pakken we de mediaan van die waarnemingen als uitgangspunt.
Blijf je PageSpeed scores optimaliseren samen met jouw agency
Een development proces is niet altijd even overzichtelijk. Tijdens het bouwen van je nieuwe website ontstaan er allerlei nieuwe ideeën, komt de brand manager nog met 12 tooltjes die erin moeten en moest er toch een koppeling komen met een API die heel traag werkt.
Vooraf kun jij als opdrachtgever niet altijd goed inschatten wat er uiteindelijk allemaal in de site wordt gebruikt. En jouw bureau kan dat dus ook niet. Dat geeft ook helemaal niet, zolang iedereen maar pragmatisch in de wedstrijd zit.
En dat betekent dat het goed is om na oplevering te kijken waar je nog verder kunt optimaliseren en doorontwikkelen. Als de mist na de livegang een beetje is opgetrokken, heb je een goed overzicht van het eindresultaat, de snelheid en hoe alle functionaliteiten worden gebruikt. Dat is het moment om samen met jouw agency te kijken hoe je scripts efficiënter kan inladen, waar je de caching nog wat beter kunt afstellen, of je niet een queue kunt maken zodat de traagheid van die API niet zo opvalt en of je dat externe tooltje misschien niet beter in je website kunt laten bouwen.
De snelheid van je website is een dynamisch proces dat eigenlijk nooit klaar is. Bespreek met jouw agency wat er mogelijk is om een snelle site te bouwen en hoe je de snelheid in de toekomst kunt borgen. Doe dit periodiek zodat je op volle kracht vooruit blijft gaan met jouw website, webshop of platform.