FCP (First Contentful Paint)

Wat is First Contentful Paint?

First Contentful Paint of FCP meet de tijd vanaf het moment dat iemand je website opent tot het eerste zichtbare onderdeel verschijnt. Dit kan een stuk tekst zijn, een afbeelding of een SVG. Alles wat binnen een iframe staat telt hierbij niet mee. Kort gezegd laat FCP zien hoe snel de gebruiker iets ziet gebeuren op het scherm. Wanneer een pagina te lang leeg blijft, kan dit de indruk wekken dat de website traag of zelfs kapot is.

Kortom is gaat het om de hoeveelheid tijd die de browser neemt om de inhoud aan de gebruiker te tonen. Wanneer er een wit leeg scherm op je scherm tevoorschijn komt gaat de gebruiker zich afvragen of de website wel goed functioneert of wel goed laadt.

Visueel voorbeeld van FCP:

Hoe komt Google aan deze informatie?

De informatie die wordt gebruik voor First Contentful Paint wordt door Chrome User Experience Report, ook wel CrUX genoemd, verzamelt. De gegevens worden van verschillende apparaten onder variabele netwerkomstandigheden en verschillende locaties verzamelt. Zo kan het voorkomen dat een URL niet wordt opgenomen in het Chrome User Experience Report, wanneer het niet voldoende gegevens bevat.

Na het optimaliseren van een website is het niet vanzelfsprekend dat er een verbetering in Google Search Console plaatsvindt. Er zijn namelijk nog andere factoren bij betrokken. Denk hierbij aan netwerkomstandigheden en gebruikerslocatie. Daarnaast wordt er door Google ook gebruik gemaakt van gegevens om een rapport te genereren. Dit zorgt ervoor dat slechte of matige prestaties nog steeds kunnen voorkomen.

Hoe kun je de First Contentful Paint verminderen?

Je kunt op twee manieren de First Contentful Paint veranderen. Ten eerste kun je de leveringssnelheid van de middelen verbeteren. Ten tweede kun je die bronnen op een niet-renderende manier laden.

Het ligt voor de hand om je tijd naar de eerste byte (TTFB) te verbeteren, wat automatisch invloed heeft op de First Contentful Paint (FCP). Bovendien verbetert het de laadtijd van de gehele website.

Technieken die bruikbaar zijn om de First Contentful Paint te verbeteren kunnen erg ingewikkeld zijn. Zo is het op bepaalde websites niet mogelijk om alle veelvoorkomende zwaktepunten op te lossen. Dit is het geval bij websites die een zwaar thema of paginabuilder bevatten.

Waarom is FCP belangrijk?

FCP is meer dan een technische meting. Het zegt veel over de eerste indruk die bezoekers van je website krijgen. Mensen haken snel af wanneer ze te lang naar een leeg scherm kijken. Een snelle FCP zorgt ervoor dat de gebruiker direct ziet dat de pagina werkt en dat er iets gebeurt. Dit geeft vertrouwen en zorgt voor een prettiger gebruikservaring. Google kijkt bovendien naar Core Web Vitals, waar FCP een onderdeel van is. Websites die hier goed op scoren, maken meer kans om hoger in de zoekresultaten te komen.

Hoe kun je FCP meten?

Je kunt de First Contentful Paint meten met verschillende gratis tools van Google. In PageSpeed Insights vul je een URL in en zie je direct hoe jouw website scoort op FCP en andere Core Web Vitals. Ook Lighthouse in Chrome DevTools geeft inzicht in FCP tijdens het testen van een pagina. In Google Search Console vind je daarnaast rapporten die gegevens tonen uit het Chrome User Experience Report. Zo kun je zowel laboratoriumdata als velddata bekijken: de eerste geeft een technisch beeld, de tweede laat zien hoe echte gebruikers je website ervaren.