Onlangs heeft Google drie nieuwe rankingfactoren naar buiten gebracht. Deze vallen alle drie onder de noemer “Core Web Vitals”. Deze rankingfactor bepaalt voor een gedeelte de gebruikservaring ofwel de User Experience (UX) van je website. Maar wat zijn deze rankingfactoren precies? En wat kun je ermee?
Drie nieuwe ranking factoren
De Core Web Vitals zijn onderverdeeld in drie factoren:
- Largest Contentful Paint (LCP)
- First Input Delay (FID)
- Cumulative Layout Shift (CLS)
Deze drie factoren sturen “kwaliteits signalen” naar Google. Dit wordt meegenomen in de zichtbaarheid van je website binnen de organische zoekresultaten. Google streeft ernaar om bezoekers de ultieme gebruikservaring te geven. Binnen een enkele klik moet het doel van de pagina te bereiken zijn en moet de intentie van de bezoeker vervuld zijn. Laten we hieronder nog wat dieper ingaan op de verschillende factoren.
Largest Contentful Paint (LCP)
De Largest Contentful Paint (LCP) laat zien wanneer het grootste element zichtbaar is op de pagina. Dit mag volgens de huidige Google richtlijnen niet langer dan 2,5 seconden duren. Wat Google hier eigenlijk mee wil zeggen is dat de bezoeker na 2,5 seconden de belangrijkste content op de pagina moet kunnen zien.
Het is belangrijk dat je de focus legt op het belangrijkste element op je website. Gaat het om een productpagina? Zorg dan dat de header, productomschrijving, de bestelknop en de productafbeelding als eerste zichtbaar zijn. De intentie van de zoeker is om dit product te bekijken en te kopen. Zorg ervoor dat de bezoeker dit ook zo snel mogelijk kan!
Er zijn een aantal manieren om je LCP score te verhogen:
- Optimalisatie van het ‘critical render path’ – Te vinden in Google Lighthouse
- Het optimaliseren en verkleinen van afbeeldingen
- Het verkleinen van CSS
- Het verkleinen van JavaScript
- Het optimaliseren en verkleinen van Font bestanden (Lettertypes)
Dit blijft nog steeds abstract. Gelukkig deelt Google een afbeelding met het verschil tussen de First Contentful Paint (FCP), het eerste wat een bezoeker te zien krijgt, en de Largest Contentful Paint (LCP).
First Input Delay (FID)
First Input Delay (FID) meet de eerste interactie van een bezoeker. Dit is dus het klikken op een knop, het doorklikken naar een pagina of een interactie met een ander element op de website. Google is streng in het meten van de First Input Delay. Daarom mag dit niet langer dan 100 ms duren (!). Dit wil zeggen dat binnen 100 ms (milliseconden) een interactie van de bezoeker moet kunnen plaatsvinden.
Je kent het wel, je zit op je telefoon en opent een link uit de Google zoekresultaten en je blijft maar een wit scherm zien. De pagina doet er dus erg lang over om te laden. Hierdoor kan er geen snelle interactie plaatsvinden. Uiteindelijk ga je weg omdat het te lang duurt voordat je iets kunt doen. Dit is niet de gebruikservaring waar Google naar streeft. Veelal komt dit door trage JavaScript bestanden die op de achtergrond aan het laden zijn. Deze bestanden blokkeren de interactie van de bezoeker maar zijn wel noodzakelijk voor het functioneren van de website. Daarom is het erg belangrijk om deze te verkleinen en te optimaliseren. Wordt het JavaScript niet of amper gebruikt? Verwijder het dan.
Er zijn een aantal manieren op de FID score te verbeteren:
- Verminder de afhankelijkheid van ‘third-party’ code
- Reduceer de uitvoertijd van JavaScript bestanden
- Houd het aantal verbindingen dat wordt gemaakt (API’s, externe JavaScript bestanden) beperkt
Een tip die Google niet geeft maar wel gebruikt kan worden is het Async Attribuut. Deze JavaScript functie kan worden gebruikt om bepaalde Scripts prioriteit te geven. Daarnaast is het mogelijk om het uitvoeren van een script uit te stellen. Dit kan ervoor zorgen dat een pagina ook sneller laadt!
Cumulative Layout Shift (CLS)
De Cumulative Layout Shift (CLS) is het meest tastbare van de drie Core Web Vitals. De CLS van je website wordt bepaald op basis van een score. Heeft je website een score hoger dan 0,25? Dan zal dit een slechte gebruikservaring als gevolg hebben. CLS verschilt dus met LCP en FID. CLS wordt namelijk niet berekend in (mili)seconden maar met een score.
Scoor je 0,1 of lager? Dan zit je goed! Zit je rond de 0,25 of hoger? Dan wordt het tijd om je website te optimaliseren!
De CLS score wordt basis van twee factoren berekend; Impact Fraction en Distance Fraction.
Impact Fraction
De Impact Fraction laat zien hoe groot de impact is van het verschuivende element (tekst, afbeelding, video, knop etc.) op basis van je scherm (viewport). Verschuift een groot stuk tekst en neemt dit een groot gedeelte van je scherm in? Dan is de impact dus ook groot! Verschuift een kleine afbeelding of een klein stuk tekst? Dan is de impact minder groot. Op de onderstaande afbeelding is een verschuiving van grote impact te zien!
Distance Fraction
Naast Impact Fraction hebben we Distance Fraction. Distance Fraction laat zien hoever het element is verschoven. Waar de Impact Fraction vooral kijkt naar het grootte van het element wat verschuift, kijkt de Distance Fraction naar de grootte van de verschuiving. Volg je het nog? Zo niet, stuur me dan even een berichtje op LinkedIn!
Op de onderstaande afbeelding is te zien hoe de Distance Fraction wordt berekend.
Hoe wordt de Cumulative Layout Shift (CLS) berekend?
Gelukkig hoef je dit niet zelf te doen maar het is goed om te weten hoe dit wordt berekend. Hiervoor wordt de volgende formule gebruikt:
layout shift score = impact fraction * distance fraction
Aan de hand van de bovenstaande afbeeldingen kan deze formule worden ingevuld.
Op de eerste afbeelding neemt, volgens Google, de verschuiving van het element 75% van het scherm in. Hierdoor krijgt de Impact Fraction een score van 0,75. De Distance Fraction, de grootte van de verschuving, neemt ongeveer 25% van het scherm in. De Impact Fraction krijgt dus een score van 0,25. Hierdoor komt de volgende berekening tot stand:
0,75 * 0,25 = 0,1875.
Volgens Google valt dit dus nog binnen de norm maar het is wel slim om hier een verbetering in door te voeren. Zorg ervoor dat een bezoeker een prettige ervaring heeft. Hierdoor zal deze sneller overgaan tot een conversie.
CLS in een notendop
Was het bovenstaande te abstract? Snap ik! Het is ook niet makkelijk. Het onderstaande filmpje laat precies zien waarom CLS in het leven is geroepen!
Het meten van je Core Web Vitals
Het is natuurlijk niet praktisch om het bovenstaande handmatig door te berekenen. En hoe weet je op welke URL’s dit van toepassing is? Gelukkig rolt de Google Search Console het rapport “Site Vitaliteit” uit. In dit rapport kun je zien welke URL’s wel en niet goed scoren op het gebied van de Core Web Vitals.
Ga naar de Google Search Console, log in en klik onder het kopje “Optimalisaties” op Site-vitaliteit. Let op! Momenteel is de functie alleen beschikbaar voor sites die wat groter zijn. Voor websites met kleine bezoekersaantallen en een lage organische zichtbaarheid zal de functie nog niet beschikbaar zijn.
Het is ook mogelijk om je score te berekenen via Webpagetest of de Google Lighthouse functie die standaard in Google Chrome zit.
Hulp nodig?
Ben je benieuwd naar het effect van de Core Web Vitals op jouw website? Neem dan een kijkje in de Google Search Console.
Kom je er nog niet uit dan help ik je graag verder! Neemt contact met op en ik stuur je spoedig een bericht terug!
