Core Web Vitals verstehen und verbessern

Zuletzt aktualisiert: 01.03.2026

LCP, INP, CLS — drei Abkürzungen, die über Ihr Google-Ranking mitentscheiden. Core Web Vitals messen, wie schnell Ihre Website lädt, wie flüssig sie reagiert und wie stabil das Layout ist. Seit 2021 sind sie offizieller Rankingfaktor.

Core Web Vitals sind Googles Metriken für die Nutzererfahrung. Sie messen nicht, ob eine Website inhaltlich gut ist — sondern ob sie sich gut anfühlt. Eine Seite, die drei Sekunden zum Laden braucht, bei Klicks ruckelt oder deren Layout beim Scrollen springt, verliert Nutzer und Rankings.

Die drei Metriken im Überblick

Metrik	Misst	Gut	Verbesserungswürdig	Schlecht
LCP (Largest Contentful Paint)	Ladegeschwindigkeit	≤ 2,5 s	2,5–4,0 s	> 4,0 s
INP (Interaction to Next Paint)	Reaktionszeit	≤ 200 ms	200–500 ms	> 500 ms
CLS (Cumulative Layout Shift)	Layoutstabilität	≤ 0,1	0,1–0,25	> 0,25

Google verwendet dafür Felddaten aus dem Chrome UX Report (CrUX) — echte Messwerte von Chrome-Nutzern, die Ihre Website besuchen. Labordaten (z. B. aus Lighthouse) helfen beim Debuggen, sind aber nicht rankingentscheidend.

LCP: Wie schnell wird der Hauptinhalt sichtbar?

Der Largest Contentful Paint misst, wann das größte sichtbare Element im Viewport gerendert ist — typischerweise ein Hero-Bild, eine Überschrift oder ein Videovorschaubild. Ziel: unter 2,5 Sekunden.

Häufigste Probleme

Unoptimierte Bilder: Große JPEG- oder PNG-Dateien statt moderner Formate.
Langsamer Server (TTFB > 200 ms): Die Zeit bis zum ersten Byte vom Server ist zu lang.
Render-blockierendes CSS/JavaScript: Der Browser wartet auf Ressourcen, bevor er zeichnet.

Lösungen

WebP oder AVIF statt JPEG/PNG — spart 25–50 % Dateigröße bei gleicher Qualität.
LCP-Bild vorladen: <link rel="preload"> für das Hero-Bild. Wichtig: Das LCP-Element niemals mit Lazy Loading versehen — es muss sofort geladen werden.
CDN und Caching: Statische Ressourcen über ein Content Delivery Network ausliefern.
Brotli-Kompression: Effizienter als gzip, spart 15–20 % Übertragungsvolumen.

INP: Wie schnell reagiert die Seite?

Interaction to Next Paint hat im März 2024 den bisherigen FID (First Input Delay) ersetzt. Der entscheidende Unterschied: FID maß nur die Verzögerung bei der allerersten Interaktion. INP misst die Reaktionszeit auf alle Klicks, Taps und Tastatureingaben während der gesamten Sitzung. Ziel: unter 200 Millisekunden.

Häufigste Probleme

Long Tasks: JavaScript-Aufgaben, die den Main Thread länger als 50 ms blockieren.
Schwere Third-Party-Scripts: Analytics, Ads, Chat-Widgets und Social-Media-Einbettungen.
Ineffiziente Event-Handler: Aufwendige Berechnungen bei Klick- oder Scroll-Events.

Lösungen

Code-Splitting: Nur den Code laden, der für die aktuelle Seite benötigt wird.
Third-Party-Audit: Jedes externe Script auf seine Auswirkung prüfen — und nicht benötigte entfernen.
Deferred Loading: Nicht-kritische Scripts mit defer oder async laden.
Web Workers: Rechenintensive Aufgaben vom Main Thread auslagern.

CLS: Wie stabil ist das Layout?

Cumulative Layout Shift misst, wie stark sich Elemente nach dem Laden noch verschieben. Jeder kennt das: Man will einen Button klicken, aber im letzten Moment springt eine Werbeanzeige dazwischen. Ziel: unter 0,1.

Häufigste Probleme

Bilder und Videos ohne Dimensionen: Der Browser kennt die Größe nicht und reserviert keinen Platz.
Webfonts: Beim Laden des Custom-Fonts ändert sich die Textgröße (FOUT — Flash of Unstyled Text).
Dynamisch eingefügte Inhalte: Werbebanner, Cookie-Banner oder Hinweisleisten ohne reservierten Platz.

Lösungen

Breite und Höhe angeben: width- und height-Attribute für alle Bilder und Videos setzen — oder CSS aspect-ratio verwenden.
font-display: swap: Zeigt sofort den Fallback-Font und tauscht ihn aus, wenn der Webfont geladen ist.
Platz reservieren: Für Ads und dynamische Inhalte vorab feste Bereiche im Layout vorsehen (Skeleton Screens).

Wie misst man Core Web Vitals?

Tool	Datentyp	Anwendung
PageSpeed Insights	Feld + Labor	Schnellste Einzelseiten-Analyse — zeigt CrUX-Daten und Lighthouse-Ergebnisse
Google Search Console	Felddaten	Site-weiter Bericht — zeigt Problemseiten nach URL-Gruppen
Chrome DevTools	Labordaten	Performance-Panel für detailliertes Debugging von Long Tasks und LCP
WebPageTest	Labordaten	Detaillierte Wasserfall-Analyse — besonders gut für Third-Party-Scripts
web-vitals JS Library	Felddaten	Eigenes Real User Monitoring in Ihre Analytics integrieren

Tipp: Beginnen Sie mit der Google Search Console — sie zeigt Ihnen sofort, welche Seiten Probleme haben und ob die Werte sich verschlechtern.

Wie stark beeinflussen Core Web Vitals das Ranking?

Core Web Vitals sind seit 2021 ein bestätigter Rankingfaktor. Google behandelt sie als Tiebreaker: Bei gleichwertigen Inhalten gewinnt die besser performende Seite. Relevanz und Inhalt bleiben wichtiger.

Fallstudien zeigen dennoch messbare Effekte:

LCP-Verbesserung von 4,1 auf 2,2 s: 18 % weniger Absprungrate, 28 % mehr organischer Traffic
INP-Optimierung: 12 % höhere Conversion Rate
CLS-Fixes: 9 % weniger Warenkorbabbrüche

Besonders bei Mobile (60–70 % des Traffics) sind gute Core Web Vitals eine technische Grundanforderung.

Checkliste: Core Web Vitals verbessern

Messen: PageSpeed Insights und Search Console prüfen — wo stehen Sie?
LCP optimieren: Hero-Bild in WebP/AVIF, preload, kein Lazy Loading für Above-the-fold-Inhalte.
INP optimieren: Third-Party-Scripts ausmisten, JavaScript mit defer laden, Long Tasks aufbrechen.
CLS optimieren: Bilddimensionen angeben, font-display: swap, Platz für dynamische Inhalte reservieren.
Monitoring einrichten: web-vitals Library oder Search Console regelmäßig prüfen.

Quellen und weiterführende Links

Weiterführende Artikel

Jetzt Ihre Website prüfen