LCP (Largest Contentful Paint)

LCP (Largest Contentful Paint) misst, wie lange es nach dem Aufruf einer Seite dauert, bis das größte sichtbare Element im ersten Bildschirmbereich angezeigt wird – meist ein Titelbild oder eine große Überschrift. Google bewertet einen LCP von höchstens 2,5 Sekunden als gut, über 4 Sekunden als schlecht.

Was als LCP-Element zählt

Der Browser beobachtet beim Laden, welches Element gerade das größte im sichtbaren Bereich ist. In Frage kommen:

• Bilder, auch Bilder innerhalb einer SVG-Grafik
• das Vorschaubild oder erste Bild eines Videos
• Hintergrundbilder, die per CSS geladen werden
• Textblöcke wie Absätze oder Überschriften

Sobald jemand tippt, scrollt oder eine Taste drückt, endet die Messung. Bewertet wird wie bei allen Core Web Vitals das 75. Perzentil der Seitenaufrufe, getrennt nach Handy und Desktop. Welches Element auf deiner Seite das LCP-Element ist, zeigt dir PageSpeed Insights in der Diagnose des Labortests.

Woraus sich der LCP zusammensetzt

Google zerlegt den LCP in vier Abschnitte. So findest du heraus, wo die Zeit verloren geht:

1. Serverantwort (Time to First Byte): bis das erste Byte der Seite beim Browser ankommt.
2. Ladeverzögerung: bis der Browser überhaupt beginnt, das Bild zu laden.
3. Ladedauer: wie lange das Bild selbst zum Herunterladen braucht.
4. Renderverzögerung: bis das geladene Element tatsächlich am Bildschirm erscheint.

Laut Google sollte der Großteil der Zeit auf das Laden der Seite und des Bildes entfallen. Die beiden Verzögerungen sollten möglichst klein sein – dort steckt oft das größte Potenzial.

Typische Ursachen und Hebel

• Langsamer Server: Ein Page-Cache durch Caching und gutes Hosting verkürzen die Serverantwort.
• Zu große Bilder: Fotos direkt vom Handy haben oft mehrere Megabyte. Auf die tatsächliche Anzeigegröße verkleinern und in WebP oder AVIF umwandeln.
• Lazy Loading am Titelbild: Verzögertes Laden ist für Bilder weiter unten gedacht, nicht für das wichtigste Bild oben. WordPress versieht seit Version 6.3 das vermutliche LCP-Bild automatisch mit fetchpriority=“high“, damit der Browser es vorzieht.
• Hintergrundbilder aus dem Page Builder: Per CSS eingebundene Bilder entdeckt der Browser erst spät. Für den wichtigsten Bereich ist ein normales Bild-Element oft die bessere Wahl.
• Blockierendes CSS und JavaScript im Kopf der Seite verzögern die Anzeige, auch wenn das Bild längst geladen ist.

Ein Beispiel aus der Praxis

Angenommen, ein Friseursalon in Linz zeigt oben auf der Startseite einen Slider mit drei Fotos, unbearbeitet aus der Kamera hochgeladen. Am Handy erscheint das erste Bild erst nach mehreren Sekunden. Naheliegende erste Schritte: ein einzelnes, passend verkleinertes Titelbild ohne Lazy Loading und ein aktiver Page-Cache.

Im Labortest siehst du die Wirkung sofort. In den Felddaten echter Besuche dauert es länger, weil dort die letzten 28 Tage zählen.

Abgrenzung: LCP ist nicht die ganze Ladezeit

Der LCP sagt nicht, wann eine Seite vollständig geladen ist. Im Hintergrund können danach noch Skripte, Karten oder Bilder weiter unten nachkommen. Ebenso unterscheidet er sich vom First Contentful Paint (FCP), der misst, wann überhaupt der erste Text oder das erste Bild erscheint. Der LCP beantwortet die Frage, die für Besucher:innen zählt: Wann sehe ich das, weswegen ich gekommen bin?

Was regelmäßig an Bildern, Plugins und Server zu tun ist, beschreibt der Artikel WordPress-Wartung & Sicherheit. Wenn du den LCP deiner Website nicht selbst angehen willst, hilft dir BigWebsites.