Core Web Vitals und PageSpeed: Ratgeber und Anleitungen

Hier finden Sie alle Anleitungen zu Core Web Vitals und Website-Performance an einem Ort: was die drei Kennzahlen bedeuten, wie Sie die häufigsten PageSpeed-Warnungen beheben und wie Ihre Plattform im Vergleich abschneidet. Jede Seite erklärt ein Thema in klarer Sprache, mit konkreten Schritten und Codebeispielen.

Der Einstieg ist die Übersicht zu den Core Web Vitals, von dort führen die Wege zu den einzelnen Metriken und zu den konkreten Optimierungen.

Core Web Vitals verstehen

Core Web Vitals — was die drei Kennzahlen sind, welche Werte gut sind und wie Google sie bewertet.
Core Web Vitals Benchmark — wie WordPress, Wix, Shopify und andere Plattformen bei den Core Web Vitals abschneiden.

Die einzelnen Metriken

Largest Contentful Paint (LCP) — wie schnell der Hauptinhalt erscheint.
Interaction to Next Paint (INP) — wie schnell die Seite auf Eingaben reagiert.
Cumulative Layout Shift (CLS) — wie stabil das Layout beim Laden bleibt.
First Contentful Paint (FCP) — wann der erste Inhalt sichtbar wird.

JavaScript und CSS optimieren

Nicht verwendetes JavaScript reduzieren — ungenutztes Skript per Code-Splitting und Tree-Shaking entfernen.
Nicht verwendetes CSS reduzieren — ungenutzte Stylesheet-Regeln beim Build strippen.
Renderblockierende Ressourcen beseitigen — den kritischen Pfad für den ersten Seitenaufbau freimachen.

Bilder optimieren

Bilder richtig dimensionieren — Bilder in der Größe ausliefern, in der sie angezeigt werden.
Bilder in modernen Formaten bereitstellen — mit WebP und AVIF deutlich kleinere Dateien.
Bilder verzögert laden — Bilder außerhalb des sichtbaren Bereichs per Lazy Loading zurückstellen.

Server und Caching

Serverantwortzeit reduzieren (TTFB) — die Zeit bis zum ersten Byte mit Caching und CDN senken.
Browser-Caching aktivieren — statische Assets mit einer effizienten Cache-Richtlinie lange cachen.

Eigene Seite testen