Von den drei Core Web Vitals ist LCP der Wert, der am häufigsten rot ist und am direktesten weh tut. Largest Contentful Paint misst, wann das größte sichtbare Element im ersten Bildschirm fertig geladen ist. Bei den meisten Websites ist dieses Element ein Bild, und bei den meisten Websites ist genau dieses Bild der ganze Grund für einen schlechten Wert.
Was LCP wirklich misst
LCP ist die Zeit vom Klick bis zu dem Moment, in dem der größte Brocken oben auf der Seite steht. Kein Durchschnitt über alle Elemente, sondern der Zeitpunkt des einen größten: meistens das Hero-Bild, manchmal eine große Überschrift, selten ein Videostandbild. Google zieht die Grenze bei 2,5 Sekunden. Darüber gilt der Wert als verbesserungsbedürftig, ab 4 Sekunden als schlecht.
Der wichtigste Reflex zuerst: LCP ist ein Wert für das Telefon, nicht für deinen Schreibtisch. Auf einem Mobilgerät über Mobilfunk lädt dieselbe Seite ein Vielfaches langsamer als auf deinem Rechner im Büro-WLAN. Wer nur am Desktop prüft, sieht das Problem nie.
Feld vor Labor: welche Zahl zählt
Es gibt zwei Arten von LCP-Werten, und sie werden ständig verwechselt. Die Labordaten (Lighthouse, der Test in den Entwicklertools) simulieren einen Ladevorgang unter genormten Bedingungen. Die Felddaten stammen von echten Nutzern mit echten Geräten und Netzen. Google bewertet dein Ranking nach den Felddaten.
Deshalb ist der richtige erste Schritt nicht Lighthouse, sondern der Blick in die Felddaten: in Google PageSpeed Insights oben der Kasten mit den Daten aus dem Chrome-Nutzererlebnisbericht, oder der Bericht „Core Web Vitals" in der Search Console. Ein grüner Laborwert bei rotem Feldwert ist keine Seltenheit und kein Grund zur Beruhigung.
Die fünf Bremsen, in der Reihenfolge, die sich lohnt
Erstens: das Hero-Bild ist zu groß ausgeliefert. Ein 4000 Pixel breites Foto, das auf dem Telefon 380 Pixel breit dargestellt wird, verschwendet Ladezeit für Pixel, die niemand sieht. Ein passend skaliertes Bild im richtigen Format ist der einzelne wirksamste Eingriff. Fast immer.
Zweitens: das wichtigste Bild lädt zu spät. Wenn das Hero-Bild als „lazy load" markiert ist, wartet der Browser bewusst mit dem Laden, obwohl es sofort gebraucht wird. Genau dieses eine Bild gehört nicht verzögert, sondern bevorzugt geladen. Lazy Loading ist für Bilder weiter unten gedacht, nicht für das oberste.
Drittens: der Server antwortet langsam. Bevor überhaupt ein Pixel lädt, muss der Server das erste Byte schicken. Ist diese Zeit schon hoch, hilft kein Bildtrick. Das ist die Baustelle, an der ein Caching-Layer oder ein schnelleres Hosting mehr bringt als jede Optimierung im Frontend.
Viertens: Schriften und Skripte blockieren den Aufbau. Große Schriftpakete und Skripte, die vor dem Rendern geladen werden, halten die Seite auf. Was oben nicht gebraucht wird, muss auch nicht zuerst kommen.
Fünftens: das Layout springt beim Laden. Das gehört genau genommen zu CLS, dem zweiten der Core Web Vitals, wirkt aber gefühlt wie Langsamkeit. Feste Höhen für Bildplätze verhindern das Springen. Der ganze Zusammenhang der drei Werte steht in Core Web Vitals verbessern.
Warum sich das für mehr als die Zahl lohnt
Ein schlechter LCP kostet nicht nur Rankingpunkte, er kostet Besucher, bevor sie deinen Inhalt je sehen. Wer die Seite verlässt, während oben noch nichts steht, zählt als Absprung, der wie Desinteresse aussieht und in Wahrheit Ungeduld ist. Deshalb ist die Ladezeit der erste Verdacht bei jeder hohen Absprungrate, noch vor dem Text. Diesen Zusammenhang und was danach kommt, beschreibt Absprungrate senken.
Häufige Fragen
Was ist ein guter LCP-Wert?
Google bewertet einen LCP bis 2,5 Sekunden als gut, zwischen 2,5 und 4 Sekunden als verbesserungsbedürftig und über 4 Sekunden als schlecht. Maßgeblich ist der Wert aus den Felddaten auf dem Mobilgerät, nicht der Laborwert am Desktop.
Warum ist mein LCP schlecht, obwohl die Seite schnell wirkt?
Weil du sie vermutlich am Desktop im schnellen Netz aufrufst, Google aber die Felddaten echter Mobilnutzer bewertet. Prüf den Wert in PageSpeed Insights im Kasten mit den Felddaten oder im Core-Web-Vitals-Bericht der Search Console, jeweils für Mobil.
Was ist meistens die Ursache für einen hohen LCP?
In den allermeisten Fällen das Hero-Bild ganz oben: zu groß ausgeliefert oder fälschlich als „lazy load" markiert, sodass der Browser sein Laden verzögert. Ein passend skaliertes, bevorzugt geladenes Bild ist der wirksamste einzelne Eingriff.