In mei 2020 werd de Google Page Experience update aangekondigd. Ieder jaar staan er minstens 2 grote algoritme-updates bij Google op de planning. Vanwege het coronavirus krijgen we dit keer meer informatie over wat deze update precies inhoudt. Hiermee geeft Google bedrijven de kans om hun website(s) op deze update voor te bereiden zodat hun organische positie niet in gevaar komt zodra het nieuwe algoritme wordt uitgerold. Later is bekend geworden dat de naam verandert in Core Web Vitals.
In dit blogartikel leg ik je uit wat de Core Web Vitals update inhoudt en wat je nu alvast kunt doen om jouw website hiervoor klaar te stomen.
Over Core Web Vitals
Core Web Vitals is een set van signalen die meten hoe gebruikers een webpagina ervaren en er interactie mee aangaan. Dit staat geheel los van de informatieve waarde die een pagina heeft. De set van signalen bestaat uit bestaande Google rankingfactoren zoals mobielvriendelijkheid, een veilige browse-omgeving en paginasnelheid, gecombineerd met zogeheten Core Web Vitals.
Iedere Core Web Vital vertegenwoordigd een onderdeel van de gebruiksvriendelijkheid. Google heeft 3 van deze Core Web Vitals bekendgemaakt: loading, interactivity en visual stability, welke met de volgende metrics worden beoordeeld:
- Largest Contentful Paint (LCP)
- First Input Delay (FID)
- Cumulative Layout Shift (CLS)
(bron: Google web.dev)
Largest Contentful Paint
Deze metric meet de loading performance. Voor een goede gebruiksvriendelijkheid moet je LCP binnen 2,5 seconden zichtbaar zijn als een gebruiker je pagina voor het eerst laadt. Dit is dus niet de laadtijd van het eerste element dat je ziet als je een pagina laadt (dit is de FCP). Dit is de laadtijd van het grootste element op je pagina. Bij productpagina’s is dit vaak de afbeelding van het product. Het grootste element kan ook een tekst zijn. De afbeeldingen moeten dan wel kleiner zijn dan de paragraaf.
Voorbeelden van de LCP zijn:
- Te grote afbeeldingen
- Te veel elementen die op hetzelfde moment worden geladen
- Lange responstijd van de server
- Third party scripts
- Niet-gebruikte plugins
Hoe kan de LCP geoptimaliseerd worden?
Google PageSpeed Insights
Je kan je LCP meten met Google PageSpeed Insights. Het mobiele resultaat is hierbij leidend (mobile-first). Bij de aanbevelingen vind je suggesties voor het versterken van je website. Hier kun je samen met de webbouwer mee aan de slag voor het verbeteren van de website.
Google Lighthouse
Voor extra inzichten kan je gebruik maken van Google Lighthouse. Dit rapport kan je draaien door naar de webpagina te gaan die je wilt meten. Inspecteer vervolgens je website (CTRL+SHIFT+I) en kies rechts bovenin voor Lighthouse. Hierin kan je onder andere zien welk element als Largest Contentful Paint beschouwd. Duurt het langer dan 2,5 seconden om dit element te laden? Kies dan voor een minder zware afbeelding. Voegt de afbeelding niet veel toe aan je verhaal? Overweeg dan een andere opmaak waarmee bijvoorbeeld een tekstblok de LCP wordt.
First Input Delay
Met de FID kan je de ervaring van de gebruiker meten zodra deze interactie met je website heeft. Denk bijvoorbeeld aan een klik op een link of button. Je gaat er natuurlijk vanuit dat je snel naar de volgende pagina wordt herleid als je op een link klikt. Helaas is dit in de praktijk niet altijd het geval, met een minder tevreden gebruiker als gevolg.
Bij First Input Delay wordt enkel de eerste interactie-ervaring gemeten. Nu kan iedere vertraging voor irritatie zorgen, maar de eerste interactie is vaak essentieel voor de totale gebruikerservaring. Daarnaast worden de grootste issues waargenomen als een website voor het eerst bezocht wordt omdat er dan veel elementen tegelijkertijd geladen moeten worden.
Hoe kan de FID geoptimaliseerd worden?
Je kan de First Input Delay niet meten met tools omdat er een interactie van een gebruiker nodig is om deze metric te meten. In onder andere PageSpeed Insights kan je wel de Total Blocking Time (TBT) meten. Door de TBT te optimaliseren, zal je automatisch ook je FID verbeteren. Bekijk hiervoor de aanbevelingen uit het Google Lighthouse rapport. Daarnaast vind je hier een aantal FID-optimalisaties die je met je webdeveloper kunt bespreken.
Cumulative Layout Shift
De derde Core Web Vital is Cumulative Layout Shift. Deze meet de visuele stabiliteit van je website door te kijken naar het aantal onverwachte layout shifts. Je kent het misschien wel: je bent een artikel aan het lezen en ineens verandert er iets op de pagina waardoor je de tekst kwijt bent. Of erger: je wilt op een link klikken en nét voordat je dit doet, verschuift de layout waardoor je per ongeluk op de verkeerde link klikt. Dit kan onder andere komen doordat bepaalde elementen later worden ingeladen.
Met CLS kan je meten hoe vaak gebruikers dit op jouw website ervaren. Je kan je CLS-score terugvinden in Google PageSpeed Insights. Onder de 0,1 is een goede score. Ligt jouw score boven de 0,25? Dan moet je hier zeker mee aan de slag!
CLS-optimalisaties die je zelf kunt oppakken
- Voeg altijd een formaat aan je afbeeldingen, video’s, widgets of advertenties toe of laat voldoende ruimte open zodat het element kan laden zonder de lay-out te verschuiven.
- Voeg geen content boven de bestaande content toe, tenzij het past bij de actie van de gebruiker (zie onderstaand voorbeeld).
(bron: Google web.dev)
TIP: gebruik het rapport ‘Site-vitaliteit’ van Google Search Console om de issues op jouw website snel op te sporen.
Ben jij klaar voor de Core Web Vitals update?
De Core Web Vitals update wordt naar verwachting aankomende maand (mei 2021) uitgerold. Iedereen heeft de mogelijkheid huidige statistieken te analyseren en websites op basis van deze insights te optimaliseren. Kan jij hier hulp bij gebruiken? Wij helpen je graag!
