Dein ultimativer Guide zu Page Experience-Update und Core Web Vitals!

25 min

Hier findest Du ausführliche Infos zum Page Experience-Update von Google und speziell zu den Core Web Vitals. Wenn Du die Inhalte in Form kurzer Videos, einer praktische Checkliste und als Goodie eine Vorlage für ein passendes Reporting haben möchtest, empfehlen wir Dir unseren kostenlosen Core Web Vitals Crashkurs mit 5 knackigen Teilen. Dieser enthält:

  • Tipps, wie Du herausfindest, ob bei Deiner Seite Handlungsbedarf besteht
  • Eine Checkliste mit möglichen Optimierungsansätzen
  • Hilfestellungen zum Umgang mit der Google Search Console und dem dort enthaltenen Core Web Vitals-Report
  • Eine Vorlage für ein Google Data Studio Reporting, mit dem Du die Metriken immer im Blick behalten kannst

Inhaltsverzeichnis

Google Page-Experience-Update: Was steckt dahinter?
Was sind Core Web Vitals?
Wie misst Google die Core Web Vitals?
Core Web Vitals 1×1 – Diese Bestandteile solltest Du kennen

Haben Core Web Vitals Einfluss auf SEO?
Warum brauchst Du eine Core Web Vitals-SEO-Optimierung?
Fazit – Page Experience-Update und Core Web Vitals
FAQs
Anmeldung zum Core Web Vitals Crashkurs

Immer up to date: Dieser Artikel wird kontinuierlich aktualisiert.

Selten zuvor wurde eine Algorithmus-Veränderung von Google so frühzeitig angekündigt. Doch jetzt rückt es immer näher: Das Page Experience-Update und die damit neu eingeführten Core Web Vitals. Hast Du Deine Website durch Suchmaschinenoptimierungen bereits gut genug vorbereitet, um im Juni 2021 nicht als Verlierer dazustehen? Wir machen mit Dir den Check!

Google Page-Experience-Update: Was steckt dahinter?

Google kündigt es schon eine ganze Weile an: Das Page Experience-Update. Im Juni 2021 wird es eingeführt. Doch was steckt dahinter? Das kommende Update ordnet die Zusammensetzung der Rankingfaktoren neu. Eine Folge davon kann eine komplette Umsortierung der Suchergebnisse sein. Dabei hat Google ein klares Ziel vor Augen: Die Benutzerfreundlichkeit soll verbessert, die Bedienbarkeit vereinfacht und die Sicherheit erhöht werden. Doch das ist noch nicht alles. Ein Schlagwort fällt im Zusammenhang mit dem Page Experience-Update besonders häufig: Performance. Bislang war dieser Faktor nur schwer zu messen. Mithilfe des Page Experience-Updates und den darin enthaltenen Core Web Vitals soll sich dies jedoch ändern.

Wichtiges Update: Google hat verkündet, dass das Ausrollen des Updates noch etwas nach hinten verschoben wird. Deshalb wird das Page Experience Update und die Einführung der Core Web Vitals erst ab Mitte Juni erwartet, statt wie zu Beginn angekündigt im Mai. Daraus folgt außerdem, dass es erst bis ungefähr Ende August komplett live ist.
Der Grund für die Verschiebung: Google möchte Webmastern so noch etwas länger die Chance geben, Feintuning zu betreiben. Nutze also die Schonfrist und melde Dich zu unserem Core Web Vitals-Crashkurs an, um bestens vorbereitet zu sein!

Was bildet der Ranking-Faktor Page Experience ab?

Im Detail: Das Page Experience-Update soll dabei helfen die Website Performance besser abzubilden. Dabei behandelt Google das Problem, dass die Leistung verschiedener Seiten bisher nicht mit den vorhandenen Metriken gemessen werden kann. Performance ist somit (Stand jetzt) nicht eindeutig messbar. Das erschwert die Suchmaschinenoptimierung. Doch das soll sich mit dem Page Experience-Update ändern. Dabei umfasst das Update diese vier bereits vorhandenen Signale:

  • Mobile Friendly
  • HTTPs
  • Safe Browsing
  • No Intrusive Interstitials (keine unterbrechenden oder aufdringlichen Werbebanner, Pop-Ups, etc.)

Doch damit nicht genug. Ursprünglich wurden diese Messwerte noch durch PageSpeed ergänzt. Hier kommen die Core Web Vitals ins Spiel, die den PageSpeed besser greifbar machen. Der Grund dafür: Die Bestandteile der Web Vitals können besser dokumentiert werden und sind einfacher nachzuvollziehen. Die hier festgelegten Kennzahlen sollen somit die Leistung einer Website quantifizierbar machen.

Auf dem Bild siehst Du eine blaue Wabe, die die Summe der Suchsignale des Page Experience Rankingfaktors darstellt. In diesem Faktor fließen verschiedene Aspekte ein: Mobile Friendly, Safe Browsing, HTTPs und no instrusive Interstitials sind dabei bereits vorhandene Metriken. Neu dazu kommen die Core Web Vitals (hier rot gekennzeichnet), welche aus LCP, FID und CLS bestehen und den PageSpeed ersetzen.
Rankingfaktor Page Experience – So setzt er sich zusammen

Noch ist nicht klar, wie die Gewichtung der einzelnen Bestandteile sein wird. Sicher ist jedoch, dass die vier „alten“ Kennzahlen in Kombination mit den Core Web Vitals zu einem neuen Rankingfaktor zusammengefügt werden – der Page Experience. Dieser wird deshalb für kommende Suchmaschinenoptimierungen besonders wichtig.

Was sind Core Web Vitals?

Mithilfe der Core Web Vitals möchte Google einheitliche Qualitätssignale erschaffen. Diese sollen die Nutzererfahrung der User mit einer Website quantifizieren, um so Vergleichbarkeit zu ermöglichen und Optimierungspotenziale zu identifizieren. Google möchte dadurch die Usability von Websites im Netz verbessern. Core Web Vitals sind als Bestandteil der Page Experience zukünftig ein neuer Rankingfaktor. Das heißt im Klartext: Hast Du die Core Web Vitals verstanden und Deine Website auch für die anderen Bereiche der Page Experience optimiert, hast Du auch gute Chancen auf bessere organische Rankings.

Wie misst Google die Core Web Vitals?

Um die Core Web Vitals-Kennzahlen zu nutzen, greift Google auf zwei verschiedene Daten zu:

  1. Labor-Daten (lab data)
  2. Feld-Daten (auch field data oder real user monitoring, RUM, genannt)

Der Unterschied zwischen beiden Datensätzen ist einfach erklärt. Während die Feld-Daten von richtigen Usern und deren Interaktionen mit Webseiten kommen, werden Labor-Daten unter perfekten und gleichbleibenden Umständen erhoben. Sie zeigen, wie potenzielle Besucher Deine Website erleben und wahrnehmen könnten. Das kann wiederum dazu führen, dass, je nach verwendetem Datensatz, unterschiedliche Endergebnisse herauskommen.

Google’s Statement dazu lautet folgendermaßen:

„Field data is coming from real users, whereas lab data comes from a quite strong machine with probably good internet from somewhere around the world. So you might not see the same results.“

Google
DATENGRUNDLAGEVORTEILENACHTEILE
LABOR-DATENErhobene, simulierte Daten von potenziellen Nutzern aus einer kontrollierten Umgebung mit vordefinierten Gegebenheiten (z. B. Gerät des Nutzers und Netzwerkeinstellungen)– Erstellung reproduzierbarer Ergebnisse
– Schaffen einer Debugging-Umgebung
– Bessere Überprüfung von Auswirkungen von Optimierungsmaßnahmen
– Keine Erfassung von Engpässen
– Keine Korrelation mit Geschäfts- oder Seiten-KPIs
– Zielgruppe und deren Verhalten müssen verstanden werden, um Daten richtig zu interpretieren
FELD-DATENErhobene, echte Daten von Erfahrungen realer Nutzer mit realen Websites– Erfassung realer Ist-Zustände inkl. Engpässe
– Korrelation mit Geschäfts- und Seiten-KPIs
– Rankingrelevante Daten
– Eingeschränkte Kennzahlen
– Eingeschränkte Debugging-Funktion
Labor-Daten vs. Feld-Daten in der Übersicht

Der Grund, wieso Google auf unterschiedliche Datensätze zurückgreift ist einfach: Die tatsächliche Leistung kann von Parametern, wie dem Endgerät oder der Netzwerkverbindung des Websitebesuchers, beeinflusst werden. Um die Performance der Seite jedoch möglichst genau beurteilen zu können, werden zusätzlich zu den Felddaten realer Nutzer auch Labordaten herangezogen.

Welche Tools eignen sich für die Analyse der Core Web Vitals?

Für Dich ist aber nicht unbedingt wichtig zu wissen, wie Google die Daten erhebt. Du willst stattdessen sicher wissen, wie Du die Metriken selbst messen kannst. Google hat hierfür bereits 2020 gute Vorarbeit geleistet. Die hauseigenen Tools sind zum Großteil auf das Page Experience-Update vorbereitet. Aus diesem Grund sind Messungen der Core Web Vitals bisher schon über alle beliebten Google-Tools möglich. Folgende Übersicht hilft Dir, das richtige Tool für die passende Metrik zu finden:

Auf dem Bild sind diese Developer-Tools von Google zu sehen:
- PageSpeed Insights
- Chrome UX Report
- Search Console
- Chrome DevTools
- Lighthouse
- Web Vitals Extension

In alle Tools sind die neuen Core Web Vitals-Metriken verfügbar, doch FID kann weder in den Chrome DevTools noch. inLighthouse gemessen werden.
Übersicht der Developer-Tools zur Messung der Core Web Vitals

Auch bei den Tools wird in Labor-Tools und Feld-Tools unterteilt. Lighthouse nutzt beispielsweise Labor-Daten, während der Chrome UX Report auf Feld-Daten aufbaut. PageSpeed Insights wiederum nutzt beides.

Chrome UX Report

Auch, wenn der Chrome User Experience Report kein wirkliches Tool, sondern eher eine Datenquelle ist, ist er für die Core Web Vitals wichtig. Er zeigt Dir, wie die Nutzererfahrungen realer, anonymisierter Chrome-User mit verschiedenen Websites ist. Mittlerweile hat Google hier die Core Web Vitals ebenfalls hinzugefügt, da sie der neue Maßstab zur Bewertung der User Experience sind. Der UX Report nutzt aggregierte Daten, welche Du über folgende Tools einsehen kannst:

  1. PageSpeed Insights
  2. Das öffentliche Google BigQuery-Projekt
  3. CrUX Dashboard im Google Data Studio

PageSpeed Insights

Die Leistungsfähigkeit einer Website konntest Du bisher immer mit PageSpeed Insights testen. Dabei unterscheidet das Tool zwischen Leistungen auf mobilen als auch auf Desktop-Geräten und gibt Dir klare Optimierungsempfehlungen. Für die Core Web Vitals wurde extra ein blaues Fähnchen hinzugefügt. Tool-Nutzern sticht also direkt ins Auge, welche Messwerte hierfür wichtig sind.

Das Bild zeigt einen Screenshot des PageSpeed Insights-Tools. Hier siehst Du mit blau gekennzeichnet alle Core Web Vital-Metriken.
Core Web Vitals (blau gekennzeichnet) im PageSpeed Insights-Tool

Search Console

Über die Google Search Console hast Du Zugriff auf Feld-Daten. Mit ihrer Hilfe kannst Du beispielsweise auf den Core Web Vitals-Report zugreifen. So siehst Du, wie gut Deine Seiten im Hinblick auf Performance dastehen und kannst diejenigen identifizieren, die besonders viel Aufmerksamkeit benötigen.

Das Bild zeigt einen Ausschnitt der Google Search Console. Im Abschnitt Core Web Vitals kannst Du hier einen Bericht abrufen, der Dir den Stand aller Metriken aufzeigt.
Beispiel des Core Web Vitals-Berichts in der Google Search Console

Chrome DevTools

Bei den Chrome DevTools handelt es sich um eine ganze Palette von Webentwickler-Tools. So kannst Du Probleme schneller diagnostizieren. Du möchtest einfach einen Quick-Check machen und sehen, wie Deine Seite performt? Über das DevTool Measure kannst Du das ganz schnell erledigen. Hier bekommst Du auch direkt einen Einblick in die Core Web Vitals, die ebenso wie bei PageSpeed Insights mit einem blauen Fähnchen gekennzeichnet sind.

Im Screenshot des DevTools Measure siehst Du, dass auch hier die Core Web Vitals Metriken eingebunden wurden (blau markiert). Sie werden von Google durch ein blaues Fähnchen gekennzeichnet.
Ein Ausschnitt aus dem DevTool Measure mit den Core Web Vitals (blau gekennzeichnet)

Lighthouse

Lighthouse hilft Dir, die Qualität Deiner Webseiten zu verbessern. Das Tool greift auf Labor-Daten zu und erstellt Audits für Leistung, Zugänglichkeit, progressive Web-Apps, SEO und mehr. So kannst Du Probleme in verschiedenen Bereichen identifizieren und die Benutzererfahrung verbessern. Auch Core Web Vitals sind hier implementiert. Dadurch erhältst Du wichtige Diagnoseinformationen, über die Du Rückschlüsse auf Deine Seite und entsprechenden Optimierungen ziehen kannst. Lighthouse gibt es auch als Chrome Extension.

Web Vitals Extension

Die Chrome Erweiterung „Web Vitals“ kann hier im Chrome Web Store heruntergeladen werden. Sie ermöglicht es Dir, Probleme frühzeitig zu erkennen und bewertet die drei Core Web Vitals-Kennzahlen in Echtzeit.

Hier ist ein Screenshot der Core Web Vitals Chrome Extension zu sehen. Rechts oben im Browser-Fenster zeigt diese Dir die (kritischen) Werte der einzelnen Core Web Vitals-Metriken an.
Die Core Web Vitals Erweiterung zeigt Dir rechts oben in Deinem Browser-Fenster direkt die Werte der Core Web Vitals-Metriken an

Weitere Tools, die Dir Einblicke in die Core Web Vitals-Metriken geben

Natürlich gibt es neben den Google-Tools auch noch weitere Hilfsmittel, mit denen Du Einblicke in die Core Web Vitals-Kennzahlen erhalten kannst.

Sistrix

Sistrix hat im Zuge des Page Experience-Updates eine neue Funktion in das Tool eingefügt. Hierbei kannst Du über den Bereich Struktur auf den Reiter „Core Web Vitals“ zugreifen. Dieser zeigt Dir dann eine Übersicht der verschiedenen Messwerte an. Außerdem zeigt es Dir grafisch einen zeitlichen Verlauf für alle drei Core Web Vitals-Metriken. Entsprechend Deiner Leistung sind die Werte in drei Farben unterteilt. Diese orientieren sich an den vorgegebenen Werten von Google (genaueres dazu findest Du im nächsten Abschnitt).

Auf dem Bild ist ein Screenshot der Funktion "Core Web Vitals" von Sistrix zu finden. Diese findest Du im Reiter unter Struktur und dann der Unterkategorie "Core Web Vitals" (blau markiert). Die Funktion zeigt Dir die einzelnen Metriken übersichtlich an. Zusätzlich erhältst Du zu jeder eine Grafik, die den historischen Verlauf der Metriken anzeigt.
So sieht die Core Web Vitals-Funktion in Sistrix aus, Quelle: Sistrix

Screaming Frog SEO Spider

Auch das Tool Screaming Frog SEO Spider bietet Dir Einblicke in die Core Web Vitals-Metriken.

Blau eingerahmt siehst Du, wie Dir das Tool Screaming Frog SEO-Spider die Core Web Vitals-Metriken ausspielt.
Hier findest Du im Tool Screaming Frog SEO Spider die Core Web Vitals-Metriken

Core Web Vitals 1×1 – Diese Bestandteile solltest Du kennen

Bei genauerer Betrachtung der Core Web Vitals fällt auf, dass sie sich aus drei unterschiedlichen Bestandteilen zusammengesetzt sind:

  1. Largest Contentful Paint (LCP)
  2. First Input Delay (FID)
  3. Cumulative Layout Shift (CLS)

Dass diese Metrik in drei Teile gesplittet ist, hat einen Grund: Zum einen ist es schon länger sehr schwierig zu messen, wann und wie schnell eine Seite vollständig geladen ist bzw. wie diese performt. Das soll sich jetzt durch die Unterteilung in die oben genannten Bereiche vereinfachen. Zum anderen ist es für Webmaster leichter zu erkennen, welcher Teil ihrer Website mehr Aufmerksamkeit benötigt und optimiert werden sollte.

LCP – Largest Contentful Paint (Ladezeit)

Wann ist der Hauptinhalt der Website geladen? Mit dieser Frage befasst sich die Metrik Largest Contentful Paint (LCP). Der Wert gibt an, wie hoch die Renderzeit des größten Bild- oder Textblocks der Website ist.

Der LCP (largest contentful paint)-Score ist in drei Bereiche unterteilt:
1. Gut: 0 bis 2,5 Sekunden Ladezeit
2. Optimierungsbedürftig: 2,5 bis 4 Sekunden Ladezeit
3. Schlecht: 4 Sekunden Ladezeit und mehr

Möchtest Du Deinen Websitebesuchern eine gute Benutzererfahrung bieten, ist ein LCP-Score von unter 2,5 Sekunden perfekt. Das bedeutet, dass Nutzer die Hauptinhalte der Seite innerhalb dieser Zeit sehen können. Google empfiehlt dabei mindestens 75% aller gemessenen LCP-Werte im grünen Bereich zu halten. Erreichst Du dieses Ziel sowohl mobil als auch auf Desktops, hat Deine Seite einen guten LCP-Score.

Was wird in die Analyse des LCPs einbezogen?

Google berücksichtigt Folgendes, um den LCP zu berechnen:

  • <img>
  • <image> innerhalb eines <svg> Elements
  • <video>
  • Komponenten, die Hintergrundbilder über eine URL laden
  • Block-Level-Elemente, die Textknoten oder andere Inline-Textelemente enthalten

Alle oben genannten Bestandteile werden in der Größe einbezogen, in der sie auch dem Nutzer angezeigt werden. Ränder, Rahmen oder ähnliche Konfigurationen über CSS werden außer Acht gelassen.

Was ist der Unterschied zwischen FCP und LCP?

FCP, auch First Contentful Paint, ist der Begriff für das erste Element, das der Nutzer sieht, wenn er eine Website lädt. Anders als bei LCP kann es sich dabei aber um eine Ladeanimation, einen Platzhalter oder etwas für den User völlig Uninteressantes handeln. Die folgenden Beispiele verdeutlichen den Unterschied:

Das Bild zeigt unterschiedliche Screenshots, die die Googlesuche im Aufbau zeigen. Auf dem ersten Bild ist nur die Suchleiste und die dort eingegebene Suche zu sehen. Zu diesem Zeitpunkt ist die Suchanfrage das größte Element der Seite. Im zweiten Bild ist die Suchseite schon etwas mehr geladen. Hier ist der Textblock das größte Element. Im weiteren Verlauf des Ladeprozesses laden auch die Bilder des Suchergebnisses. Da diese für sich gesehen jedoch nicht größer sind, als der Textblock, bleibt dieser der größte Content der Seite. Aus diesem Grund ist der LCP erreicht, sobald der Textblock fertig geladen hat (hier Bild 2 von 5).
FCP vs. LCP – Die Unterschiede in der Ladezeit, Beispiel Website Google
Das Bild zeigt unterschiedliche Screenshots, die die Login-Fläche von Instagram im Aufbau zeigen. Auf dem ersten Bild ist nur das Logo von Instagram zu sehen. Bereits im zweiten Bild lädt der Header, welcher zu diesem Zeitpunkt der größte Inhalt ist. Im weiteren Verlauf lädt neben dem Schriftzug "Instagram" auch das Login-Feld. Der Schriftzug ist dabei das größte Element, weshalb der LCP erreicht ist, sobald dieses geladen ist (hier Bild 3 von 5).
FCP vs. LCP – Die Unterschiede in der Ladezeit, Beispiel Instgram
Das Bild zeigt unterschiedliche Screenshots, die eine Website im Aufbau zeigen. Auf dem ersten Bild ist nur die Suchleiste und die dort eingegebene Suche zu sehen. im weiteren Verlauf baut sich die Überschrift und Textfelder auf. Hier ist die Überschrift das größte Element (grün gekennzeichnet). Nach einiger Zeit baut sich zusätzlich noch einBild auf, welches von da an das größte Element der Seite ist. Somit ist hier der LCP erreicht (Bild 5 von 5).
FCP vs. LCP – Die Unterschiede in der Ladezeit, Beispiel Website

In allen drei Beispielen siehst Du grün eingerahmt den zum jeweiligen Zeitpunkt größten Inhalt. Dieser verändert sich im Verlauf des Ladeprozesses und muss auch nicht zwangsweise immer das Bild einer Seite sein (s. Beispiel 1). Hier erkennst Du, dass alle Einzelbilder kleiner sind, als der Textblock an sich. Somit werden die Bilder diesem untergeordnet.

Der FCP wird also bereits dann gemessen, wenn der User auch nur ein einziges Element auf der Seite sehen kann. Der LCP ist wiederum erst dann erreicht, wenn das größte Element der Seite geladen ist. Der Hintergrund ist folgender: Google geht davon aus, dass das größte Element auch gleichzeitig das ist, das dem Nutzer den größten Mehrwert liefert.

Wie kannst Du den LCP ermitteln?

Diese Tools helfen Dir dabei, den LCP zu analysieren:

  • Chrome DevTools
  • Lighthouse
  • WebPageTest

Feld-Daten für Deine Seite kannst Du über folgende Tools genauer betrachten:

  • PageSpeed Insights
  • Search Console (Core Web Vitals-Report)

FID – First Input Delay (Interaktivität)

Wie lange dauert es, bis ein Nutzer mit der Website interagieren kann bzw. bis die Seite auf die erste Eingabe des Users reagiert? Diese Zeitspanne wird mithilfe von FID, zu Deutsch der „ersten Eingangsverzögerung“, gemessen. Dadurch kannst Du einen Eindruck über die Interaktivität und die Reaktionsfähigkeit Deiner Website erhalten.

Der FID (first input delay)-Score ist in drei Bereiche unterteilt:
1. Gut: 0 bis 100 Millisekunden bis zur Interaktivität
2. Optimierungsbedürftig: 100 bis 300 Millisekunden bis zur Interaktivität
3. Schlecht: 300 Millisekunden und mehr bis zur Interaktivität

Ein guter FID-Score liegt dabei unter 100 Millisekunden. Das heißt: Sowohl mobil als auch am Desktop benötigt die Website nicht mehr als besagte 0,1 Sekunden, um für die erste Eingabe eines Users bereit und reaktionsfähig zu sein. Bis 0,3 Sekunden sieht Google Verbesserungsbedarf. Alles, was jedoch länger dauert, führt zu einer schlechten Nutzererfahrung. Somit sollte alles, was über 100 Millisekunden dauert, optimiert werden.

Wieso geht es bei FID nur um die erste Eingabe?

Der erste Eindruck ist entscheidend – egal ob in der Realität oder im virtuellen Leben. Gibt es hier direkt Verzögerungen, wirkt sich das auf das Nutzererlebnis mit der Seite aus. Zusätzlich nimmt der erste Eindruck dabei einen großen Bestandteil des Gesamteindrucks ein. Somit schließen viele Nutzer daraus unumstößlich auf die Qualität und Zuverlässigkeit der Website.

Ein weiterer wichtiger Punkt ist, dass die größten Interaktivitätsprobleme häufig bereits beim Laden der Seite auftreten. Deshalb ist es wichtig, bereits an diesem Punkt zu messen, wie gut das läuft und wo idealerweise Verbesserungen vorgenommen werden müssen. Verbesserst Du diese ersten Sekunden, hat das einen großen Einfluss auf die Gesamtinteraktivität Deiner Seite und stimmt Deine Website-Besucher positiv.

Was wird als erste Eingabe gewertet?

FID misst in erster Linie Eingabeereignisse. Dazu zählen beispielsweise diskrete Aktionen, wie:

  • Klicks
  • Tippen
  • Drücken von Tasten

Scrollen und Zoomen sind wiederum fortlaufende Aktionen. Deshalb werden sie nicht in die FID-Metrik einbezogen.


Wie kannst Du Deinen FID-Wert messen?

Google hat auch diese Metrik bereits in einige hauseigene Tools eingebunden. Deine Feld-Daten dazu erhältst Du deshalb hier:

  • PageSpeed Insights
  • Search Console (Core Web Vitals-Report)

CLS – Cumulative Layout Shift (Stabilität)

Wer kennt es nicht: Eine Website lädt, Du möchtest einen Button klicken und – schwupps – verschiebt sich der komplette Seiteninhalt und Du drückst schlimmstenfalls etwas anderes.

Diese Art von Instabilität auf der Seite wirkt sich negativ auf die Usability und das Nutzererlebnis aus und führt zu Verärgerung bei Deinen Website-Besuchern. Um beurteilen zu können, wie sehr Deine Seite von dieser Art von unerwarteten Verschiebungen betroffen ist, gibt es die Metrik Cumulative Layout Shift (CLS), zu Deutsch kumulative Layoutverschiebung. Mithilfe dieser wird die visuelle Stabilität einer Seite gemessen. Dazu gehören nicht nur Verschiebungen von Buttons, sondern ebenfalls von Bildern, Videos, Textblöcken, etc.

Der CLS-Score berechnet sich dabei folgendermaßen: Der betroffene Anteil der Website (affected area) wird mit der prozentualen Verschiebung (percentage of shift) multipliziert. Der sich daraus ergebende Prozentwert ist der CLS.

Der CLS (cumulative layout shift)-Score ist in drei Bereiche unterteilt:
1. Gut: 0 bis 10 Prozent Verschiebung
2. Optimierungsbedürftig: 10 bis 25 Prozent Verschiebung
3. Schlecht: 25 Prozent und mehr Verschiebung

Ein guter CLS-Score ergibt sich dabei bei einer prozentualen Verschiebung von unter 10%. Verrutschen die Inhalte nach vollständigem Laden der Seite jedoch um mehr als 25%, besteht dringender Optimierungsbedarf.

HINWEIS: Verschiebungen, die vom Nutzer selbst ausgelöst werden, sogenannte erwartete Verschiebungen, sind prinzipiell nicht problematisch. Sie wirken sich somit nicht negativ auf Deinen CLS aus.

Update: Neue Grenzwerte für CLS

Auf Feedback von Webmastern reagierte Google mit einer Anpassung der CLS-Metrik – das gab der Konzern jetzt in einem Statement auf dem Web.dev Blog bekannt. Die Zeit von Session-Fenstern, die zur Messung der Verschiebungen hergenommen werden, wird nun auf fünf Sekunden begrenzt. Der Zeitraum zwischen den einzelnen Fenstern beträgt eine Sekunde. Eine Session startet immer dann, wenn eine Layoutverschiebung auftritt. Beendet wird das Ganze, wenn eine gewisse Zeit keine Verschiebung mehr aufgetreten ist. Das hat zur Folge, dass die einzelnen Layout Shifts gruppiert werden. So soll eine intuitive Zusammenführung ermöglicht werden.

Das GIF zeigt grafisch, wie CLS mithilfe der Session-Fenster gemessen wird. Dabei werden die einzelnen Verschiebungen in Sessions gruppiert. Zwischen allen Sessions findet eine Session Gap, also eine Pause von einer Sekunde statt.
Hier erkennst Du die einzelnen Sessions inklusive der einsekündigen Pause (Session Gap), Quelle: Google

Den CLS-Wert verbessern – aber wie?

Bemerkst Du unerwartete Layoutverschiebungen, solltest Du handeln. Google empfiehlt drei konkrete Punkte, die dabei helfen, Deinen CLS-Wert zu verbessern.

  1. Verwendung von Größenattributen oder Sicherung von Speicherplatz
    Nutzt Du Größenattribute für Bilder und Videoelemente, sorgst Du dafür, dass der Browser beim Laden des Bildes/Videos weiß, wie viel Speicherplatz er benötigt. Dementsprechend viel Platz ist dann dafür frei. Alternativ kannst Du den Speicherplatz auch „reservieren“. Dies geht beispielsweise über CSS-Seitenverhältnisfelder.
  2. Kein Übereinanderlegen von Inhalten
    Vermeide Überlagerungen, also Inhalte oberhalb von vorhandenem Content einzufügen. Dies ist nur sinnvoll, wenn Du damit auf Benutzerinteraktionen reagierst.
  3. Bewegung und Animationen
    Sind Übergänge animiert, wirkt es für den Nutzer fließender und weniger abrupt. Immer, wenn sich die Inhalte in natürlicher Weise an ihre endgültige Stelle bewegen, erhöht das Deine Chance, dass Website-Besucher dies nicht als störend empfinden und trotz leichter „Verschiebung“ keine schlechte Benutzererfahrung haben werden.

Wie kann der CLS gemessen werden?

Um den CLS-Wert herauszufinden, können sowohl Feld-Tools als auch Labor-Tools verwendet werden. Diese stehen Dir zur Verfügung:

Feld-Tools

  • PageSpeed Insights
  • Search Console (Core Web Vitals-Bericht)

Labor-Tools

  • Chrome DevTools
  • Lighthouse
  • WebPageTest

Haben Core Web Vitals Einfluss auf SEO?

Die Antwort auf diese Frage ist ganz eindeutig: Ja! Doch mit einem einfachen Ja ist die Antwort noch nicht vollständig – es steckt mehr dahinter. Wie alle Rankingfaktoren hat auch die Page Experience Einfluss auf die Positionierung in den Suchergebnissen. Doch es wird nicht der neue Non-Plus-Ultra-Rankingfaktor – auch, wenn sich im Google-Universum gerade alles nur noch darum dreht. Core Web Vitals in der Kombination mit den bestehenden Signalen der User Experience sind wichtig, keine Frage. Doch sie betrachten nur technische Aspekte einer Website. Content und Keywords sind dennoch maßgeblich daran beteiligt, auf welcher Position Deine Seite in den Suchergebnissen rankt. Das heißt, dass Deine Seite in der Praxis auch mit schlechten Page Experience Signalen gut ranken kann. Steht sie jedoch in Konkurrenz zu einer inhaltlich ähnlich relevanten Website mit besseren Page Experience-Werten, wird diese die höhere Platzierung erhalten. Deshalb sind die Core Web Vitals im Bereich Suchmaschinenoptimierung wichtig. Die Logik dahinter ist ziemlich simpel: Umso mehr Rankingsignale Du gut bedienen kannst, umso besser Deine Platzierung.

Gary Illyes von Google postete auf Reddit folgendes Statement dazu:

„Wie jede andere Suchmaschine auch arbeitet Google hart daran, die qualitativ hochwertigsten und relevantesten Ergebnisse für die Suchanfragen der Nutzer zu erzielen. CWV hat mit keinem von beiden etwas zu tun, nicht einmal im Entferntesten, daher ist es äußerst unwahrscheinlich, dass CWV jemals ‚der primäre Faktor für den organischen Traffic‘ werden würde. Das heißt aber nicht, dass man CWV ignorieren kann.“

Garry Illyes, Webmaster Trends Analyst

Warum brauchst Du eine Core Web Vitals-SEO-Optimierung?

Langsame Seiten, Inhalte, die sich verschieben oder nicht reagieren – all das sind Punkte, die Nutzer, vor allem auf mobilen Endgeräten, in den Wahnsinn treiben. Da die Zugriffe über Mobile jedoch seit Jahren ansteigen, wird es immer wichtiger, Webseiten hierfür zu optimieren. Im Jahr 2020 waren bereits 80% aller Internetnutzer mit einem Mobilgerät im Internet unterwegs. Die Core Web Vitals sind genau dafür ausgelegt: Sie messen die User Experience von Seiten und haben deshalb vor allem auf mobile Rankings einen großen Einfluss, zumindest zu Beginn. Vor den neu eingeführten Core Web Vitals waren hierfür folgende Signale relevant:

  • Mobile Nutzerfreundlichkeit
  • Sicheres Surfen
  • HTTPs
  • Die Regularien zur Vermeidung von nervigen Intersitital

Durch das Page Experience-Update werden diese jetzt mit den Core Web Vitals zu einem neuen Rankingfaktor kombiniert. Um Dich also von Deinen Wettbewerbern abzuheben, solltest Du zusätzlich zu informativen und qualitativ hochwertigen Inhalten auch darauf achten, dass technische Aspekte stimmen. Hinzu kommt: Gerade jetzt ist noch ein guter Zeitpunkt, um Optimierungen durchzuführen. Aktuelle Daten aus dem Chrome UX Report zeigen, dass gerade mal rund 22% aller Domains die empfohlenen Core Web Vitals-Werte erreichen.

Das Bild zeigt eine Veröffentlichung von Chrome UX Report. Hier werden aktuelle Zahlen zum Core Web Vital-Stand von Websites gezeigt. Dabei haben knapp 48 % einen guten LCP-Score, beinahe 90 % einen guten FID-Wert und ungefähr 46 % einen guten CLS-Score. Gute Werte in allen drei Metriken haben dagegen nur knapp 22 % aller Domains.
Nur rund 22% aller Domains erreichen gute Werte bei allen drei Core Web Vitals-Metriken

Der Chrome User Experience Report umfasst bei seiner Analyse reale Nutzerdaten, die Google zur Bewertung der Page Experience verwendet. Als Origins bezeichnet Google dabei unterschiedliche Domains.

Auch eine neue Studie von Searchmetrics zeigt: Mehr als 97 % aller untersuchten Websites erreichen in der deutschen Desktop-Suche keine zufriedenstellenden Core Web Vitals-Ergebnisse. In der mobilen Suche handelt es sich um 85 Prozent. All diese Seiten riskieren somit Rankingverluste ab der Einführung des Core Web Vitals-Scores im Juni. Analysiert wurden dabei zwei Millionen Websites in den Top 20 der Google Suchergebnisse in den Ländern Deutschland, USA und Großbritannien.

Weitere Fragen und Antworten dazu, wieso Du Deine Core Web Vitals-Metriken optimieren solltest, findest Du außerdem hier im Beitrag von SEO Südwest.

Fazit – Page Experience-Update und Core Web Vitals

Mit dem Page Experience-Update und der Einführung der Core Web Vitals geht Google einen weiteren Schritt in Richtung Nutzerzentrierung. Anhand dieses Updates wird deutlich, dass der Suchmaschinen-Gigant mehr auf die Bedürfnisse seiner Nutzer eingehen möchte. So bringt er Webmaster subtil dazu, ihre eigenen Seiten dahingehend zu verbessern. Das betrifft Seiten, die bereits Mehrwert-Content liefern und gut ranken, ebenso wie Seiten, die bisher Schwierigkeiten beim Ranking hatten. Hast Du deshalb Deine Seite auf die drei Messwerte der Core Web Vitals (LCP, FID und CLS) optimiert, wird das Deine Chance auf gute Platzierungen in den Suchergebnissen erhöhen.

Inwiefern das Update Mitte Juni die Suchergebnisse erschüttern und Rankings verändern wird, bleibt jedoch abzuwarten.

FAQs und Fragen unserer Community

Wann werden die Core Web Vitals eingeführt?

Das Page Experience-Update sollte ursprünglich im Mai 2021 eingeführt werden. Dies gab Google bereits 2020 bekannt. In einem neuen Statement setzt Konzerns das Update jetzt aber erst für Mitte Juni 2021 an. Ab dann soll auch der Rankingfaktor Page Experience gelten.

Wo finde ich die Google Core Web Vitals-Werte?

Du kannst die Core Web Vitals-Werte Deiner Seite am einfachsten über die Google Search Console einsehen. Hier steht Dir der Core Web Vitals Report zur Verfügung, über den Du Einblicke in die Performance Deiner Website erhältst.

Wieso sind die Core Web Vitals-Werte für Mobil und Computer unterschiedlich?

Netzwerkverbindungen, Größe der Ansichtsfenster und verwendete Endgeräte beeinflussen die Feld-Daten, die zu einer Seite erhoben werden. Dadurch kann es sein, dass die entsprechenden Werte unterschiedlich ausfallen.

Warum werden in Tools wie Lighthouse und dem Chrome User Experience Report unterschiedliche Metrikwerte angezeigt?

Die Grundlage der Core Web Vitals sind Daten von tatsächlichen Benutzerbesuchen. Diese sind immer von den Umgebungsbedingungen der User und ihren Interaktionen beeinflusst. 
Lighthouse hingegen ist ein Tool, das Labor-Daten sammelt. Das heißt, es simuliert den Prozess unter gleichbleibenden Bedingungen. So kann Lighthouse zu einem bestimmten Zeitpunkt Informationen dazu geben kann, wie die Daten für einige Benutzer aussehen und welche Verbesserungsmöglichkeiten bestehen. Allerdings kann dies von den Daten abweichen, die aufgrund der tatsächlichen Besuche der Benutzer gesammelt wurden. Deshalb auch der Unterschied zum Chrome UX Report.

Ich nutze Safari, Firefox, Internet Explorer, … – ist Page Experience auch hier ein Rankingfaktor in der Google Suche?

Ja, denn es ist egal, welchen Browser Du verwendest. Rankingsignale für Page Experience, die auf Core Web Vitals basieren, findest Du global für alle Browserarten.

Welche Tricks helfen mir dabei, die gewünschten Core Web Vitals Werte zu erreichen?

Bildoptimierungen, bereinigte Caches, komprimierte Schriften und der Einsatz eines CDN (Content Delivery Network) können Dir helfen die Performance Deiner Website zu verbessern und können negative Einflüsse Deines CMS optimieren.

Führt der Cookie Consent Banner zu schlechteren CLS-Metriken?

Der Cookie Banner kann dafür sorgen, dass Deine CLS-Werte schlechter dastehen – muss es aber nicht zwingend. Cumulative Layout Shift misst Verschiebungen, die unerwartet kommen und die Nutzererfahrung dadurch verschlechtern. Ein Cookie Banner ist jedoch nicht unerwartet. Ein Nutzer, der eine neue Seite besucht, muss auch damit rechnen, dass ihm/ihr ein Consent Banner zur Bestätigung der Cookie-Einstellungen angezeigt wird.
Dennoch musst Du bei der Gestaltung des Banners darauf achten, dass er sich über die Inhalte legt und diese bestenfalls überdeckt statt sie zu verschieben.

Werden bei der Stichprobenanalyse der Nutzer zur Erhebung der Feld-Daten für die Web Vitals Nutzer gemessen, welche schon Cookies akzeptiert haben, oder werden nur Nutzer gemessen, die zum ersten Mal Kontakt mit der Domain haben?

Die gemessenen Feld-Daten beinhalten tatsächlich beide Szenarien. Es werden im Prinzip alle möglichen Szenarien, die einem tatsächlichen Nutzer mit der Website begegnen können, abgebildet.

Was steht hinter der Aktualisierung für die Nutzerfreundlichkeit von Seiten und wie wichtig ist sie im Vergleich zu anderen Ranking-Signalen?

Google veröffentlichte dazu folgendes Statement: „Mit dem Update für die Nutzerfreundlichkeit von Seiten wird ein neues Signal eingeführt, das unsere Suchalgorithmen neben Hunderten von anderen Signalen zur Ermittlung der besten Inhalte nutzen, die auf eine Anfrage hin angezeigt werden. Unsere Systeme priorisieren dabei weiterhin Seiten mit den insgesamt besten Informationen, auch wenn einige Aspekte der Nutzerfreundlichkeit der betreffenden Seite vielleicht nicht optimal sind. Die Nutzerfreundlichkeit einer Seite hat also kein stärkeres Gewicht als attraktive, relevante Inhalte. „

Wenn ich eine AMP- und eine Nicht-AMP-Version einer Webseite veröffentliche, welche davon wird dann von Google verlinkt?

Google nutzt hier weiterhin, wie auch aktuell schon, die AMP-Version für Mobilgeräte.

Du hast auch noch Fragen, die Du gerne beantwortet haben möchtest? Dann schick sie uns an !


Das erwartet Dich im Crashkurs

  • 30-Minuten-Webinar von Martin Splitt (Google) mit exklusiven Insights zu den Core Web Vitals
  • Tipps, wie Du herausfindest, ob bei Deiner Seite Handlungsbedarf besteht als kurzes Video
  • Eine Checkliste mit möglichen Optimierungsansätzen
  • Eine Videoanleitung zum Überprüfen Deiner Optimierungserfolge
  • Eine Vorlage für ein Google Data Studio Reporting, mit dem Du die Metriken immer im Blick behalten kannst

    *
    *
    *

    Durch die Anmeldung erklärst Du Dich damit einverstanden, dass Deine Daten eology zur Verfügung gestellt werden, damit wir Dir die Inhalte des Crashkurses zukommen lassen können. Du kannst dem Erhalt weiterer Informationen jederzeit widersprechen.


    Kontakt

    Melde Dich
    bei uns

      +49 9381 5829000