Definition: Largest Contentful Paint (LCP)
Was bedeutet: Largest Contentful Paint (LCP)
Der Largest Contentful Paint (LCP) misst die Zeitspanne vom Beginn des Ladevorgangs bis zu dem Moment, an dem das größte sichtbare Element (meist ein Bild, Video oder eine große Textblock-Überschrift) im Sichtfeld des Nutzers vollständig gerendert ist.
Die Definition des LCP konzentriert sich auf die Nutzererfahrung. Frühere Metriken haben oft nur gemessen, wann der Server geantwortet hat, aber nicht, wann der Nutzer tatsächlich etwas Sinnvolles auf dem Bildschirm gesehen hat. Der LCP schließt diese Lücke.
In den meisten Fällen ist das LCP-Element das Hero-Bild auf der Startseite oder die Hauptüberschrift. Da dies das erste ist, was ein potenzieller Kunde sieht, nutzt Google diesen Wert als Hauptindikator für die Ladeleistung. Ein schlechter LCP-Wert führt oft dazu, dass Nutzer die Seite verlassen, bevor sie überhaupt wissen, was du anbietest.
FAQ - Häufig gestellten Fragen zum Begriff: Largest Contentful Paint (LCP)
Was ist ein guter LCP-Wert? Google definiert drei Kategorien für den LCP:
Gut: Unter 2,5 Sekunden. Verbesserungswürdig: Zwischen 2,5 und 4 Sekunden. Schlecht: Über 4 Sekunden.
Was sind die häufigsten Ursachen für einen schlechten LCP?
Langsame Server-Antwortzeiten (TTFB). Ressourcenblockierendes JavaScript und CSS. Zu große, nicht optimierte Bilddateien im Hero-Bereich. Client-seitiges Rendering, bei dem der Browser erst viel Code ausführen muss, bevor er Text anzeigt.
Wie hilft der Bricks Builder beim LCP?
Bricks ist darauf ausgelegt, so wenig CSS wie möglich zu laden. Zudem erlaubt es dir, kritische Bilder gezielt zu optimieren (z. B. durch das Deaktivieren von Lazy Loading für das allererste Bild, damit es sofort geladen wird – ein häufiger Profi-Fehler).
Warum verbessert „Lazy Loading“ den LCP manchmal nicht?
Das ist ein wichtiger Punkt für dein Archiv: Bilder, die sofort im Sichtfeld (Above the Fold) sind, sollten niemals per Lazy Loading geladen werden. Das verzögert den LCP, da der Browser erst wartet, bis das Skript bereit ist. Diese Bilder sollten mit dem Attribut fetchpriority=”high” markiert werden.