Was ist Largest Contentful Paint?
Wann ist eine Seite eigentlich „geladen“? Technisch, wenn das letzte Skript durch ist. Für deinen Besucher viel früher: sobald er sieht, weswegen er gekommen ist. Genau diesen Moment versucht Largest Contentful Paint (LCP) zu messen.
LCP ist die Zeit vom Start des Aufrufs bis zu dem Moment, in dem das größte sichtbare Inhaltselement im Bildschirmausschnitt fertig angezeigt ist. Gezählt wird ab dem Klick, also inklusive Weiterleitungen und Verbindungsaufbau. Als Element kommen infrage:
- Bilder, auch Bilder in SVG-Grafiken
- Videos — gezählt wird das Vorschaubild oder das erste Bild
- Hintergrundbilder aus CSS (Farbverläufe zählen nicht)
- Textblöcke, etwa eine große Überschrift oder ein Absatz
Was die ganze Fläche füllt, gilt als Hintergrund und fällt raus, genauso unsichtbare Elemente und Platzhalter-Bilder. Und der Kandidat kann wechseln: Erscheint erst die Überschrift und dann ein größeres Bild, ist das Bild das LCP-Element. Sobald der Besucher scrollt, tippt oder klickt, hört die Messung auf.
Was ist ein guter LCP-Wert?
LCP
Bewertung
bis 2,5 s
gut
2,5 bis 4 s
verbesserungswürdig
über 4 s
schlecht
Der Haken steckt im Kleingedruckten: Bewertet wird das 75. Perzentil aller echten Besuche, getrennt nach Handy und Desktop. Heißt: Mindestens drei von vier Besuchen müssen unter 2,5 Sekunden bleiben. Dein schneller Büro-Rechner mit Glasfaser ist dafür kein Maßstab.
Wie steht das Netz da? Laut Web Almanac 2025 von HTTP Archive (Daten Juli 2025) haben 62 % der erfassten Seiten auf dem Handy einen guten LCP, am Desktop 74 %. Ein Jahr vorher waren es mobil noch 59 %. Es wird besser, aber mehr als jede dritte Seite fällt mobil noch durch.
Die vier Teilphasen: Wo die Zeit wirklich verloren geht
LCP ist kein einzelner Wert, sondern eine Kette aus vier Etappen. Wer nur „das Bild ist zu groß“ denkt, sucht oft an der falschen Stelle.
- Time to First Byte: Bis das erste Byte vom Server ankommt.
- Ladeverzögerung: Bis der Browser überhaupt anfängt, das LCP-Bild zu laden.
- Ladedauer: Wie lange das Bild selbst zum Laden braucht.
- Anzeigeverzögerung: Bis das fertig geladene Element auch auf dem Bildschirm erscheint.
Die Daten von Seiten mit schlechtem LCP zeigen, wo es hakt (Web Almanac 2024, Medianwerte): rund 2,3 Sekunden Serverantwort und 1,3 Sekunden Ladeverzögerung — die eigentliche Ladezeit des Bildes lag nur bei 0,35 Sekunden. Das Bild zu komprimieren hilft also oft weniger als ein schnellerer Server und ein Bild, das der Browser früh findet.
Beispiele aus der Praxis
Zwei Fallstudien, beide von 2021 und von Google selbst veröffentlicht — also mit etwas Abstand lesen, aber sie zeigen die Richtung.
Case A · Telekommunikation
Vodafone Italien, A/B-Test einer Landingpage
31 %
besserer LCP
+8 %
Umsatz
Serverseitiges Rendern, weniger blockierendes JavaScript, kleineres Hero-Bild
Echter A/B-Test: Die optimierte Seite brachte mehr Umsatz als die alte.
Case B · Automobil
Renault, über 10 Mio. Besuche in 33 Ländern
1 s
schnellerer LCP
+13 %
Conversions
Eine Sekunde besserer LCP ging einher mit 14 Prozentpunkten weniger Absprüngen
Statistischer Zusammenhang, kein Test — Ursache und Wirkung sind hier nicht bewiesen.
Häufige Fehler
Fehler 1 · Das Hero-Bild lazy laden
Lazy Loading lädt Bilder erst, wenn sie gebraucht werden. Gut für alles weiter unten, fatal für das Bild ganz oben. Trotzdem tun es rund 17 % der Seiten auf dem Handy (Web Almanac 2025) — oft, weil ein Plugin pauschal jedes Bild erwischt. Googles Ansage dazu ist eindeutig: das LCP-Bild nie lazy laden.
Fehler 2 · Lighthouse-Wert mit echten Daten verwechseln
Lighthouse misst in einer simulierten Umgebung. Für Google zählen die Felddaten echter Chrome-Nutzer aus dem Chrome UX Report. Ein grüner Laborwert und ein roter Wert in der Search Console schließen sich nicht aus.
Fehler 3 · Alles hoch priorisieren
Mit „fetchpriority="high"“ sagst du dem Browser: Dieses Bild zuerst. Bei Google Flights sank der LCP damit von 2,6 auf 1,9 Sekunden. Wer das Attribut an zehn Bilder hängt, priorisiert am Ende gar nichts mehr — eins, höchstens zwei.
Fehler 4 · Das LCP-Bild im CSS verstecken
Ein Hero-Bild als CSS-Hintergrund findet der Browser erst, nachdem er das Stylesheet gelesen hat. Das kostet Ladeverzögerung. Bei 9 % der mobilen Seiten kommt das LCP-Bild so spät ins Spiel (Web Almanac 2024).
So verbesserst du deinen LCP
- Server schneller machen: Caching, gutes Hosting, wenig Weiterleitungen. Bei Seiten mit schlechtem LCP ist das fast immer die größte Baustelle.
- LCP-Bild als normales Bild-Tag ins HTML, nicht per JavaScript oder CSS nachladen.
- Kein Lazy Loading für das erste Bild, dafür „fetchpriority="high"“.
- Bild passend ausliefern: richtige Größe fürs Handy, modernes Format wie WebP oder AVIF.
- Bremsen im Kopf der Seite entfernen: blockierendes CSS und Skripte, Vorab-Verstecker von A/B-Test-Tools.
Häufige Fragen
Ist LCP ein Rankingfaktor?
Ja, als Teil der Core Web Vitals, die Google in seinen Ranking-Systemen nutzt. Eine Gewichtung nennt Google nicht und betont, dass der relevanteste Inhalt auch mit mittelmäßiger Ladezeit vorne landen kann. Ein schneller LCP ist also ein Plus, kein Ersatz für guten Inhalt.
Wie finde ich das LCP-Element meiner Seite?
Am einfachsten in PageSpeed Insights: Unter den Diagnosen steht das „Largest Contentful Paint-Element“ mit Vorschau. In den Chrome DevTools zeigt das Performance-Panel es ebenfalls an, inklusive der vier Teilphasen.
Warum unterscheiden sich Lighthouse und Search Console?
Lighthouse misst einen einzelnen simulierten Aufruf im Labor. Die Search Console zeigt Felddaten echter Besucher über 28 Tage, bewertet am 75. Perzentil. Langsame Handys und Funklöcher stecken nur in den Felddaten.
Soll ich Bilder lazy laden?
Ja — alle, die man erst nach dem Scrollen sieht. Das erste große Bild im sichtbaren Bereich aber nie. Prüf nach jedem neuen Optimierungs-Plugin, ob es das Hero-Bild ausnimmt.
Was ist der Unterschied zwischen LCP und First Contentful Paint?
First Contentful Paint misst, wann irgendein Inhalt erscheint, etwa das Logo. LCP misst, wann der Hauptinhalt da ist. Für den Eindruck „die Seite ist geladen“ ist LCP die bessere Zahl.
