Core Web Vitals: wat zijn ze & hoe kan je ze optimaliseren?

Wil je goed scoren in Google? Dan kan je de gebruikservaring op je website niet meer zomaar links laten liggen. Google heeft namelijk bevestigd dat het gebruikservaring meeneemt als ranking factor. Google hoopt hiermee een stap dichter bij zijn ultieme doel te komen: webpagina's zo relevant en gebruiksvriendelijk mogelijk maken voor bezoekers.

Page experience blijft een grote en veelomvattende term. Daarom maakt Google deze meetbaar aan de hand van de Core Web Vitals score. In dit blogartikel vertellen we je graag meer over deze 3 metrics en hoe je ze kan optimaliseren.

Core Web Vitals zijn een reeks specifieke factoren die Google belangrijk vindt om de algemene gebruikservaring van een webpagina te bepalen. Core Web Vitals bestaan uit drie specifieke metingen van paginasnelheid en gebruikersinteractie: Largest Contentful Paint, Interaction to Next Paint en Cumulative Layout Shift.

Belangrijk om te weten: sinds maart 2024 vervangt Interaction to Next Paint (INP) de vroegere metric First Input Delay (FID). INP geeft een veel completer beeld van de responsiviteit van je website, meer daarover verder in dit artikel.

Largest Contentful Paint (LCP) meet de waargenomen laadsnelheid: de tijd die je pagina nodig heeft om het grootste element op je scherm te tonen. Voor een goede gebruikservaring streef je naar een grens van 2,5 seconden.

Hoe LCP optimaliseren?

• Verwijder onnodige scripts van derden: elk script van derden kan een pagina merkbaar vertragen. Onnodige scripts doe je dus best weg.
• Upgrade je webhost: betere hosting staat gelijk aan snellere laadtijden.
• Stel lazy loading in: zo worden afbeeldingen alleen geladen als iemand naar beneden scrollt op je pagina.
• Verwijder grote pagina-elementen: Google PageSpeed Insights vertelt je of je pagina een groot element heeft dat de LCP vertraagt.
• Minimaliseer je CSS: beperk je tot de CSS die echt nodig is.

Sinds maart 2024 vervangt Interaction to Next Paint (INP) de vroegere metric First Input Delay (FID) als officiële Core Web Vital. INP meet de responsiviteit van je webpagina, en doet dat veel completer dan FID vroeger deed.

Waar FID enkel de eerste interactie van een bezoeker meette, kijkt INP naar alle interacties tijdens het volledige paginabezoek: elke klik, tik of toetsaanslag. Zo krijg je een veel realistischer beeld van hoe responsief je website écht aanvoelt, niet enkel bij het eerste contact, maar doorheen het hele bezoek.

Google hanteert de volgende richtlijnen voor INP:

• 200 milliseconden of minder: goed
• 201 tot 500 milliseconden: te verbeteren
• Meer dan 500 milliseconden: slecht

Hoe INP optimaliseren?

• Minimaliseer JavaScript (of stel het uit): het is moeilijk voor gebruikers om te interageren met een pagina terwijl de browser JavaScript laadt.
• Verwijder niet-kritische scripts van derden: scripts zoals Google Analytics of heatmaps kunnen een negatieve invloed hebben op je responsiviteit.
• Gebruik een browsercache: dit zorgt dat de inhoud op je pagina sneller laadt.
• Verdeel zware taken in kleinere stukken: zo blijft je pagina responsief, ook tijdens intensieve verwerkingen.

De Cumulative Layout Shift (CLS) is een maatstaf voor onverwachte lay-outverschuivingen. Een lay-outverschuiving treedt op wanneer een zichtbaar element van positie verandert van het ene gerenderde frame naar het volgende. Een goede score ligt rond de 0,1 of minder.

Hoe CLS optimaliseren?

• Gebruik vaste afmetingen voor media: afbeeldingen en advertenties hebben altijd laadtijd nodig, reserveer daarom op voorhand ruimte en specificeer hoogtes en breedtes.
• Voeg nieuwe UI-elementen onder de vouw toe: zo duwen ze geen inhoud naar beneden waarvan de gebruiker verwacht dat die blijft staan.

Met de Core Web Vitals-score heb je als marketeer of developer objectieve metrics om de gebruikservaring op je website bij te houden. Je Core Web Vitals zijn via verschillende tools te achterhalen:

• Google PageSpeed Insights
• Google Search Console
• Google Chrome Lighthouse
• Webpagetest.org