|

Core Web Vitals Guide 🧑‍⚕️ - die wichtigsten Metriken im Web

Die Erfahrung der Nutzer:innen einer Website sind unser höchstes Gut.
Leider gibt es auch diverse Probleme, die diese Erfahrung deutlich mindern können, allem voran, eine schlechte Performance der Seite.

Damit diesem Problem entgegen gewirkt werden kann, muss das Defizit erst einmal sichtbar gemacht werden:
Dafür verwenden wir seit Jahren Tools wie PageSpeed Insights, Lighthouse etc.

Aber all diese Tools brachten bis vor kurzem ein ganz eigenes Problem mit sich:
Alle Tools spucken unterschiedlichste Metriken (KPIs) aus, so dass man die Ergebnisse gar nicht vergleichen kann, sobald sie von anderen Tools erstellt werden.

Ein Bespiel:
Wir optimieren unsere Websiten hauptsächlich über Lighthouse. Jetzt kommt es allerdings immer wieder vor, dass Kund:innen ein anderes Tool zum Testen verwendet haben. In diesem wurden wir schlechter bewertet und nun wird sich über Performance-Faktor xy beschwert, den es bei lighthouse gar nicht gibt. Das ist leider sehr unglücklich und bringt einen oftmals in unschöne Erklärungsnot.

Darüber hinaus messen unterschieldliche Versionsnummern einer Testingsoftware oftmals auch sehr unterschiedliche Ergebnisse.

Kurz gesagt: Die Ergebnisse sind nicht verlässlich und inkonsistent.

Eine einheitliche Lösung

Einen Lösungsvorschlag für das Problem präsentierte Google in Zusammenarbeit mit W3C beim vorletzten Dev-Summit:

Die Core Web Vitals: Einheitliche KPIs unabhängig vom Tool.

Diese Werte sind zukünftig die Werte, nach denen man Performance bewerten wird; und damit die Werte, die wir mit Kund:innen kommunizieren werden.

Aktuell gibt es drei Core Web Vitals:

LCP ⚡ (Largest Contentful Paint)

Core Web Vitals Guide 🧑‍⚕️ - LCP ⚡ (Largest Contentful Paint)
LCP, oder auch “Largest Contentful Paint” gibt an, wie lange das größte Content-Element auf der Seite benötigt, um geladen zu werden. Hiermit wird also die wahrgenommene Ladedauer ermittelt.

FID 📲 (First Input Delay)

Core Web Vitals Guide 🧑‍⚕️ - FID 📲 (First Input Delay)
FID, oder auch “First Input Delay” gibt an, wie viel Zeit zwischen der erstmaligen Interaktion (zb. Klick auf Link) mit der Seite und der davon hervorgerufenen Browser-Reaktion vergeht.

CLS 🥌(Cumulative Layout Shift)

Core Web Vitals Guide 🧑‍⚕️ - CLS 🥌 (Cumulative Layout Shift)
CLS, oder auch “Cumulative Layout Shift” gibt an, wie visuell stabil eine Seite bei einer Interaktion bleibt. Der Wert soll Verschiebungen von Layout entdecken, die etwa durch ein Element das nachgeladen wird, entstehen.

Auswirkungen auf SEO

Darüber hinaus spielen Sicherheit und Nutzerfreundlichkeit auch weiterhin eine Rolle als Ranking-Faktor für SEO.
Ansonsten spielen aber keine weiteren Ladezeit und Perfromance-Metriken mehr eine Rolle für das SEO Ranking.

Bei der Auswertung der Vitals wird zwischen mobile und desktop unterschieden. Dabei werden beide Scores seperat ausgewertet und für das jeweile SEO Ranking auf Desktop bzw Mobile verwendet.

Page Experience Signal

Google plant derzeit einen neuen Rankingfaktor, das Page Experience Signal einzuführen.

Ziel ist, die Web Vitals mit den bestehenden User Experience Signalen zu verbinden.

Diese sind:

  • Mobile-Friendliness
  • Safe-Browsing
  • HTTPS-Security
  • Intrusive Interstitial Guidelines (Pop-ups; außer gesetztlich/ethisch vorgegeben)

Die Web Vitals werden aber nicht alleinentscheidend sein, sondern als weiterer Faktor hinzugezogen.
Sie können damit aber den entscheidenden Unterschied zur Konkurrenz machen.

die Core Web Vitals verstehen

Wie eben erwähnt, wird bei den Vitals zwischen mobile und desktop unterschieden.

Darüber hinaus wird außerdem zwischen Felddaten und Labdaten unterschieden:

Felddaten sind die aus der Erhebung von echten Nutzungsdaten der zu testenden Seite erstellte Werte und repräsentieren damit das tatsächliche Nutzungsverhalten der Seite.
In diesen Felddaten finden sich also entsprechend auch die verschiedensten Geräte und Verbindungsgeschwindigkeiten wieder.

Neben den echten Felddaten, gibt es auch noch die sog. Labdaten, das sind simulierte Daten, ähnlich wie man das zuvor von Lighthouse und Co schon kannte.
Hier wird mit festem Setup (ein Gerät + festgelegte Netzwerkbedingungen) gemessen.

Die Metriken unterteilen sich in jeweils drei farbliche Bereiche.
dabei ist grün im guten Bereich, gelb zeigt Optimierungsbedarf und rot ist schlecht und erfordert dringend Handlung.

Vorteile gegenüber dem alten System

Der Fokus auf einheitliche Web Metriken hat viele Vorteile:

So können dank einheitlichen KPIs Bewertungen vorgenommen werden, die mit den Kund:innen oder auch dem Management eineutig kommuniziert werden können und als Grundlage für Verbesserungen und Budgetplanung genutzt werden können.

wiedersprüchliche Werte sind damit obsolet.

regelmäßige Reevaluierung

Die aktuellen Core Vitals sind nicht final und unveränderbar.
Da sie aus realen Daten von Nutzer:innen erstellt wurden, werden sich die Vitals mit der Zeit an technische Entwicklungen und verändertes Nutzungsverhalten anpassen.

Aber im Gegensatz zu dem früheren, zeitlich gefühlt wahllosen Veränderungen der Tools sollen die Core Web Vitals einmal im Jahr neu evaluiert und optimiert werden, so dass Entwicklungsteams genügend Zeit haben, sich auf die Veränderungen einzustellen.

Seit Mai 2021 sollen die Web Vitals in allen gängigen Google Produkten integriert worden sein.

Das beinhaltet ua.

  • Google Search Console
  • PageSpeed Insights
  • Lighthouse
  • Chrome DevTools
  • Chrome UX Report
  • Web Vitals Extension

Chrome Plugin

Eine erste Übersicht über die Core Web Vitals einer Seite gibt uns die offizielle Web Vitals Chrome Extension

Einfach Seite neu laden und schon gibt erste Ergebnisse.

! Hinweis: Funktioniert wohl nicht auf Websiten die google gehören 🤷

Quellen

searchmetrics.com | Core Web Vitals
seonative | Core Web Vitals
web.dev | Learn Web Vitals
web.dev | Vitals