First Contentful Paint (FCP) ist eine Kennzahl, die den Zeitpunkt misst, an dem der primäre Inhalt einer Webseite für die Nutzer sichtbar wird. Sie beschreibt die Zeitspanne vom ersten Laden der URL bis zum Rendering des sichtbaren Inhalts, der ohne Scrollen erkennbar ist (above the fold). Ursprünglich war der FCP eine der sechs zentralen Metriken der Core Web Vitals von Google, wurde jedoch später durch den Largest Contentful Paint (LCP) ersetzt, da der FCP in der Praxis oft inkonsistente Ergebnisse lieferte.
Die Ladezeit einer Website ist besonders wichtig für die Suchmaschinenoptimierung. Der Pagespeed gibt an, wie lange es dauert, bis eine Seite vollständig geladen ist. Dabei zählt die Zeit vom Absenden der Anfrage bis zur vollständigen Auslieferung aller Inhalte.
Laut der Google Search Console wird es kritisch, wenn die Ladezeit drei Sekunden überschreitet. Nutzer neigen dazu, die Seite zu verlassen und nach Alternativen zu suchen, wenn sie zu lange auf das Laden warten müssen. Eine Studie von Google zeigt, dass jeder zweite Besucher abspringt, wenn die Ladezeit mehr als drei Sekunden beträgt. Dies wird als Absprungrate oder Bounce Rate bezeichnet.
Eine Webseite besteht aus vielen unterschiedlichen Elementen, und die Ladezeiten können variieren. Mit der Paint-Timing API können verschiedene Phasen des Ladeprozesses gemessen werden:
Time to First Paint (FP): Dies ist der Zeitpunkt, an dem der Browser ein beliebiges Element anzeigt, auch wenn es nur ein Punkt oder eine Linie ist. In dieser Phase sieht der Nutzer meist noch nichts Nützliches.
Time to First Contentful Paint (FCP): Hier wird der Nutzer mit dem ersten sichtbaren Inhalt konfrontiert, wie z. B. einem Text oder einem Bild.
Time to First Meaningful Paint (FMP): In dieser Phase sieht der Nutzer die wichtigsten Elemente, das sogenannte „Hero-Element“. Diese Elemente sind entscheidend, da sie dem Nutzer zeigen, dass die Seite vollständig geladen ist. Auf YouTube wäre das zum Beispiel das Video, das der Nutzer sehen möchte. Andere Elemente sind in diesem Moment nicht so wichtig.
Time to Interactive (TTI): Zu diesem Zeitpunkt ist die Webseite vollständig geladen und interaktiv. Nutzer können die Seite nutzen und mit ihr interagieren, unabhängig von ihrem subjektiven Empfinden bezüglich der Ladegeschwindigkeit.