4 Top-Tipps zur Verbesserung der Überprüfung von Core Web Vitals

Es gibt keine feste Regel für die Prüfung von Core Web Vitals, insbesondere bei einer Vielzahl von Tools von Drittanbietern, die berücksichtigt werden müssen. Wir schlüsseln einige unserer Top-Tipps für Geschwindigkeitsprüfungen auf, die Sie in Ihre Arbeitsabläufe integrieren können, darunter:

• Seitenerfahrung & Google Search Console
• Die Nachteile von PageSpeed ​​Insights
• Empfohlene Audit-Tools von Drittanbietern
• Wasserfalldiagramme verstehen

1. Starten Sie Ihren Audit-Workflow für Core Web Vitals mit der Search Console

Wenn Sie eine Website auf Probleme mit der Websitegeschwindigkeit und Core Web Vitals prüfen, empfehlen wir, den Fehlerbehebungsprozess immer zu beginnen, indem Sie den Abschnitt „Erfahrung“ in der Search Console überprüfen – vorausgesetzt, der Zugriff ist verfügbar. Die Suchkonsole sammelt echte Benutzerdaten (Felddaten) aus dem Chrome UX-Bericht, sodass Sie auf einfache Weise nachvollziehen können, welche LCP-, CLS- oder FID-Probleme Ihre Benutzererfahrung und letztendlich das Ranking-Potenzial der Website beeinträchtigen.

Navigieren Sie zu „Page Experience“ > „Core Web Vitals“, und das angezeigte Diagramm zeigt die Anzahl der URLs, die für die Website-Eigenschaft entweder als „Gut“, „Verbesserungsbedürftig“ oder „Schlecht“ eingestuft wurden. Zum Beispiel:

Sehen Sie sich das Diagramm unten zu Zeiten und Metriken von Google zu den oben genannten Core Web Vitals-Schwellenwerten an.

Von hier aus können wir beurteilen, ob die Mehrheit der URLs als „Gut“ eingestuft werden und somit alle 3 Core Web Vitals-Metriken erfüllen, oder ob die meisten Seiten „Schlecht“ oder „Verbesserungsbedürftig“ sind, was darauf hinweist, dass einige technische Probleme bestehen die gelöst werden müssen, damit sie passieren.

Hilfreicher Tipp: Seiten müssen alle drei Web-Vitals bestehen, um in den Status „Gut“ zu gelangen, und es reicht nicht aus, wenn die Mehrheit der URLs einer Website im Bereich „Verbesserung erforderlich“ liegt.

Sie können dann jeden Abschnitt aufschlüsseln, um die spezifischen URLs zu ermitteln, die von Geschwindigkeitsproblemen betroffen sind und überprüft werden müssen. Diese werden nach denen gruppiert, die auf Vorlagenebene ähnlich sind. Anstatt also zu versuchen, alle verschiedenen Arten von URLs zu prüfen, die eine Website haben kann – z. B. Homepage, Kategorieseiten, Produktseiten, Blogbeiträge usw., können sich die Probleme, mit denen echte Benutzer beim Besuch der Website konfrontiert sind, nur auf 1 oder 2 konzentrieren von diesen, was bedeutet, dass Sie sich ausschließlich auf diese Vorlagen konzentrieren können, was eine große Zeitersparnis sein kann.

2. Verwenden Sie PageSpeed ​​Insights sparsam

Obwohl PageSpeed ​​Insights (PSI) ein nützliches kostenloses Tool von Google ist, das einen Top-Level-Überblick über potenzielle Möglichkeiten zur Behebung von Problemen bietet, ist es wirklich eine faule Methode, um die Website-Geschwindigkeit zu prüfen, wenn es isoliert verwendet wird. Wir haben gesehen, dass viele SEOs die Empfehlungen übernommen haben, manchmal wörtlich, und diese den Entwicklern oder dem technischen Team des Kunden präsentiert haben, ohne wirklich das Warum oder den Kontext dahinter zu verstehen.

Leider kann dies oft dazu führen, dass weitere Fragen auf Sie zurückgeworfen werden, insbesondere wenn Sie sich nicht weiter mit den Möglichkeiten und Empfehlungen befassen, die das Tool ausspuckt.

Zum Beispiel haben wir alle von der Empfehlung gehört, „Renderblocking-Ressourcen zu beseitigen“, um das Laden des LCP-Elements zu beschleunigen, aber was passiert, wenn diese Ressource beim ersten Mal unbedingt vorhanden sein muss, wie z. B. ein Cookie-Banner-Skript? oder handelt es sich bei den betroffenen Assets um Ressourcen von Drittanbietern? Entwickler werden diese wahrscheinlich sofort zurückschlagen, da sie nicht viel tun können – daher ist es wirklich wichtig, dass alle technischen Empfehlungen von PSI mit einer Prise Salz aufgenommen und weiter untersucht werden, bevor sie darauf zurückkommen Entwickler.

Es ist auch hilfreich zu wissen, dass PSI ein emuliertes Gerät (Moto G4) mit Lighthouse verwendet, aber die Probleme können je nach Gerät, das echte Benutzer am häufigsten verwenden, erheblich variieren, wie dies bei „Labor“-Tests der Fall ist. Dies kann häufig bedeuten, dass PSI Probleme oder Möglichkeiten zum Testen auf diesem bestimmten Gerät nicht zurückgibt, obwohl Sie aus dem Chrome UX-Bericht wissen, dass es ein Problem für die echten Benutzer der Website gibt.

Wir empfehlen daher immer, PSI in Verbindung mit anderen Geschwindigkeitstest-Tools zu verwenden, bei denen die Geräte- und Verbindungskonfiguration entsprechend angepasst werden kann.

3. Erkunden Sie alternative Tools zur Geschwindigkeitsprüfung

Neben der Verwendung von PageSpeed ​​und anderen Google-Tools empfehlen wir auch, andere kostenlose und Freemium-Geschwindigkeitstest-Tools wie WebPageTest (WPT) oder GTMetrix zu erkunden.

WebPageTest verfügt über eine Reihe nützlicher Funktionen und Konfigurationsoptionen, die das Testen der Geschwindigkeit auf Seitenebene unterstützen. Mit der erweiterten Konfiguration können Sie wichtige Testeinstellungen wie Browser und Gerätetyp sowie den Testort anpassen. Auf diese Weise können Sie Ihre Überwachung optimieren, insbesondere wenn Sie wissen, wo sich die Mehrheit der Benutzer der Website befindet, sowie deren Gerätetyp, was bedeutet, dass Sie sich nicht nur auf das voreingestellte simulierte Gerät von Google verlassen.

Hier können Sie auch die Verbindungseinstellungen der standardmäßigen 3G-Fast-Verbindung anpassen sowie bestimmte URLs blockieren, wenn Sie Leistungssteigerungen für problematische Skripte testen möchten. Es gibt viele andere Konfigurationsoptionen, die wir nicht aufgelistet haben, um sie zu untersuchen, aber die oben genannten sind diejenigen, die wir bei der Prüfung der wichtigsten Web-Vitals am hilfreichsten fanden.

Sobald ein Test durchgeführt wurde, navigieren Sie zur Registerkarte „Core Web Vitals“, um eine detaillierte Aufschlüsselung der Leistung für jede Metrik zu erhalten, einschließlich Filmstreifen, Videozeitleisten, Wasserfalldiagramme sowie eine detaillierte Aufschlüsselung des Elements, das das Ereignis ausgelöst hat – all dies sind in einer Reihe von Formaten exportierbar und das Beste ist, dass sie kostenlos sind!

Die Filmstreifenansicht ist besonders nützlich, um zu verstehen, an welchem ​​Punkt beim Laden der Seite bestimmte Elemente visuell erscheinen, was helfen kann, Prioritäten zu setzen, welche Assets potenziell schneller geladen werden könnten. Es wird sehr deutlich angezeigt, wenn es signifikante visuelle Verschiebungen gibt, um zu helfen, die Elemente zu lokalisieren, die es verursachen.

GTMetrix hat ähnliche Funktionen wie WebPageTest, jedoch sind viele der erweiterten Optionen, die in WPT kostenlos sind, nur in den kostenpflichtigen Paketen verfügbar.

4. Lernen Sie Wasserfalldiagramme kennen

Grundsätzlich ist ein Wasserfalldiagramm eine Zeitachse, die anzeigt, wann Dateien oder Assets angefordert werden, wie lange das Herunterladen gedauert hat und wann sie auf der Seite sichtbar sind.

Der Blick auf ein Wasserfalldiagramm kann von Anfang an ein wenig abschreckend wirken, da es viele verschiedene Zeilen, Balkenlängen und Farben gibt, die unterschiedliche Bedeutungen haben – aber lassen Sie sich nicht abschrecken! Zeit damit zu verbringen, Wasserfalldiagramme kennenzulernen und zu verstehen, ist die wichtigste Fähigkeit, die ein technischer SEO für die Geschwindigkeitsprüfung haben sollte.

Wenn Sie es gewohnt sind, WebPageTest für die Überprüfung von Web Vitals zu verwenden, finden wir die Wasserfalldiagramme am benutzerfreundlichsten. WebPageTest stellt einen farbcodierten Schlüssel über dem Diagramm bereit, der Verbindungsinformationen, angeforderte Ressourcentypen und andere Ereignisse wie die JS-Ausführung angibt. Es zeigt auch Render-Blocking-Ressourcen visuell an und hebt angeforderte Ressourcen hervor, die eine 3xx- oder 4xx-Antwort haben.

Hilfreicher Tipp: Achten Sie auf die helle und dunkle Schattierung der horizontalen Balken auf dem Wasserfall, die helle Schattierung zeigt an, dass die Ressource vom Browser angefordert wurde, während die dunkle Schattierung anzeigt, dass die Ressource heruntergeladen wird .

Alles in allem trägt dies dazu bei, ein tieferes Verständnis von Leistungsproblemen auf der Website zu erlangen, und macht Ihre Empfehlungen zu deren Behebung wiederum umsetzbarer. Wir empfehlen den ausführlichen Artikel von Matt Hobbs zum Lesen eines Wasserfalldiagramms, um mehr zu erfahren.

Wenn Sie nach Expertenrat zur Lösung von Leistungsproblemen auf Ihrer Website suchen, kontaktieren Sie uns bitte oder besuchen Sie unsere Seite Technische SEO-Services, um weitere Informationen darüber zu erhalten, wie Semetrical helfen kann.