Der Algorithmus von Google ist weitgehend undurchsichtig. Für die Nutzer ist es fast unmöglich herauszufinden, welche Faktoren die Platzierungen verbessern und welche zu Leistungseinbussen führen können. Das macht natürlich Sinn, wenn man bedenkt, dass Google wahrscheinlich nicht viel über sein Billionen-Dollar-Geschäft preisgeben möchte.
Google macht jedoch deutlich, dass die Geschwindigkeit ein wichtiger Faktor bei der Bestimmung der Platzierungen ist. Diese Schlussfolgerung wurde erstmals im Jahr 2010 in Bezug auf die Geschwindigkeit von Desktop-Seiten festgestellt und 2018 in Bezug auf die Geschwindigkeit von mobilen Seiten wiederholt. Die wichtigste Erkenntnis: Eine Seite, die schneller lädt, wird mit Sicherheit besser gerankt. In unserem Artikel über die Google Sommer Updates haben wir bereits darüber berichtet. In diesem Artikel gehen wir noch näher darauf ein.
Google PageSpeed Insights ist seit Jahren das wichtigste Tool, das Google anbietet, um zu verstehen, wie eine Website in den Augen des Suchmaschinenbetreibers abschneidet. Das Tool wurde im Laufe der Zeit schrittweise verbessert, um mehr und bessere Metriken zu bieten, aber es lief immer auf eine Bewertung von 0-100 hinaus. Je nachdem, ob der Wert als schlecht, gut oder phänomenal eingestuft wurde, wurde eine rote, gelbe oder grüne Farbe zugewiesen.
Anschliessend begann Google, zusätzlichen Kontext in die Bewertung einzubeziehen und über die Probleme zu berichten, die sich auf Ihre Bewertung auswirkten. Die Transparenz half Entwicklern und Vermarktern zu wissen, wo sie Verbesserungen an ihrer Website vornehmen sollten. Der Abschnitt "Diagnostics" des Tools schlüsselte Dinge wie Anfragen, Rendering-blockierende Ressourcen, ob CSS und JavaScript minimiert waren und mehr auf. Es war ein Spickzettel, mit dem sich Leistungsprobleme auf einer Website schnell erkennen und beheben liessen.
Das Tool konzentrierte sich auf Labordaten, um mitzuteilen, wie Google die Seite bewertet hat, und auf weitere Daten zu den Faktoren, die zu dieser Bewertung beigetragen haben. Trotz all dieser Daten blieb uns während der gesamten Lebensdauer von Google PageSpeed Insights nur der Top-Line-Score, nach dem wir eine Website beurteilen konnten, und wir wussten nicht viel darüber, wie dieser berechnet wurde oder in das Ranking einfloss.
Obwohl der Wert der Seitengeschwindigkeit von Google öffentlich deutlich gemacht wurde, hat Google nicht immer klargestellt, wie die Geschwindigkeit gemessen wird und welche Faktoren berücksichtigt werden. Das PageSpeed Insights-Tool bietet seit langem eine hilfreiche Grundlage, liefert aber keine echte Bewertung der Nutzererfahrung, da die Daten im Labor generiert werden.
Um dieses Problem zu lösen, hat Google vor kurzem Core Web Vitals veröffentlicht, ein Tool, das spezifische Details über die reale Geschwindigkeit und Erfahrung Ihrer Website liefert.
Wir werden die Faktoren untersuchen, die zu den Core Web Vitals von Google beitragen, und erklären, wie Sie die Messungen nutzen können, um Ihre Website effizient zu testen. Wir gehen zwar ausführlich darauf ein, was die Benutzerfreundlichkeit, die Bewertung und das Ranking beeinträchtigen kann, aber der Beitrag erhebt keinen Anspruch auf Vollständigkeit und überspringt möglicherweise einige Elemente, die wir bei jeder neuen Website als selbstverständlich ansehen. Zögern Sie also nicht, sich bei Fragen zu Ihrer spezifischen Situation an uns zu wenden.
Web Vitals sind die vier neuen Messwerte, die Google verwendet, um die Geschwindigkeit einer bestimmten URL zu bewerten. Bevor wir uns mit den Messwerten selbst befassen, ist es wichtig zu wissen, dass jeder Wert von den realen Umständen beeinflusst wird, unter denen die Website getestet wird. Eine Website, die auf einem schnellen Laptop mit Breitband-Internet getestet wird, erhält beispielsweise andere Werte als eine Website, die auf einem alten Mobiltelefon mit 3G-Internet getestet wird. Das heisst, es ist wichtig zu berücksichtigen, dass alle Daten sowohl von der Leistung der Website als auch von der Leistungsfähigkeit des Geräts abhängen.
Zunächst eine Einführung in die vier Messwerte, aus denen sich der Web Vitals Score zusammensetzt:
FCP - Erstes inhaltsreiches Bild (First Contentful Paint)
LCP - Grösstes inhaltsreiches Bild (Largest Contentful Paint)
FID - Erste Eingabeverzögerung (First Input Delay)
CLS - Kumulative Layout-Verschiebung (Cumulative Layout Shift).
Diese Messungen beziehen sich alle auf etwas anderes, aber es ist erwähnenswert, dass die ersten drei Messungen sich darauf beziehen, wie schnell die Seite für einen Benutzer bereit ist. Die letzte Messung, Cumulative Layout Shift, misst, wie stark der Inhalt einer Seite sowohl während des Ladevorgangs als auch während der Interaktion des Benutzers mit der Seite hin und her springt.
Bemerkenswert ist auch, dass diese gesamte Beschreibung die serverseitige Leistung ausser Acht lässt. Es wird davon ausgegangen, dass Ihr Webserver schnell eine HTML-Antwort auf eine URL-Anfrage liefert. Dies ist das allererste, was bei jedem Seitenaufruf passieren MUSS, und wenn es nicht schnell geht, wird jede Messung schlecht ausfallen.
Im Folgenden finden Sie einige weitere Einzelheiten darüber, was jeder dieser Messwerte bedeutet und wie die Ergebnisse in der Praxis verzögert werden können:
Dies ist die Zeit, die von der ersten Anfrage des Browsers nach einer URL bis zum ersten Bild auf der Seite vergeht. Der Gedanke hinter dieser Messung ist, dass die wahrgenommene Ladezeit einer Seite verbessert wird, wenn den Benutzern gezeigt wird, dass Fortschritte gemacht werden. Dies ist die Idee hinter der Anzeige von Platzhalter-Lade-UIs.
In der Vergangenheit hatte dieser Wert mehr Gewicht. Einige Websites haben es mit der FCP-Messung etwas übertrieben, aber zum Glück haben einige erkannt, dass es nicht hilfreich ist, eine Platzhalter-Ladeoberfläche anzuzeigen, wenn dadurch die Ankunft des eigentlichen Inhalts verzögert wird. Im Allgemeinen kann dieser Wert durch Dinge aufgehalten werden, die das Rendern blockieren, einschliesslich Stylesheets und Skripte.
Das FCP-Ergebnis kann verbessert werden, indem nur die Ressourcen gesendet werden, die zum Rendern dessen erforderlich sind, was für die Benutzer im Ansichtsfenster sichtbar ist. Es ist beispielsweise nicht nötig, den Browser aufzufordern, sofort Bilder herunterzuladen, die am unteren Rand der Seite angezeigt werden, oder Stile herunterzuladen, die für andere Seiten der Website gelten. Aus diesem Grund verwenden wir "Lazy Image Loading" und Inline-Stile, die nur für eine bestimmte Seite gelten.
LCP ist eine neue Messung, die versucht, die Zeit von der ersten Anfrage bis zur Bereitstellung des eigentlichen Inhalts der Website zu messen. Das heisst, es wird gewartet, bis Schriften und Bilder im Viewport vollständig geladen sind. Jetzt, da LCP gemessen wird, haben sich einige der Tricks, mit denen Websites ihren FCP erhöhen wollten, als kontraproduktiv erwiesen.
So können beispielsweise schlecht implementierte lazy-loading-Bilder problematisch sein, wenn ein JS lazy-loading-Bild im Viewport erscheint. Jetzt muss der FCP nicht nur darauf warten, dass das Bild geladen wird, sondern auch darauf, dass das Lazy-Loading-JS heruntergeladen, geparst und ausgeführt wird. Es ist unnötig zu sagen, dass es keine gute Praxis ist, das FCP auf Kosten der schnelleren Anzeige des eigentlichen Inhalts zu verbessern.
Um das LCP zu verbessern, ist es wichtig, die Schriftarten der Website richtig einzubinden und sicherzustellen, dass die Bilder im Viewport so schnell wie möglich geladen werden können. Im Wesentlichen geht es darum, sicherzustellen, dass alle Inhalte im Viewport mit so wenig seriellen Abhängigkeiten wie möglich angezeigt werden können.
Kennen Sie das, wenn Sie eine sehr umfangreiche Seite auf Ihrem Handy besuchen und alles abgehackt wirkt, während der Inhalt geladen wird? Diese Ruckeligkeit wird Eingabeverzögerung genannt. Sie bitten die Seite um einen Bildlauf, aber das geht nicht, weil Ihr Handy zu sehr mit der Verarbeitung beschäftigt ist.
Bei der Verarbeitung kann es sich um eine Vielzahl von Dingen handeln:
Um FID zu reduzieren, ist es am besten, die Menge an JS, die auf einer bestimmten Seite läuft, zu verringern. Ein wichtiger Punkt bei der FID ist das Ausmass, in dem sie von der Geräteleistung beeinflusst wird. Das geht zurück auf unseren Vergleich zwischen dem schnellen Laptop und dem alten Handy. Das Mass, das für die FID-Bewertung herangezogen wird, ist die Zeit - nicht die "Anzahl der Skripte". Ein moderner Computer kann in sehr kurzer Zeit VIELE Berechnungen durchführen, ein älteres Handy hingegen nicht. Selbst wenn Sie also auf einem Laptop einen guten FID-Wert sehen, bedeutet das in der realen Welt nicht viel, wenn Ihre Website von einer Vielzahl von Geräten besucht wird. Noch schlimmer ist die Tatsache, dass eine langsam laufende Website zu einem Schneeballsystem wird.
Ein schneller Laptop kann das Rendering der Website sofort erledigen und dann mit der Arbeit an unkritischem Javascript beginnen. Bei einem langsameren Gerät stapeln sich möglicherweise alle Ressourcen der Website und es fällt schwer, alle zu einem bestimmten Zeitpunkt abzuschliessen. Es ist nicht ungewöhnlich, dass ein Gerät, das nur halb so schnell ist, viermal so lange braucht, um für Benutzereingaben bereit zu sein.
Wie bereits erwähnt, ist diese Messung einzigartig, weil sie fortlaufend ist. Sie misst, wie sehr der Inhalt der Website während des Ladevorgangs und der Verweildauer des Nutzers auf der Seite hin und her springt. Bei dieser Bewertung wird nach Situationen gesucht, in denen der Text, den Sie gerade lesen, plötzlich aus dem Blickfeld verschwindet oder die Schaltfläche, auf die Sie gerade klicken wollen, durch das Laden der Seite an eine andere Stelle verschoben wird. Layoutverschiebungen sind eine sehr frustrierende Erfahrung, die oft durch Bemühungen zur Verbesserung der anfänglichen Ladezeit verursacht wird.
Der Hauptverursacher für Layoutverschiebungen ist das Laden von Bildern. Wenn ein einfaches Bild-Tag ohne zusätzliche Informationen über die Grösse des Bildes in die Seite eingefügt wird, weiss der Browser nicht, wie viel Platz er für das Bild reservieren muss, bis es tatsächlich geladen ist. Das bedeutet, dass Ihr Layout aufgehalten werden kann, während Sie darauf warten, dass ein Bild richtig angezeigt wird. Bilder sind in der Regel die grössten Elemente auf einer Website, so dass Sie verstehen können, warum dies problematisch ist.
Jetzt, da CLS gemessen wird, hat es sich als ein kleines Problem erwiesen, selbst für Websites, die sich bemühen, das Richtige zu tun. Wie das? Viele Entwickler verwenden das PageSpeed Insights-Tool, um die Leistung einer Website zu testen. Das ist in Ordnung, aber es liefert nur eine Momentaufnahme zum Zeitpunkt des ersten Renderings. Das bedeutet, dass Entwickler aufgrund von "Lazy Loading"-Bildern - die für das Tool unsichtbar sind, weil sie später geladen werden - nicht wissen, dass sich das Layout verschiebt, wenn die Bilder vollständig geladen werden.
Infolgedessen erhalten viele Websites gute Werte für die ersten drei Metriken, aber einen schlechten Wert für die Benutzerfreundlichkeit und das CLS. Die Lösung besteht darin, für jedes Bild auf Ihrer Website Platz zu reservieren, indem die Abmessungen oder Proportionen entweder im HTML-Code, im CSS-Code oder in einer Kombination aus beidem angegeben werden.
Nachdem diese Messwerte nun vorgestellt wurden, ist es wichtig, die beste Art und Weise zu erörtern, wie man sie bei der Erstellung einer Website überwacht. Es gibt drei Hauptquellen für Messungen, die Sie im Auge behalten sollten:
Felddaten sind eine reale Messung von tatsächlichen Nutzern. Sie beruhen auf echten Nutzererfahrungen und bestimmen die SEO-Leistung einer bestimmten URL. Bei Labordaten handelt es sich um Messungen, die zu einem bestimmten Zeitpunkt und unter bestimmten Umständen vorgenommen wurden, die nicht unbedingt mit der realen Welt übereinstimmen. Nur weil es möglich ist, gute Labordaten für eine bestimmte URL zu erheben, bedeutet das nicht unbedingt, dass sich die tatsächlichen Felddaten verbessern werden. Und wenn Sie Arbeiten durchgeführt haben, die sich in Ihren Labordaten widerspiegeln, kann es einige Zeit dauern, bis genügend reale Messungen in den Felddaten auftauchen.
Im Folgenden werden die drei Datenquellen etwas ausführlicher beschrieben.
Es gibt eine Reihe von Möglichkeiten, um Zugang zu den Felddaten von Google zu erhalten, die in diesem Blogbeitrag ausführlich beschrieben werden. Am einfachsten ist es jedoch, entweder in der Google Search Console unter Erweiterungen > Core Web Vitals oder in einem PageSpeed Insights-Bericht unter dem Abschnitt "Field Data" nachzusehen. PageSpeed Insights zeigt Ihnen in der Regel aggregierte Felddaten für die überprüfte Domain an, und wenn die überprüfte URL populär genug ist, werden auch Felddaten für die spezifische URL angezeigt.
Die Felddaten sind im Allgemeinen ein laufender Durchschnitt der Leistung der letzten 30 Tage. Wenn jedoch grosse Verbesserungen an der Website vorgenommen wurden, können sie schneller angezeigt werden, insbesondere wenn eine Anfrage über die Google Search Console gestellt wird.
Ein Blick auf die Felddaten ist die einzige Möglichkeit, um sicher zu wissen, wie eine bestimmte Seite abschneidet.
PSI ist ein wunderbares Tool, mit dem Sie schnell die Leistung einer bestimmten URL mit einem simulierten Mobil- und Desktopgerät überprüfen können. Wenn Ihre Seite ein Problem hat, wird PageSpeed Insights dies mit ziemlicher Sicherheit aufzeigen.
Zusätzlich zur Anzeige der Ergebnisse werden auch Vorschläge angezeigt. Jetzt werden sogar Vorschläge angezeigt, die an bestimmte Web-Vital-Metriken gebunden sind. Wenn zum Beispiel ein grosses, nicht optimiertes Bild beim Laden der Seite oberhalb der Falte (dem oberen Teil einer Webseite, d.h. demjenigen Bereich, der auch ohne Scrollen bei der normalen Standardauflösung eines Webbrowsers sofort eingesehen werden kann) angezeigt wird, wird es wahrscheinlich als Problem unter "First Contentful Paint" aufgeführt.
Bei der Analyse der Vorschläge ist zu beachten, dass alle Prüfungen, die "bestanden" wurden, standardmässig ausgeblendet werden. Dies ist zwar hilfreich, um das Durcheinander zu verringern, doch werden dadurch manchmal wichtige Informationen übersehen. Es ist nicht ungewöhnlich, dass eine bestimmte URL einen schlechten FID aufweist, aber alle Prüfungen besteht. Wenn das der Fall ist, lohnt es sich, nachzuschauen, wie viele davon knapp bestanden wurden. Alles kann sich summieren.
Das Wichtigste beim PageSpeed Insights Tool ist, dass es CLS nicht effektiv messen kann, da es nicht länger als einen Moment mit der Seite interagiert. Wenn eine Seite beim Scrollen Layout-Verschiebungsprobleme hat, wird dieses Tool diese Probleme nie finden.
Mit der Chrome-Erweiterung Web Vitals können Sie auch schnell die Web Vitals-Werte für jede von Ihnen besuchte Seite überprüfen. Dies kann sehr praktisch sein, da die Erweiterung schnell ein rotes oder grünes Licht für eine bestimmte Seite anzeigt und gleichzeitig die Layoutverschiebung misst, während Sie mit der Seite interagieren. Wenn Sie also auf einer schnellen Seite mit Layoutverschiebungsproblemen nach unten scrollen, können Sie buchstäblich sehen, wie die Anzeige der Erweiterung von grün auf rot wechselt.
Das Wichtigste bei dieser Erweiterung ist, dass sie Ihr Gerät und Ihre Internetverbindung misst. Wenn es Probleme mit zu vielen laufenden Skripten oder übergrossen Bildern und Assets gibt, werden Sie diese auf einem schnellen Gerät mit einer schnellen Verbindung möglicherweise nicht bemerken. Die Erweiterung wird das auch nicht tun.
Google hat es möglich gemacht, mit dem Gerätemodus die Leistung eines langsameren Geräts mit einer schlechteren Verbindung zu simulieren. Dies kann in Kombination mit der Erweiterung sehr hilfreich sein, da Sie damit schnell eine beliebige Anzahl von Seiten überprüfen können, während Sie auf einer Website surfen.
All diese Informationen können sich überwältigend anfühlen, vor allem, wenn jeder Punkt ohne den richtigen Kontext betrachtet wird. Jedes Detail der Core Web Vitals basiert jedoch auf einem sehr grundlegenden Prinzip: Google möchte, dass schnelle Websites mit guter Benutzerfreundlichkeit besser bewertet werden. Und obwohl die in diesem Beitrag genannten Messwerte jetzt aktuell sind, kann man davon ausgehen, dass Google seine Testverfahren immer wieder neu bewerten und optimieren wird, um diesem Ziel besser gerecht zu werden. Also behalten Sie immer Ihre Strategie und Ihre User im Auge. Wir unterstützen Sie gerne dabei.
