Je bloeddruk meten, reflexen testen of bloedprikken; het is heel normaal om regelmatig te controleren of je lichaam gezond functioneert. Voor een website is dit niet anders. Om de ‘gezondheid’ van een website te meten ontwikkelde Google een hulpmiddel genaamd ‘core web vitals’. Hiermee controleer je hoe het staat met de ‘vitale organen’ van je website.

 

Snelheid, stabiliteit en interactie

Google’s test bestaat uit drie meetpunten.

1. Largest Contentful Paint (LCP). Hierbij gaat het om de laadsnelheid van een webpagina. Hoe lang duurt het voordat het grootste zichtbare element (zoals een foto, video of tekstblok) volledig geladen is? Het is overigens mogelijk om dieper te graven en verder te gaan dan alleen de initiële laadtijd van dit element, maar vaak wordt dat complex en levert het weinig extra inzichten op.

2. Cumulative Layout Shift (LCS). Bij dit punt kijkt Google in hoeverre de layout verschuift tijdens het laden. Soms lijkt een webpagina volledig geladen, maar verspringt de layout precies op het moment dat de gebruiker een button wil aanklikken of wil gaan lezen. Dergelijke onverwachte verschuivingen ontstaan vaak door ongelijke laadtijden van elementen en zijn zeer gebruiksonvriendelijk.

3. Interaction to Next Paint (INP). Hierbij meet Google hoe snel een webpagina reageert op interactie van gebruikers. Het gaat om acties zoals het openen van een menu of het wijzigen van het aantal items in je winkelwagentje.

Deze drie punten hebben directe invloed op de gebruikerservaring en de SEO-prestaties (de ranking van jouw website in zoekmachines). Onnodige verspringingen en trage menu’s roepen irritatie waardoor bezoekers je website vroegtijdig verlaten. Een verhoogde bounce rate is daarvan het gevolg.

Daarnaast zal een bezoeker sneller de weg vinden naar jouw website wanneer deze goed werkt. Negatieve prestaties hebben een negatieve impact op de ranking van een website in zoekmachines. Voor optimale SEO heb je dus ook een optimaal werkende website nodig.

 

 

Een voorbeeld van een rapport van Google, van onze site natuurlijk.

 

Wat is ‘snel’ volgens Google?

Google geeft bij het analyseren van je website aan hoe snel hij is via de kleuren groen, oranje en rood. Maar wanneer krijgt je website nu een bepaalde beoordeling? Wij zetten het op een rijtje, zodat je weet waar je naartoe wil werken als je website nog niet voldoet op alle gebieden:

1. LCP. Blijf je onder de 2,5 seconden? Perfect! Duurt het langer dan 4 seconden voordat het grootste element op je pagina geladen is? Dan is de kans groot dat bezoekers ongeduldig worden en je website verlaten.

2. CLS. Hierbij gaat het om zeer kleine waarden. Je site presteert goed als alle elementen binnen 0,1 seconden stabiel zijn. Bij een waarde boven de 0,25 seconden zal een gebruiker zich gaan irriteren.

3. INP. Voor deze indicator geldt: onder de 200 milliseconden is uitstekend, boven de 500 milliseconden is het noodzakelijk om de performance van je website te verbeteren.

 

Je website gezonder maken

Slaan de metingen rood uit voor jouw website? Wij helpen je graag met een professionele analyse en optimalisatie van je hosting en websiteperformance. Hosting speelt namelijk een belangrijke rol bij de laadsnelheid.

Maar er zijn ook een aantal elementen waar je zelf naar kan kijken en kan starten met verbeteringen.

 

Contentmanagementsystemen (CMS’en) en plug-ins

Als je gebruikmaakt van een CMS (bijvoorbeeld Wordpress of Joomla) dan is dat als het ware een tussenpersoon tussen de gebruiker en de website. Veel CMS’en zetten externe software in om taken uit te voeren, bijvoorbeeld het inladen van de cookie banner via een plug-in. De kans is dan groot dat de laadsnelheid toeneemt. Te veel of slecht ontwikkelde plug-ins vertragen je website én vergroten de kans op layoutverspringingen.

Omdat er met een CMS allerlei aanvragen gedaan worden op je website om verschillende noodzakelijke acties uit te voeren, ontstaat er een grote stapel werk en bestaat er risico op een opstopping. Wanneer je een goed geschreven code hebt en je website geen externe aanvragen moet doen, zit alles in één order en loopt het daarom een stuk soepeler. De verschillende elementen op je website sluiten op elkaar aan in plaats van dat alle plug-ins afkomstig zijn van een andere partij en daardoor soms een blokkade kan ontstaan.

Dat betekent niet dat een CMS altijd slecht is. Je kunt een CMS verlichten door te kiezen voor een ‘headless’ CMS. Daarmee houd je alleen de basis over en heb je niet alle extra software die de laadsnelheid vertraagt. Wil je hierover meer lezen? Dat kan in deze blog.

 

Afbeeldingen en video’s

Hoe groter de bestanden zijn van de afbeeldingen of video’s die je plaatst, hoe meer het vraagt van je website. Het is een mogelijkheid om de grootte van bestanden te verkleinen, maar een nog nettere oplossing is om afbeeldingen te exporteren naar een zogenaamd ‘web-ready’ bestandstype. Hiervoor raden we aan om afbeeldingen om te zetten in bestandstypen WebP of AVIF. Voor video’s zijn WebM met AV1 of VP9 coded mogelijke bestandstypen, of je kunt streams in plaats van video’s plaatsen. Klinkt dit nog als een geheimtaal voor je? Geen zorgen, hierover volgt binnenkort ook een blog.

Ben je er met deze stappen nog niet of zie je door de plug-ins de website niet meer? Dan staan wij voor je klaar. Mail ons voor een vrijblijvend kopje koffie op info@parrott.nl.