De Cumulative Layout Shift is een rankingsfactor waar Google meer en meer waarde aan hecht. Deze factor geeft aan hoe vaak de content op je website verschuift, bijvoorbeeld tijdens het scrollen. In een ideale wereld zou de content volledig ‘stil’ moeten staan. Mocht dit op je website niet het geval zijn, dan is dit nadelig voor de Cumulative Layout Shift van je website. En daarmee voor de ranking van je website.
CLS: Cumulative Layout Shift
In 2021 kwam Google plots met een revolutionaire tool op de proppen; Core Web Vitals. Dit is een groep van factoren die van invloed zijn op de page experience van je website. Door deze factoren te optimaliseren, optimaliseer je de beleving voor je bezoekers.
Binnen deze factoren speelt de Cumulative Layout Shift een belangrijke rol. Zoals hierboven al gesteld is, geeft deze factor de visuele stabiliteit aan. Zodra een bezoeker op je website begint te scrollen, zouden alle content blokken en overige blokken ‘stil’ moeten staan. Het komt op veel websites echter voor dat de blokken verschuiven.
Erg onwenselijk wat betreft Google. Google geeft namelijk aan dat het verschuiven van content voor irritaties zorgt (of kan zorgen) bij de bezoeker. De verschuivende blokken vormen een verstoring van de website. Daarmee vormt dit ook een verstoring voor de beleving van je bezoeker.
Heb je wel eens een website bezocht waarbij nét een button verschoof? Door die verschuiving klikte je mogelijk op een advertentie, waardoor je plots op een andere website uitkomt. Grote kans dat je dit niet wil en dat dit voor irritaties zorgt. Dat is niet alleen bij jezelf het geval, maar ook bij je bezoekers. Je moet er daarom voor zorgen dat alle elementen op je website zo ‘vast’ mogelijk staan.
De CLS wordt aangegeven aan de hand van een score met 2 decimalen achter de punt:
- Prima CLS: een website met een prima CLS heeft een score van 0.1 of lager. Dit geeft aan dat in 75% van de paginabezoeken de CLS prima op orde is.
- Matige CLS: een website met een matige CLS heeft een score tussen de 0.1 en 0.25. Bij zo’n website is er nog enige ruimte voor verbetering wat betreft de visuele stabiliteit.
- Slechte CLS: een website met een slechte CLS heeft een score van meer dan 0.25. Een dergelijke website is bijzonder irritant om te bezoeken en te gebruiken.
Hoe kan je de Cumulative Layout Shift meten en optimaliseren?
Met verschillende tools kan je de CLS van je website opmeten. Dit doe je bijvoorbeeld met PageSpeed Insights, met Lighthouse, met Google Search Console en met Chrome DevTools. Mocht de CLS niet naar je wens zijn, kan je deze op meerdere manieren optimaliseren.
Een van de beste manieren om de CLS te optimaliseren, is door je afbeeldingen aan te passen. De ervaring leert namelijk dat afbeeldingen over het algemeen de meeste laadtijd vragen. Dáárdoor is de kans ook groter dat de afbeeldingen gaan verschuiven of voor een verschuiving zorgen. Door je afbeeldingen te optimaliseren, verbeter je de visuele stabiliteit van je website fors.
Dit doe je onder meer door je afbeeldingen vaste maten mee te geven. Zorg er bovendien voor dat in je lay-out voldoende ruimte voor de afbeeldingen is. Des te meer ruimte, des te kleiner de kans op verschuivingen.
Ook is het zaak om je pijlen héél erg te richten op je mobiele website. Het beeldscherm van een smartphone is een stuk kleiner, waardoor de verschuivingen nog irritanter zijn. Probeer daarom op je mobiele website zo min mogelijk afbeeldingen te gebruiken.
Verder zou je op moeten met dynamische content. Dergelijke content is erg leuk, maar is dynamisch. Door deze dynamiek is dergelijke content vaak de oorzaak van verschuivingen. Tot slot adviseren wij je om op te passen met de fonts op je website. Indien je bijvoorbeeld van fonts effecten gebruikmaakt, kan dit ook van invloed zijn op de CLS-score.
Andere Core Vitals
De Google Web Core Vitals bestaan uit drie factoren. De CLS is daar een van de factoren van. Over de twee andere factoren vertellen we je hieronder iets meer:
- LCP: de Largest Contentful Paint geeft de laadsnelheid van het grootste element op de webpagina neer. Dit is bijvoorbeeld het grootste tekst vak of de grootste afbeelding. Des te sneller dit onderdeel laadt, des te beter de page experience is volgens Google.
- FID: de First Input Delay geeft de reactiesnelheid aan. Des te beter deze score is, des te sneller de pagina reageert op de input van de bezoeker. Volgens Google is ook dit van belang; geen enkele bezoeker wil wachten op een handeling die hij/zij zelf uitvoert. Onthoud hierbij goed dat de huidige internetgebruiker erg kritisch is.
Conclusie
Wil je met je website scoren? Ga dan serieus aan de slag met de Google Core Web Vitals. Binnen deze Vitals speelt de Cumulative Layout Shift een cruciale rol. Mocht je de CLS van je website willen verbeteren, dan ben je hiervoor bij ons aan het juiste adres. Wij optimaliseren de CLS graag voor je, waardoor de beleving van je website (verder) verbeterd wordt. Neem gerust contact met ons op voor het bespreken van alle mogelijkheden!
