Analysiere die echte Performance deiner Website mit CrUX-Daten

Domain
URL
Aktuelle Daten
Verlauf (25 Wochen)

Verlauf wird geladen...

Core Web Vitals Was sind die Core Web Vitals?

Die Core Web Vitals sind drei von Google definierte Metriken, die die Nutzererfahrung auf einer Webseite messen. Seit 2021 sind sie ein offizieller Rankingfaktor für SEO.

Um die Bewertung der Core Web Vitals zu bestehen, müssen alle drei Metriken beim 75. Perzentil der Felddaten (echte Nutzerdaten, die Chrome erfasst) den Schwellenwert „gut“ erreichen.

Largest Contentful Paint (LCP)

Ladezeit des größten sichtbaren Elements

Schwellenwerte: ≤ 2.5s gut | > 4s schlecht

Was ist LCP?

Der LCP misst die Zeit, bis das größte sichtbare Inhaltselement im Viewport angezeigt wird. Dazu gehören meist Hero-Bilder, Videos oder große Textblöcke.

So verbesserst du den LCP

  • Bilder optimieren: Nutze moderne Formate (WebP, AVIF), komprimiere sie und lege explizite Abmessungen fest
  • Kritische Ressourcen vorladen: Nutze <link rel="preload"> für LCP-Bilder und Schriftarten
  • Serverantwortzeit verbessern: Nutze ein CDN, optimiere das Backend und speichere Antworten im Cache
  • Blockierendes CSS entfernen: Binde kritisches CSS inline ein und lade den Rest verzögert
  • Layoutverschiebungen vermeiden: Setze bei Bildern immer width und height

Interaction to Next Paint (INP)

Reaktion auf Nutzerinteraktionen

Schwellenwerte: ≤ 200ms gut | > 500ms schlecht

Was ist INP?

Der INP misst die Latenz aller Nutzerinteraktionen (Klicks, Tippen, Tastatureingaben) während des gesamten Besuchs einer Seite. Ein guter INP bedeutet, dass die Seite schnell auf Nutzeraktionen reagiert.

So verbesserst du den INP

  • JavaScript reduzieren: Teile lange JavaScript-Aufgaben (>50 ms) in kleinere Aufgaben auf
  • Nicht kritisches JavaScript aufschieben: Nutze defer oder async für Skripte
  • Aufwendige Berechnungen vermeiden: Nutze Web Workers für aufwendige Operationen
  • Event-Handler optimieren: Nutze Event-Delegation sowie Debounce/Throttle
  • DOM verkleinern: Kleineres DOM = schnellere Rendering-Updates

Cumulative Layout Shift (CLS)

Visuelle Stabilität der Seite

Schwellenwerte: ≤ 0.1 gut | > 0.25 schlecht

Was ist CLS?

Der CLS misst die visuelle Stabilität, indem er unerwartete Layoutverschiebungen quantifiziert. Ein schlechter CLS frustriert Nutzer, die wegen einer plötzlichen Verschiebung auf das falsche Element klicken können.

So verbesserst du den CLS

  • Platz für Bilder/Videos reservieren: Setze immer die Attribute width und height
  • Dynamische Werbeanzeigen vermeiden: Reserviere einen festen Platz für Werbeflächen
  • Schriften vorladen: Nutze font-display: optional oder lade kritische Schriftarten vorab
  • Keine Inhalte über bestehenden Inhalten einfügen: Außer als Reaktion auf eine Nutzerinteraktion
  • Transform-Animationen nutzen: Nutze für Animationen lieber transform statt top/left
Indirekte Faktoren

Die folgenden Metriken sind nicht Teil der Core Web Vitals und beeinflussen die Pass/Fail-Bewertung nicht direkt. Allerdings können sie die eigentliche Ursache für einen schlechten LCP oder INP sein. Wenn du diese Metriken optimierst, können sich deine Core Web Vitals indirekt verbessern.

First Contentful Paint (FCP)

Erste Anzeige von Inhalten

Indirekt
Schwellenwerte: ≤ 1.8s gut | > 3s schlecht

Was ist FCP?

Der FCP misst die Zeit zwischen dem Beginn der Navigation und dem Moment, in dem der Browser das erste Inhaltselement anzeigt (Text, Bild, Canvas). Ein schlechter FCP zeigt, dass der Server oder das initiale Rendering zu langsam ist, was auch den LCP verzögert.

Einfluss auf die Core Web Vitals

Der FCP ist ein Vorläufer des LCP: Wenn der erste Inhalt lange braucht, bis er angezeigt wird, braucht auch das größte Element zwangsläufig länger. Ein besserer FCP verbessert in der Regel auch den LCP.

So verbesserst du den FCP

  • TTFB reduzieren: Ein langsamer Server verzögert alles andere
  • Blockierende Ressourcen entfernen: CSS und JS im <head> blockieren das Rendering
  • Kritisches CSS inline einbinden: Das für die erste Darstellung nötige CSS muss inline sein
  • Vorab mit Drittanbieter-Domains verbinden: <link rel="preconnect"> für CDNs, Schriftarten usw.
  • CSS/JS minimieren: Verringere die Größe der zu ladenden Dateien

Time to First Byte (TTFB)

Server-Antwortzeit

Indirekt
Schwellenwerte: ≤ 800ms gut | > 1.8s schlecht

Was ist TTFB?

Die TTFB misst die Zeit zwischen der HTTP-Anfrage und dem Empfang des ersten Bytes der Antwort. Das ist die Zeit, die dein Server zum „Antworten“ braucht. Eine hohe TTFB verzögert alles andere : FCP, LCP und sogar die Interaktivität.

Einfluss auf die Core Web Vitals

Die TTFB ist die Grundlage aller anderen Metriken. Wenn dein Server langsam antwortet, leiden alle deine Performance-Metriken darunter. Sie ist oft das Erste, was du optimieren solltest.

So verbesserst du den TTFB

  • Ein CDN nutzen: Liefere Inhalte von Servern in der Nähe deiner Nutzer aus
  • Seiten cachen: Server-Cache (Redis, Varnish) oder Anwendungs-Cache
  • Datenbankabfragen optimieren: Indizes, N+1-Abfragen, Paginierung
  • HTTP/2 oder HTTP/3 nutzen: Schnellere Protokolle
  • Weiterleitungen vermeiden: Jede Weiterleitung verursacht einen zusätzlichen Netzwerk-Roundtrip
  • Backend optimieren: Effizienter Servercode, gutes Hosting

In der Praxis

Gib eine URL ein, um CrUX-Daten abzurufen und Mobilgeräte mit Desktop zu vergleichen. Diese Messungen zeigen die Erfahrung von Chrome-Besuchern statt eines einzelnen Labortests. Sie helfen bei Ladezeit, Reaktionsfähigkeit und Stabilität; für Seiten mit wenig Traffic können Daten fehlen.

Geh noch weiter mit einem vollständigen Audit.

Crawl, Search Console, Analytics und Logs mit wenigen Klicks.