SEO Woordenlijst: Google Core Web Vitals

Welke Core Web Vitals zijn er en wat zijn hun functies?

Google heeft drie 'Core Web Vitals' gedefinieerd die zich vooral bezighouden met de technische vereisten van een website: Hoe snel wordt content geleverd, wanneer reageert de website op de gebruiker en hoe stabiel is visuele content? De volgende Core Web Vitals worden gebruikt om dit te meten:

 

1. Grootste inhoudsvolle verf (LCP)
2. Interactie naar volgende lak (INP)
3. Cumulatieve verschuiving in lay-out (CLS)

 

Als je al bekend bent met het onderwerp, zie je misschien dat er een Web Vital is verdwenen en dat er een nieuwe waarde is toegevoegd. En inderdaad: In maart 2024 heeft Google de Web Vital First Input Delay (FID) vervangen door de Interaction to Next Paint (INP) metric. We zullen zo uitleggen waarom. Maar laten we eerst eens kijken naar de huidige Core Web Vitals en hun functies.

 

LCP: De laadsnelheid van een website

De Largest Contentful Paint (LCP ) beschrijft de tijd die het duurt voordat de hoofdinhoud of het grootste gebruikersrelevante element zichtbaar wordt nadat er op een pagina is geklikt. Dit heeft in eerste instantie alleen betrekking op de inhoud boven de vouw - d.w.z. blokken tekst of afbeeldingen die op de website verschijnen zonder te scrollen.

 

In het verleden werd meestal de tijd gemeten tot het eerste element op de website verscheen in plaats van de LCP: de First Contentful Paint (FCP). Dit kon bijvoorbeeld het verschijnen van laadbalken, de inhoudsopgave of de invoerbalk in zoekmachines zijn. De LCP is nu veel gebruiksvriendelijker, omdat er rekening wordt gehouden met de intentie van de gebruiker. De gebruiker is immers in de eerste plaats geïnteresseerd in de hoofdinhoud van de website.

 

Als je naar je statistieken kijkt, vraag je jezelf af: Wat is een goede waarde voor mijn LCP? Google geeft de volgende aanwijzingen:

 

• Goed: Laadsnelheden onder 2,5 seconden
• Ruimte voor verbetering: laadsnelheden tussen 2,5 en 4 seconden
• Slecht: Oplaadsnelheden van meer dan 4 seconden

 

Je kunt ook ontdekken hoe je Core Web Vitals zoals de Largest Contentful Paint kunt verbeteren in ons artikel.

 

INP: De reactiesnelheid van een website

De Web Vital Interaction to Next Paint is een meting voor de interactiviteit van een website. Alle gebruikersacties worden geregistreerd - d.w.z. klikken, toetsaanslagen en aanrakingen op aanraakschermen. Vervolgens wordt gemeten hoe lang het duurt voordat de gewenste reactie zichtbaar wordt voor de gebruiker.

 

Een lage INP geeft aan dat de website soepel en snel reageert voor meer dan 75% van alle gebruikers . Dit betekent dat de acties in minder dan 200 milliseconden worden uitgevoerd. Uitschieters worden buiten beschouwing gelaten. Als de responstijd meer dan 500 milliseconden bedraagt, is de INP slecht; alles tussen 200 en 500 milliseconden is voor verbetering vatbaar.

 

Waarom heeft de INP meetwaarde de Core Web Vital FID vervangen?

Zoals reeds vermeld, is de INP een vrij nieuwe web vitaal en verving de FID (First Input Delay) meting in maart 2024. De INP werd voor het eerst beschikbaar gesteld voor testen door Google in 2022. Na de introductie werd al snel duidelijk dat deze Web Vital beter rekening houdt met de gebruikerservaring dan de FID. Maar waarom is dat?

 

De First Input Delay kon alleen de eerste indruk van een website weergeven omdat alleen de eerste gebruikersinteractie werd gemeten. De INP geeft nu een veel uitgebreider beeld van de reactiesnelheid, omdat het alle gebruikersinteracties op een website registreert.

 

Daarnaast meet de INP de tijd totdat de consument een visuele weergave of een herkenbare reactie op zijn scherm krijgt. Dit was ook anders bij de Web Vital FID. Deze registreerde alleen de tijd totdat de browser de interactie begon te verwerken. De FID liet niet zien wanneer de gebruiker daadwerkelijk een reactie op zijn actie kreeg.

 

CLS: De visuele stabiliteit van een website

De Cumulative Layout Shift (CLS) is de derde webvitale die Google heeft gedefinieerd om de gebruikerservaring op een website te meten. Het gaat hierbij om de visuele stabiliteit van tekstblokken, afbeeldingselementen en afbeeldingen. Zodra de lay-out onverwacht verschuift tijdens het laden, scrollen of andere gebruikersinteracties, worden de volgende twee metingen gedaan:

 

1. Welk percentage van het weergavegebied neemt het element in beslag, inclusief de verplaatsing? Met een impactfractie van 60% zou de gemeten waarde 0,6 zijn.
2. Met welke afstand is het element verschoven ten opzichte van de grootte van het weergavegebied? Met een afstandsfractie van 20% zou de gemeten waarde 0,2 zijn.

 

Als je de waarden met elkaar vermenigvuldigt, krijg je de layoutverschuivingsscore. Als deze lager is dan 0,1, is dit een goede CLS-waarde. Alles daarboven is voor verbetering vatbaar. In ons voorbeeld is de layoutverschuiving 0,12 (0,6 * 0,2). Dit zou dus moeten worden geoptimaliseerd. Timo Specht zal nu uitleggen waar je de statistieken voor je Core Web Vitals kunt vinden.

 

Hoe kan Core Web Vitals worden gemeten?

De Core Web Vitals worden door Google gemeten op zowel mobielvriendelijkheid als voor de desktopversies van een pagina. Dankzij hun gebruikersgerichtheid zijn de waarden ook voor niet-experts gemakkelijk te begrijpen.

 

Als u nu de Core Web Vitals voor uw websites wilt meten, vraagt u zich misschien af wat de beste en gemakkelijkste manier is om dit te doen. Er zijn twee manieren om dit te doen: het verzamelen van labgegevens en het meten van echte gebruikerservaringen. Het is het beste om beide opties te combineren.

 

Laboratoriumgegevens (Labgegevens)

Bij het meten van labgegevens worden tools gebruikt die gebruikerstoegang tot uw website nabootsen en zo de belangrijkste webvitalen meten. Dit is vooral nuttig voordat u een of meer pagina's publiceert om te voorkomen dat er problemen ontstaan met de echte pagina-ervaring.

 

De volgende hulpmiddelen worden het vaakst gebruikt bij het verzamelen van laboratoriumgegevens:

 

• Ontwikkelaarstools van Chrome(Google Lighthouse)
• Google PageSpeed-inzichten

 

Het nadeel van vuurtorengegevens en andere labgegevens is dat ze geen rankingfactor zijn en daarom irrelevant voor plaatsing in zoekmachineresultaten. Het enige dat telt zijn de veldgegevens. Bovendien kan de Web Vital INP niet worden gemeten omdat hiervoor echte gebruikersinvoer nodig is. In plaats daarvan wordt een vergelijkbare waarde verzameld: TBT (Total Blocking Time). Deze moet minder dan 300 milliseconden zijn.

 

Echte gebruikerservaringen (praktijkgegevens)

De labgegevens zijn niet alleen oninteressant voor de rangschikking van je pagina's in de SERP's, maar leiden ook vaak tot afwijkende resultaten in vergelijking met de metingen in de praktijk. Dit komt doordat gebruikers verschillende apparaten gebruikenen verschillende netwerkomstandigheden hebben.

 

Werkgeheugen en CPU-prestaties en interacties met de site verschillen ook van gebruiker tot gebruiker en vooral van gebruiker tot lab. In tegenstelling tot de laboratoriummetingen geven de veldgegevens daarom een realistischer beeld.

 

Een aantal verschillende tools zijn geschikt voor het meten van echte gebruikerservaringen, zoals

 

• Rapport over de gebruikerservaring in Chrome (Google PageSpeed Insights)
• Google Core Web Vitals-rapport
• JavaScript (Web Vitals-bibliotheek)
• Web Vitals-extensie voor Chrome
• Externe RUM-providers (Real User Monitoring)

 

Veldgegevens hebben echter ook nadelen. Nieuwe problemen op websites zijn bijvoorbeeld pas na ongeveer een maand zichtbaar in de rapporten. Labgegevens kunnen zeer nuttig zijn om de kerncijfers regelmatiger te bekijken. Vooral na optimalisaties of wijzigingen aan de site geven ze direct informatie over mogelijke effecten op de Core Web Vitals.

 

De belangrijkste tips voor het verbeteren van Core Web Vitals

Als u individuele of alle Core Web Vitals wilt verbeteren, moet u eerst de oorzaak van een slechte LCP, INP of CLS vinden. Het goede nieuws is dat u met Google PageSpeed Insights niet alleen de statistieken van alle Core Web Vitals voor uw website kunt bekijken, maar ook een diagnose van de individuele Web Vitals kunt vinden en tips over hoe u deze kunt verbeteren.

Opties om het LCP te optimaliseren

Het Largest Contentful Paint, d.w.z. het grootste gebruikersrelevante element op je pagina, kan bestaan uit tekst of een afbeeldingselement. Om laadtijden te verbeteren, moet je eerst uitzoeken welk element Google definieert als het belangrijkste element. Dit kan er anders uitzien afhankelijk van het apparaat van de gebruiker. Met PageSpeed Insights moet je daarom je pagina analyseren voor zowel de mobiele als de desktopweergave.

 

In het gedeelte Diagnostics vind je het Largest Contentful Paint-element en andere handige tips om je Web Vitals te verbeteren. Om je LCP tijd te verbeteren, moet dit contentelement zo snel mogelijk geladen worden. Om dit te doen, kun je de volgende instellingen maken in content management systemen zoals WordPress:

 

• Browser verzilveren instellen om een snellere serverreactie te krijgen
• Optimaliseer de hosting van uw website voor een kortere TTFB (Time to First Bite)
• Content Delivery Network gebruiken om inhoud sneller af te leveren
• Onnodige JavaScript en CSS verwijderen/verplaatsen voor snellere weergave van LCP-elementen
• Als je LCP element een afbeelding is, moet je het comprimeren.

 

Hoewel het verbeteren van de LCP veel technische expertise kan vereisen, moet je je eerst op twee dingen concentreren: Zorg dat de reactietijd van je server sneller is en maak het LCP-element zo snel mogelijk beschikbaar voor de gebruiker.

 

Hoe u een beter INP kunt bereiken

De Web Vital INP kan alleen worden gemeten met veldgegevens. In de regel zijn de CrUX-gegevens van Google, die je kunt vinden in het Chrome-gebruikerservaringsrapport, hiervoor voldoende. De reactietijd op de interactie van een gebruiker kan op de volgende drie plaatsen worden beïnvloed:

 

1. Tijdens invoer (invoervertraging)
2. Tijdens verwerking (lange verwerkingstijd)
3. Tijdens de presentatie (presentatievertraging)

 

Om de gebruikersinteractie te versnellen, moet je de Java Script-code optimaliseren. Zorg voor minder werk in de hoofddraad en verwijder onnodige JavaScript-code van externe leveranciers. Lange JavaScript-taken moeten ook worden opgesplitst in meerdere stukken. Hierdoor kunnen gebruikersacties tussendoor plaatsvinden zonder dat JavaScript het werk eerst helemaal moet afmaken.

 

Voor een snellere verwerking en presentatie van de inhoud moet je lay-outproblemen uitsluiten door de inhoud asynchroon aan te bieden. Een kleinere DOM-grootte draagt ook bij aan het sneller renderen van de pagina-inhoud.

 

Hoe je het CLS kunt verbeteren

De meest voorkomende oorzaak van een hoge CLS-waarde is het niet toewijzen van afbeeldingsformaten. Om verschuivingen in de lay-out te minimaliseren, moet je de breedte en hoogte van de elementen in de HTML-code opgeven met "width" en "height". Hierdoor wordt er ruimte in de paginalay-out gereserveerd voor je afbeeldingen en video's, zelfs als andere elementen al geladen zijn.

 

Je moet vooraf voldoende ruimte in de paginalay-out reserveren voor advertenties en banners waarvan je de grootte niet kunt beïnvloeden. Als dit ook niet mogelijk is, moet vooral dynamische inhoud verder naar beneden in het weergavegebied worden geplaatst.

 

Bij het gebruik van webfonts kunnen er na het laden van deze fonts verschuivingen in de lay-out optreden. Om dit te voorkomen, kan de websitebeheerder de volgende optimalisaties doorvoeren:

 

• Sorg dafür, dass die Webschriftart so früh wie möglich lädt (<link rel=preload>).
• Gebruik een fallback lettertype dat qua grootte en stijl lijkt op het weblettertype.
• Pas het fallback- en webfont aan elkaar aan met behulp van API's.
• Verkort de laadtijd van het webfont met behulp van de Font Loading API.

 

In het Chrome-gebruikerservaringsrapport na 28 dagen kunt u zien of de optimalisaties hun vruchten hebben afgeworpen.

 

Goede Core Web Vitals en slechte SERP rankings? Dat kan de reden zijn!

Web Vitals zijn een van de weinige manieren om de gebruiksvriendelijkheid van een website meetbaar en vergelijkbaar te maken in cijfers . Desondanks is het mogelijk dat uw site ondanks geoptimaliseerde Web Vitals niet bovenaan in de zoekmachineresultaten staat. Merk op dat andere rankingfactoren ook bijdragen aan de gebruikerservaring en dus aan betere rankings op Google.

 

Goede SEO omvat ook on-page optimalisatie, die bijvoorbeeld wordt bereikt door linkbuildingmaatregelen, een aantrekkelijk ontwerp, zoekwoordoptimalisatie en relevante inhoud met toegevoegde waarde. Als je met deze punten rekening houdt, bieden de Core Web Vitals een kans om een paar plaatsen op te schuiven in de SERP's. Bij Timo Specht helpen we je om je SEO- en SEA-maatregelen holistisch te verbeteren en je websites op 1 in Google te krijgen.