Core Web Vitals: LCP, INP und CLS verstehen und verbessern

Core Web Vitals messen, wie Nutzer eine Seite tatsächlich erleben — nicht wie schnell der Server antwortet. Seit 2021 fließen sie direkt in Googles Ranking ein. Wer sie versteht, optimiert nicht für eine Metrik, sondern für echte Nutzererfahrung.

Was sind Core Web Vitals?

Core Web Vitals sind drei Metriken, mit denen Google die wahrgenommene Ladegeschwindigkeit, Interaktivität und visuelle Stabilität einer Webseite misst. Sie sind Teil des Page Experience Signals — einem Bündel von Faktoren, das Google seit 2021 als Ranking-Signal verwendet.

Die drei Metriken messen jeweils einen anderen Aspekt der Nutzererfahrung:

• LCP (Largest Contentful Paint): Wie schnell lädt das größte sichtbare Element?
• INP (Interaction to Next Paint): Wie schnell reagiert die Seite auf Nutzereingaben?
• CLS (Cumulative Layout Shift): Wie stabil ist das Layout während des Ladens?

Google erhebt diese Werte aus echten Nutzerdaten — dem Chrome User Experience Report (CrUX). Das bedeutet: Die Werte spiegeln das, was echte Besucher Deiner Seite erleben, nicht das Ergebnis eines Labortests.

LCP — Largest Contentful Paint

Was LCP misst

LCP misst, wie lange es dauert, bis das größte sichtbare Element im Viewport geladen ist — typischerweise ein Heroimage, ein großes Textblock oder ein Video-Poster. Es ist die Core-Web-Vitals-Metrik, die am stärksten mit der wahrgenommenen Ladegeschwindigkeit korreliert: Menschen beurteilen eine Seite als „geladen", wenn der Hauptinhalt sichtbar ist.

Zielwerte

• Gut: unter 2,5 Sekunden
• Verbesserungsbedarf: 2,5–4,0 Sekunden
• Schlecht: über 4,0 Sekunden

Häufige Ursachen für schlechten LCP

• Nicht vorgeladene Hero-Images: Das Hauptbild wird zu spät im Lade-Prozess entdeckt. Lösung: <link rel="preload"> für das Hero-Image.
• Langsamer Server (TTFB): Wenn der Server selbst langsam antwortet, leidet LCP direkt. CDN und Server-Caching helfen.
• Render-blockierende Ressourcen: JavaScript oder CSS, das den Browser am Rendern hindert. Kritisches CSS inline laden, nicht-kritisches JavaScript defer setzen.
• Unkomprimierte oder falsch formatierte Bilder: Große PNGs statt WebP/AVIF. Bilder in passender Größe ausliefern.

INP — Interaction to Next Paint

Was INP misst

INP misst die Reaktionsgeschwindigkeit einer Seite auf Nutzereingaben — Klicks, Tastatureingaben, Berührungen. Konkret: die Zeit zwischen einer Eingabe und dem nächsten visuellen Feedback der Seite. INP löste 2024 die alte FID-Metrik (First Input Delay) ab — mit einem wichtigen Unterschied: FID maß nur die erste Interaktion, INP misst alle Interaktionen während des Seitenbesuchs und gibt den schlechtesten Wert aus.

Zielwerte

• Gut: unter 200 Millisekunden
• Verbesserungsbedarf: 200–500 Millisekunden
• Schlecht: über 500 Millisekunden

Häufige Ursachen für schlechten INP

• Langer Main Thread: JavaScript-Tasks blockieren den Browser. Große Skripte aufteilen, lang laufende Tasks in kleinere Chunks zerlegen.
• Übermäßige DOM-Größe: Ein sehr großes DOM verlangsamt Render-Updates. Unnötige DOM-Elemente entfernen, virtualisierte Listen für lange Inhalte verwenden.
• Drittanbieter-Skripte: Analytics, Chat-Widgets, Ad-Skripte können den Main Thread blockieren. Mit async oder defer laden.
• React/Framework-Overhead: Häufige Re-Renders in SPA-Frameworks. Komponenten memoisieren, State-Updates bündeln.

CLS — Cumulative Layout Shift

Was CLS misst

CLS misst, wie stark sich Elemente auf der Seite während des Ladens unerwartet verschieben. Jeder unerwartete Layout-Shift — ein Button springt plötzlich nach unten, weil ein Bild darüber nachgeladen wurde — erzeugt einen CLS-Wert. Der Cumulative Layout Shift summiert alle solche Verschiebungen während des gesamten Seitenbesuchs auf.

CLS ist besonders ärgerlich für Nutzer: Man will auf einen Button klicken, der springt weg, und man klickt auf etwas anderes. Das frustriert — und signalisiert Google mangelnde Sorgfalt bei der Umsetzung.

Zielwerte

• Gut: unter 0,1
• Verbesserungsbedarf: 0,1–0,25
• Schlecht: über 0,25

Häufige Ursachen für schlechten CLS

• Bilder ohne Dimensionsangaben: Wenn der Browser die Bildgröße nicht vorab kennt, reserviert er keinen Platz. Immer width und height im <img>-Tag angeben oder aspect-ratio in CSS setzen.
• Ads und Embeds ohne reservierten Platz: Banner, die erst nach dem initialen Render erscheinen und andere Inhalte verschieben.
• Dynamisch injizierter Inhalt: Inhalte, die via JavaScript nachgeladen werden und andere Elemente verdrängen.
• Web Fonts mit FOUT/FOIT: Wenn Schriftarten spät laden und Text-Reflow verursachen. font-display: optional oder font-display: swap mit passender Fallback-Schrift hilft.

Wie man Core Web Vitals misst

PageSpeed Insights

PageSpeed Insights ist das einfachste Tool: URL eingeben, Ergebnis mit Field Data (echte Nutzerdaten aus CrUX) und Lab Data (Lighthouse-Simulation) erhalten. Kostenlos, ohne Anmeldung.

Google Search Console

Die Google Search Console zeigt Core Web Vitals für die gesamte Domain aggregiert — aufgeteilt nach „Gut", „Verbesserungsbedarf" und „Schlecht" für mobile und Desktop-URLs. Der Vorteil: Sofortiger Überblick, welche URL-Gruppen Probleme haben.

Chrome DevTools / Lighthouse

Für die detaillierte Diagnose ist Lighthouse in den Chrome DevTools das wichtigste Werkzeug. Es zeigt nicht nur die Metrikwerte, sondern konkrete Optimierungsempfehlungen mit geschätzter Verbesserung. Wichtig: Lighthouse liefert Lab Data — die Werte können von Field Data abweichen.

Wie Core Web Vitals Rankings beeinflussen

Core Web Vitals sind ein Ranking-Signal, aber kein dominantes. Google hat bestätigt, dass inhaltliche Relevanz und E-E-A-T stärker gewichtet werden als technische Performance. Eine Seite mit exzellentem Content und schlechten Core Web Vitals rankt in der Regel besser als eine technisch perfekte Seite ohne inhaltliche Relevanz.

Der praktische Effekt: Bei ansonsten gleichwertigen Seiten — gleiche Relevanz, gleiche Autorität — gewinnt die Seite mit besseren Core Web Vitals. In kompetitiven Themenfeldern kann das den Unterschied machen. In weniger wettbewerbsintensiven Nischen ist der Einfluss messbar, aber nicht entscheidend.

Wichtiger als das direkte Ranking-Signal ist oft der indirekte Effekt: Schlechte Core Web Vitals führen zu höheren Absprungraten, kürzeren Verweildauern und weniger Conversions — alles Signale, die Google über seine Nutzerdaten erfasst und in die Qualitätsbewertung einer Seite einfließen lässt.

Häufige Fragen

Über den Autor

Martin Weber

Principal SEO bei morefire

Martin versteht SEO als Teil der Markenführung — weil sich Erfolg in Suchsystemen nicht mehr allein über den Klick definiert, sondern über Wahrnehmung: egal ob in der klassischen Suche oder in LLMs wie ChatGPT und Gemini. Dafür braucht es ein thematisches Verständnis dafür, wofür eine Marke stehen will und wie Systeme das erkennen — und daraus abgeleitet eine Content-Strategie, die über alle Kanäle trägt.

Dieses Wissen teilt Martin — abgeleitet aus Stationen bei SISTRIX, als Inhouse-Consultant bei den Volks- und Raiffeisenbanken und aktuell als Principal SEO bei morefire — in der Beratung von Unternehmen, in Workshops, Webinaren und Artikeln wie diesem.