CLS
Afkorting van Cumulative Layout Shift
Wat betekent CLS?
CLS meet hoeveel onderdelen van je webpagina onverwacht verschuiven tijdens het laden. Het is een van de Core Web Vitals van Google: hoe lager de score, hoe stabieler je pagina oogt.
Veelgestelde vragen over CLS
Wat is een goede CLS-score volgens Google?
Een CLS van 0,1 of lager geldt als goed. Tussen 0,1 en 0,25 is verbetering nodig en boven 0,25 noemt Google het slecht. Google kijkt naar het 75e percentiel: minstens driekwart van de paginabezoeken moet onder de grens blijven.
De score is geen tijd of percentage. Het is een berekening van hoe groot het verschoven deel van het scherm is en hoe ver het opschuift. Verschuivingen binnen een halve seconde na een klik of tik van je bezoeker tellen niet mee, omdat de bezoeker die zelf veroorzaakt en dus verwacht.
Hoe meet ik de CLS van mijn website?
Je meet CLS gratis met tools van Google:
- PageSpeed Insights: vul een URL in. Bovenaan zie je data van echte bezoekers (als je genoeg verkeer hebt), daaronder een labtest.
- Search Console: het rapport Core Web Vitals laat per groep pagina's zien waar CLS goed of slecht is, apart voor mobiel en desktop.
- Chrome DevTools: in het tabblad Performance zie je precies welk element verschuift.
Wil je de cijfers in je WordPress-dashboard zien? Met Site Kit by Google koppel je Search Console en PageSpeed Insights aan je website.
Hoe verbeter ik CLS op mijn WordPress-website?
Pak de bekendste oorzaken van verschuivingen een voor een aan:
- Geef afbeeldingen een breedte en hoogte. In WP Rocket zet je hiervoor de optie Add missing image dimensions aan.
- Zet lazy loading (pas laden bij scrollen) uit voor afbeeldingen bovenaan de pagina.
- Reserveer vaste ruimte voor advertenties, video's, sliders en ingesloten content.
- Toon je cookiebanner als zwevende balk onderin, zodat hij je content niet omlaag duwt. Dat kan bijvoorbeeld met Complianz of CookieYes.
- Laad lettertypes vanaf je eigen server en gebruik font-display: swap, zodat tekst niet verspringt.
Test na elke aanpassing opnieuw, zodat je weet wat het verschil maakte.
Waarom is mijn CLS goed in PageSpeed, maar slecht in Search Console?
Omdat ze iets anders meten. Dit is een veelgemaakt misverstand: een goede labscore betekent niet dat je CLS in orde is.
De labtest in PageSpeed Insights meet alleen tijdens het laden, op één gesimuleerd apparaat, zonder te scrollen of te klikken. Search Console gebruikt data van echte Chrome-gebruikers over de afgelopen 28 dagen, gemeten tijdens het hele bezoek. Verschuivingen door content die pas bij scrollen laadt, laat verschijnende advertenties, pop-ups of een plakkende menubalk ziet de labtest vaak niet. Scrol daarom zelf door je pagina op een echte telefoon en let op wat er verspringt.
Hoe lang duurt het voordat Google mijn betere CLS ziet?
Dat kan tot ongeveer vier weken duren. Search Console gebruikt de gegevens van echte bezoekers over een periode van 28 dagen, dus oude en nieuwe metingen lopen een tijd door elkaar en je score verbetert geleidelijk.
Zo versnel en controleer je het proces:
- Leeg na je aanpassingen de cache van je cacheplugin en eventueel je CDN.
- Controleer met een labtest in PageSpeed Insights of de verschuiving echt weg is.
- Klik in Search Console bij het probleem op Oplossing valideren.
Heb je weinig bezoekers, dan toont Google soms helemaal geen veldgegevens en ben je aangewezen op de labtest.
