· Julian Laibach · 5 Min. Lesezeit
Core Web Vitals verstehen: LCP, INP und CLS einfach erklärt
Was LCP, INP und CLS bedeuten, welche Grenzwerte gelten, wie Sie die Core Web Vitals messen und welche Ursachen hinter schlechten Werten stecken.
Eine Website kann gut aussehen und trotzdem Besucher verlieren – weil sie zu langsam lädt, beim Klicken hakt oder Inhalte plötzlich verrutschen. Genau das misst Google mit den Core Web Vitals. Sie fließen als einer von vielen Faktoren in die Bewertung von Seiten ein. Vor allem aber zeigen sie, wie sich Ihre Website für echte Nutzer anfühlt. Hier erklären wir die drei Kennzahlen, wie Sie sie messen und was hinter schlechten Werten steckt.
Die drei Kennzahlen im Überblick
Die Core Web Vitals bestehen aktuell aus drei Messwerten. Jeder beantwortet eine einfache Frage aus Sicht des Besuchers.
| Kennzahl | Frage | Gut | Verbesserungswürdig | Schlecht |
|---|---|---|---|---|
| LCP – Largest Contentful Paint | Wie schnell ist der Hauptinhalt sichtbar? | ≤ 2,5 s | bis 4 s | über 4 s |
| INP – Interaction to Next Paint | Wie schnell reagiert die Seite auf Eingaben? | ≤ 200 ms | bis 500 ms | über 500 ms |
| CLS – Cumulative Layout Shift | Wie stabil bleibt das Layout beim Laden? | ≤ 0,1 | bis 0,25 | über 0,25 |
Google bewertet eine Seite als „gut“, wenn mindestens 75 % der Seitenaufrufe die Grenzwerte einhalten. Gemessen wird also ein realistischer Fall – inklusive älterer Smartphones und langsamer Mobilfunkverbindungen.
LCP: Wann ist der Hauptinhalt da?
Der Largest Contentful Paint misst, wann das größte sichtbare Element im ersten Bildschirmbereich fertig dargestellt ist. Meist ist das ein Titelbild, ein Video-Vorschaubild oder eine große Überschrift. Ziel sind höchstens 2,5 Sekunden.
Typische Ursachen für einen schlechten LCP:
- Zu große Bilder: ein Titelbild mit mehreren Megabyte, das für Smartphones nicht verkleinert wird.
- Langsamer Server: Dauert schon die erste Antwort lange, kann der Rest nicht schnell sein.
- Blockierende Skripte und Stylesheets: Der Browser wartet auf Dateien, bevor er etwas anzeigt.
- Spät geladene Bilder: Das wichtigste Bild wird per „Lazy Loading“ nachgeladen, obwohl es sofort sichtbar ist.
Abhilfe schaffen WebP-Bilder in passenden Größen, schnelles Performance-Hosting, serverseitig gerenderte Seiten und das gezielte Vorladen des Hauptbildes. Mehr dazu unter Bildoptimierung.
INP: Wie schnell reagiert die Seite?
Seit März 2024 ersetzt Interaction to Next Paint den früheren Messwert First Input Delay (FID). FID hat nur die Verzögerung der allerersten Eingabe gemessen. INP betrachtet alle Klicks, Tipps und Tastatureingaben während des Besuchs – und wie lange es dauert, bis die Seite sichtbar reagiert. Ziel sind höchstens 200 Millisekunden.
Ein schlechter INP fühlt sich so an: Man tippt auf einen Button, nichts passiert, also tippt man noch einmal. Die Ursache ist fast immer zu viel JavaScript:
- schwere Page-Builder und Themes mit großen Skriptpaketen auf jeder Seite,
- Tracking- und Marketing-Skripte, die den Browser beschäftigen,
- Chat-Widgets, Slider und Pop-ups mit viel Rechenzeit beim Laden,
- aufwendige Cookie-Banner, die selbst zum Bremsklotz werden.
Am wirksamsten ist, weniger JavaScript auszuliefern: nicht benötigte Skripte entfernen, Drittanbieter kritisch prüfen und Funktionen erst laden, wenn sie gebraucht werden.
CLS: Bleibt das Layout stabil?
Der Cumulative Layout Shift misst, wie stark Inhalte während des Ladens verrutschen. Sie kennen das: Sie wollen auf einen Link tippen, und im letzten Moment schiebt sich ein Banner davor. Ziel ist ein Wert von höchstens 0,1.
- Bilder ohne feste Abmessungen: Breite und Höhe angeben, damit der Browser den Platz vorab reserviert.
- Nachgeladene Werbung, Banner oder Hinweise: festen Platz einplanen oder unterhalb des sichtbaren Bereichs einblenden.
- Webfonts, die das Layout verschieben: Schriften lokal ausliefern und passend vorladen.
So messen Sie die Core Web Vitals
Es gibt zwei Arten von Messdaten: Felddaten stammen von echten Besuchern, Labordaten aus einer simulierten Messung. Für die Bewertung durch Google zählen die Felddaten.
- PageSpeed Insights: zeigt oben die Felddaten echter Nutzer (sofern genügend vorhanden) und darunter eine Labormessung mit Verbesserungsvorschlägen.
- Google Search Console: Der Bericht „Core Web Vitals“ zeigt, welche Seitengruppen gut, verbesserungswürdig oder schlecht abschneiden – getrennt nach Mobilgeräten und Desktop.
- Chrome UX Report (CrUX): die Datenbasis hinter den Felddaten, gebildet aus anonymisierten Messungen von Chrome-Nutzern über 28 Tage.
- Browser-Entwicklertools: für die Fehlersuche im Detail, etwa welches Skript eine Interaktion ausbremst.
Achten Sie vor allem auf die mobilen Werte. Smartphones haben weniger Rechenleistung und oft eine schwankende Verbindung, die Werte fallen dort fast immer schlechter aus. Da ein großer Teil der Besucher mobil unterwegs ist und Google die mobile Version bevorzugt betrachtet, setzen wir mit der Optimierung dort an.
Felddaten reagieren zeitverzögert. Nach einer Optimierung dauert es bis zu vier Wochen, bis sich die Verbesserung vollständig in Search Console und PageSpeed Insights zeigt.
Wenig Besucher? Labordaten richtig lesen
Kleinere Websites haben oft zu wenige Besucher, um in den Felddaten aufzutauchen. Dann bleiben nur Labormessungen – nützlich, aber mit Vorsicht zu lesen. Eine Messung mit simuliertem Mittelklasse-Smartphone schwankt von Lauf zu Lauf. Messen Sie deshalb mehrmals, vergleichen Sie Tendenzen statt einzelner Punktzahlen und konzentrieren Sie sich auf die konkreten Hinweise: zu große Bilder, blockierende Dateien, ungenutztes JavaScript.
Wie wir die Werte im Blick behalten
Gute Werte sind keine einmalige Leistung. Ein neues Tracking-Skript, ein großes Titelbild oder ein zusätzliches Widget kann sie über Nacht verschlechtern. Deshalb gehört Messen bei uns zum laufenden Betrieb: Im Business-Paket überwachen wir die Ladezeit, im Performance-Paket zusätzlich die Core Web Vitals.
Das medienakzent CMS liefert serverseitig gerenderte Seiten mit wenig JavaScript aus und erzeugt automatisch WebP-Bilder in passenden Größen. Das ist eine gute Grundlage, bevor überhaupt optimiert wird.
Fazit
Die Core Web Vitals übersetzen Nutzererfahrung in drei Zahlen: LCP für die Ladezeit des Hauptinhalts, INP für die Reaktionsfähigkeit, CLS für ein stabiles Layout. Die meisten Probleme haben wenige Ursachen – zu große Bilder, zu viel JavaScript, fehlende Platzhalter. Liegen Ihre Werte im gelben oder roten Bereich, nutzen Sie unseren kostenlosen Website-Check. Wie wir bei der Optimierung vorgehen, lesen Sie auf unserer Seite zu den Core Web Vitals.