Largest Contentful Paint (LCP) ist eine Google-Metrik aus den Core Web Vitals und misst die Zeit, bis das größte sichtbare Inhaltselement im Viewport – meist ein Bild oder ein Textblock – vollständig gerendert ist. Als gut gilt laut Google ein Wert bis 2,5 Sekunden.
LCP misst, wie lange Besucher warten müssen, bis das Wichtigste auf dem Bildschirm zu sehen ist – etwa das große Produktbild. Vergleichbar mit einem Restaurant: Entscheidend ist nicht, wann die Küche anfängt zu kochen, sondern wann das Hauptgericht auf dem Tisch steht.
Wozu brauche ich den LCP-Wert?
Klassische Messwerte wie die reine Ladezeit sagen wenig darüber aus, wie schnell sich eine Seite für Besucher anfühlt. LCP setzt genau dort an: Die Metrik misst den Moment, in dem das größte Inhaltselement im sichtbaren Bereich fertig gerendert ist – typischerweise das Hero-Bild, ein Produktfoto oder die Hauptüberschrift. Laut Google gilt ein LCP bis 2,5 Sekunden als gut, Werte über 4 Sekunden als schlecht; bewertet wird das 75. Perzentil echter Nutzerdaten. Als Teil der Core Web Vitals fließt LCP in die Page-Experience-Bewertung von Google ein.
Praxis-Relevanz für Shop- und Website-Betreiber
In Online-Shops ist das LCP-Element auf Produkt- und Kategorieseiten in der Regel das große Produkt- oder Bühnenbild – also genau der Inhalt, auf den Kaufinteressenten warten. Ein langsamer LCP bedeutet: Besucher starren auf eine leere Fläche und springen erfahrungsgemäß eher ab, bevor sie das Angebot überhaupt gesehen haben. Besonders kritisch ist das im mobilen Netz, wo große Bilder und langsame Server sich addieren. Eine gezielte PageSpeed-Optimierung beginnt deshalb meist mit der Analyse des LCP-Elements der wichtigsten Seitentypen. Hilfreich ist dabei der Blick auf die vier Phasen des LCP: Serverantwortzeit, Ladeverzögerung der Ressource, Ladedauer der Ressource und Render-Verzögerung – so wird sichtbar, ob das Problem beim Server, beim Bild selbst oder beim Rendern liegt.
Typische Fehler
- Das Hero- oder Produktbild per Lazy Loading nachladen – das LCP-Element muss sofort geladen werden, nicht zuletzt
- Unkomprimierte Bilder ohne moderne Formate wie WebP oder AVIF ausliefern
- Langsame Serverantwort (hohe Time to First Byte) durch fehlendes Caching oder unterdimensioniertes Hosting
- Render-blockierendes CSS und JavaScript, das den Aufbau des Hauptinhalts verzögert
- Webfonts, die das Rendern großer Überschriften blockieren, statt mit
font-display: swapzu arbeiten
Worauf Sie achten sollten
Identifizieren Sie zuerst mit PageSpeed Insights, welches Element auf Ihren wichtigsten Seiten das LCP-Element ist – die Optimierung unterscheidet sich je nachdem, ob es ein Bild oder ein Textblock ist. Bewährte Hebel sind das Vorladen des Hero-Bildes (rel="preload" bzw. fetchpriority="high"), moderne Bildformate und passende Bildgrößen pro Endgerät – mehr dazu in unserem Beitrag zu Bild-SEO mit WebP und AVIF. Auf Serverseite verkürzen Caching, HTTP/2 oder HTTP/3 und ein leistungsfähiges Hosting die Zeit bis zum ersten Byte. Messen Sie nach jeder Änderung erneut, denn einzelne Maßnahmen wirken je nach Seitentyp unterschiedlich stark.
Je nach Bildschirmgröße kann ein anderes Element das größte sein – mobil etwa die Überschrift, am Desktop das Bühnenbild. Prüfen Sie den LCP-Wert daher immer für Mobil- und Desktop-Ansicht getrennt.