Core Web Vitals: LCP
Google gaat voor de beste gebruikerservaring. Snelle laadtijden spelen daar een grote rol in. Daarom plaatst Google websites die snel laden (en dus een goede gebruikerservaring geven) bovenaan in de zoekresultaten. Een van de punten die Google daarvoor meet is de LCP.
Wat is LCP?
De Largest Contentful Paint meet hoelang het duurt voordat het grootste element op een pagina wordt geladen. Daarbij kijkt Google naar de elementen boven de (gemiddelde) vouw. Dus de elementen die direct in beeld komen, zonder te scrollen of te klikken. Dit houdt dus in dat de LCP per website en zelfs per pagina verschillend is. Elke website is immers anders opgebouwd. Vaak gaat het om een afbeelding of misschien zelfs een video. Maar ook tekstblokken kunnen LCP-elementen zijn.
Google wil graag dat de LCP zo snel mogelijk ingeladen wordt. Als richtlijn houdt de zoekmachine een tijd aan van maximaal 2,5 seconden. Tussen 2,5 en 4 seconden is gemiddeld en heeft verbetering nodig. Boven 4 seconden is slecht en moet echt aangepakt worden. Zorg er dus voor dat de LCP-elementen op jouw website idealiter binnen 2,5 seconden volledig ingeladen zijn.
Hoe vind ik mijn LCP?
In sommige gevallen kun je met wat logisch nadenken zelf al bepalen wat het LCP-element op jouw website is. Bij onze klanten edenbv.nl en flyingfishfoils.eu draaien er video’s op de achtergrond van de banner. Deze video’s zijn de LCP-elementen op hun homepage.
Soms echter is het lastiger. Bij onze eigen homepage bijvoorbeeld. Er zijn geen grote afbeeldingen boven de vouw. Dan gebruik je PageSpeed Insights om het LCP-element te vinden. Je voert de URL in en drukt op “Analyseren”. Vervolgens krijg je een score. Je ziet onder labgegevens de laadtijd van het LCP-element op je webpagina. Vervolgens scroll je naar beneden. Onder Diagnostische gegevens zie je LCP-element. Als je dat openklikt, zie je het grootste element op je webpagina boven de vouw. In ons geval is dat de <h3>-heading.
De snelheid van je LCP verbeteren
Nu je je LCP-elementen hebt gevonden, wil je natuurlijk graag dat ze sneller inladen. Er zijn meerdere factoren die daarbij een rol spelen. Allereerst is het belangrijk om de reactietijd van je server zo kort mogelijk te houden. Goede hosting speelt hierbij een belangrijke rol. Maar ook het cachen van je website is een belangrijke stap om de serverreactietijd te verkorten.
Daarnaast is het slim om goed te kijken of er geen JavaScripts en/of CSS-stylesheets zijn die de weergave blokkeren. Bij het inlezen van een webpagina loopt je browser de code na. Als er dan een JavaScript-tag of een externe stylesheet gesignaleerd wordt, zal deze worden bekeken. Er wordt dus even afgeweken van het lezen van de code van de webpagina. Dit zorgt voor vertraging en zal dus ook voor een langere laadtijd van je LCP-element zorgen.
En uiteraard is het belangrijk om te kijken of je LCP-elementen zelf nog geoptimaliseerd kunnen worden. Gaat het om afbeeldingen of video’s, zorg er dan voor dat deze zo klein mogelijk zijn. Is je LCP-element een blok tekst, comprimeer deze dan.
Het verbeteren van de laadtijden van de LCP-elementen op je website is een belangrijke graadmeter voor de snelheid van je website. Hoe sneller je website, hoe langer bezoekers zullen blijven hangen op je website. En dat is onderaan de streep natuurlijk het belangrijkste!
Wil je ook actief aan de slag met het verbeteren van je LCP laadtijd? Wij helpen je graag verder! Neem contact met ons op voor een vrijblijvend adviesgesprek.
