Dit gastblog is geschreven door Webber. Webber legt uit hoe Google Core Web Vitals score jouw website beoordeelt. Een snelle laadtijd en een soepele gebruikerservaring zijn belangrijk voor websitebezoekers. Google is het daarmee eens. Vanaf mei 2021 gaat Google websites meten en boordelen op laadtijd (Largest Contentful Paint), interactie (First Input Delay) en op visuele stabiliteit (Cumulative Layout Shifts). Het bedrijf gaat dat doen met de meetmethoden van Core Web Vitals. Bij het beoordelen krijgt elke pijler een eigen score. Deze scores tellen mee in het bepalen van de positie van een website in de zoekresultaten. Heb jij een eigen website en ben je daar serieus mee bezig, lees dan zeker verder! 

Objectieve score van de gebruikerservaring

Hoe je iets ervaart is heel persoonlijk. Wat traag kan aanvoelen voor jou, voelt misschien wel snel aan voor een ander. Met Core Web Vitals wil Google een objectieve score geven aan de gebruikerservaring. Wanneer een site dus goed scoort op de eerder genoemde pijlers, zou dat dus ook de gebruikerservaring moeten verbeteren.

Geen vrijblijvende adviezen meer

In het verleden keek Google voornamelijk naar de inhoud en het onderwerp van een pagina. De focus verschuift echter steeds meer naar de gebruikerservaring. Laten we bijvoorbeeld een knop op de mobiele versie van een website bekijken. Deze moet groot genoeg zijn, je wilt immers dat elke vinger - ongeacht hoe groot - de knop makkelijk moet kunnen vinden, zonder dat de gebruiker daarbij per ongeluk de verkeerde knop aanraakt. Gebeurt dat wel, dan is dat geen fijne gebruikservaring.

Dit soort adviezen worden al langer gegeven. Het mooie is dat je dergelijke adviezen makkelijk opvraagt via Pagespeed Insights. De grote verandering is dat dit advies vanaf mei 2021 niet langer vrijblijvend is, maar dat Core Web Vitals je positie in Google bepaalt op basis van je scores.

Laten we de pijlers laadtijd, interactiviteit en visuele stabiliteit eens wat verder uitleggen. Wat bedoelen we precies en hoe optimaliseer je je website?

Verbeteren score ‘laadtijd’ (First Contentful Paint)

Met de pijler ‘laadtijd’ kijkt Google naar het grootste element dat in de viewport aanwezig is én naar hoe lang het duurt voordat dit helemaal is geladen. Viewport? Dat leggen we even uit. Een viewport is het kader met alle content die op een zeker moment zichtbaar is voor de bezoeker. Dat zijn de teksten en afbeeldingen die je concreet ziet in jouw viewport. De content waar je voor moet scrollen staat buiten je viewport.

Google Core Web Vitals kijkt via ‘laadtijd’ dus naar het grootste element dat op dat moment voor de bezoeker zichtbaar is en meet hoe lang het duurt voordat het is ingeladen. Een laadtijd onder de 2,5 seconden geeft een goede score. Tussen de 2,5 en 4 seconden is er ruimte voor verbetering en alles langer dan 4 seconden kost punten.

 Je verbetert de laadtijd door afbeeldingen en video’s te comprimeren, hierdoor laden ze sneller. Ook kun je CSS en Javascript-bestanden bundelen, waardoor ze sneller laden.

Verbeteren score ‘interactiviteit’ (First Input Delay)

Met de pijler ‘interactiviteit’ meet Google Core Web Vitals hoe snel een pagina interactief wordt. Het meet dus de tijd tussen een actie van de bezoeker en de reactie of output van de website. Hoe sneller de reactie van de site, hoe beter de score. Is die reactie traag, dan raak je als bezoeker gefrustreerd. Dat kan grote consequenties hebben. Bijvoorbeeld als klanten in een webshop hun bestelling niet afronden en afhaken.

Je website bereikt een goede interactiviteit als de site eerst de bestanden inlaadt die de pagina interactief maken en daarna pas de andere bestanden. Een tijd van 100 milliseconden of sneller voordat de pagina interactief wordt is een goede score. Bij 100 tot 300 ms is het advies om verbeteringen door te voeren. Langer dan 300 ms wordt gezien als een slechte gebruikerservaring.

Verbeteren score ‘visuele stabiliteit’ (Cumulative Layout Shifts)

Met de pijler ‘visuele stabiliteit’ meet Google Core Web Vitals hoe lang het duurt voordat een pagina visueel stabiel is. Stel je leest een tekst en de alinea’s verspringen een paar keer, dan is dat is erg irritant en dus een slechte gebruikerservaring.

Verspringen komt omdat een afbeelding bijvoorbeeld nog niet is ingeladen. Door elke afbeelding alvast hoogte en breedte te geven, houd de rest van de content daar al rekening mee. De ruimte voor de afbeelding is als het ware alvast gereserveerd en verschijnt niet plotseling tussen de rest van de content die wel al meteen zichtbaar is. 

Google Core Web Vitals gebruikt een formule om tot een objectief antwoord te komen op de vraag of de visuele stabiliteit goed is. Heeft minimaal 75% van de pagina’s een score van 0.1 of lager, dan krijgt je site een goede score.

Het verschil tussen desktop en mobiele score

Google berekent de scores voor desktop en mobiel los van elkaar. Google vertraagt de snelheid voor de mobiele test om zo het beste resultaat voor de meeste mobieltjes te simuleren. Met de huidige 4G en 5G-netwerken in onze regio merk je als gebruiker het verschil met desktops/laptops niet meer. Voor andere regio’s in de wereld is dat niet per se het geval.

Ook is de viewport (zoals hierboven uitgelegd) op je mobiel anders dan op een desktop. Daarnaast wordt er bij de mobiele test veel meer gekeken naar het besparen van data. Bijvoorbeeld door de afbeeldingen in het juiste formaat weer te geven, zodat jouw apparaat niet te veel MB’s hoeft binnen te halen. Zeker met het oog op het mobiele gebruik van websites is het belangrijk om dus ook je mobiele score zo goed mogelijk te hebben!

Benieuwd hoe jouw website scoort op Google Core Web Vitals?

Neem gerust contact met Webber op, Webber kijkt dan graag met je mee naar eventuele verbeterpunten! Of stel je vraag via het contactformulier. Wij horen graag van je.