Web

Core Web Vitals in Web-Entwicklung: Checkliste, typische Fehler, Best Practices

CWV pragmatisch verbessern: LCP, INP, CLS – Maßnahmenliste.

Core Web Vitals: Was sie bedeuten – und wie man sie verbessert, ohne ins Unrealistische abzudriften

LCP, INP, CLS – drei Abkürzungen, die im Search Ranking eine Rolle spielen. Und die viele falsch interpretieren.

Was Core Web Vitals wirklich messen

LCP (Largest Contentful Paint): Wann erscheint das größte sichtbare Element im Viewport? Messbar und direkt beeinflussbar – oft ist das ein Hero-Bild oder ein großer Text-Block.

INP (Interaction to Next Paint): Wie schnell reagiert die Seite auf Nutzerinteraktionen? Das ist der neueste der drei – und der schwierigste zu optimieren, weil er von JavaScript-Ausführungszeiten abhängt.

CLS (Cumulative Layout Shift): Springt der Inhalt beim Laden? Das passiert, wenn Bilder ohne definierte Größe eingebunden werden oder Fonts nachgeladen werden und den Text verschieben.

Wie man den aktuellen Stand misst

Google Search Console hat einen eigenen CWV-Bericht. PageSpeed Insights zeigt sowohl Lab- als auch Field-Daten. Chrome DevTools Performance-Tab für tiefere Analyse.

Wichtig: Lab-Daten (simuliert) und Field-Daten (echte Nutzer) können stark abweichen. Field-Daten sind relevanter – aber nur vorhanden, wenn genug Traffic auf der Seite ist.

Quick Wins nach Priorität

Für LCP: Bild-Optimierung (WebP/AVIF, richtige Größen), fetchpriority="high" für das Hero-Bild, kein lazy loading für above-the-fold Bilder, Server-Response-Time reduzieren.

Für INP: Lange Tasks im JavaScript identifizieren (Chrome Performance Profiler), Code Splitting, Drittanbieter-Scripts asynchron laden.

Für CLS: Alle Bilder mit width und height Attributen. Fonts mit font-display: swap oder besser optional. Reserve-Space für dynamisch eingefügten Content.

Wann ist "gut genug" gut genug?

CWV sind ein Ranking-Faktor – aber kein überdominanter. Wer im grünen Bereich ist (LCP < 2,5s, INP < 200ms, CLS < 0,1), sollte andere SEO-Faktoren nicht vernachlässigen.

Checkliste Core Web Vitals

Aktuelle Werte mit PageSpeed Insights und Search Console gemessen
LCP-Element identifiziert und Ladezeit optimiert
Alle Bilder mit definierten Dimensionen
Lange JavaScript-Tasks identifiziert und reduziert
Font-Loading-Strategie überprüft
CWV-Monitoring-Alert eingerichtet

CWV unter "needs improvement" oder "poor"?

markom.digital macht Performance-Audits für Websites und setzt die Maßnahmen direkt um.

Weitere Beiträge