Online Marketing, Gadgets, Affiliate, Verdienen Sie Geld mit Ihren Blogs

So verbessern Sie die wichtigsten Web-Vitalwerte – ein Ultimativ…

Hinweis: Der folgende Artikel hilft Ihnen dabei: So verbessern Sie die wichtigsten Web-Vitalwerte – ein Ultimativ…

So verbessern Sie die wichtigsten Web-Vitalwerte – ein Ultimativ...

Betreiben Sie eine Website auf WordPress? Möchten Sie Ihr Benutzererlebnis verbessern, indem Sie Ihr Seitenerlebnis verbessern? Wenn ja, dann ist dieser Artikel genau das Richtige für Sie.

Anfang August 2021 gab Google das bekannt Seitenerlebnis würde zu einem der Suchrankingfaktoren werden. Hierzu hat Google die Initiative ergriffen Kern-Web-Vitals Metriken für Websitebesitzer, die ihnen dabei helfen, das Benutzererlebnis und die Qualität ihrer Websites zu verbessern.

Wenn Sie also wissen möchten, wie Sie Ihr Besuchererlebnis verbessern und Ihre Chancen auf ein höheres Ranking in den Suchmaschinen erhöhen können, dann sind Sie hier richtig. In diesem Leitfaden erfahren Sie, wie Sie Google Core Web Vitals für Ihre WordPress-Website verbessern und erweitern.

Aber bevor wir tiefer eintauchen, wollen wir herausfinden, was Google Core Web Vitals sind.

Was sind Google Core Web Vitals?

Google Core Web Vitals ist eine Initiative von Google, die auf einer Reihe von Website-Leistungsmetriken basiert, um die Benutzererfahrung zu messen und zu verbessern. Diese Web-Vital-Scores konzentrieren sich auf die Gesamtleistung der Website und darauf, wie Ihre Website ein qualitativ hochwertiges Benutzererlebnis bietet, anstatt sich nur auf die gesamte Ladezeit der Website zu konzentrieren.

Selbst wenn Ihre Website schnell lädt, ist sie möglicherweise nicht voll funktionsfähig oder für Ihre Benutzer nicht sichtbar, was zu einer schlechten Benutzererfahrung führt. Benutzern ist es wichtig, wie schnell sie mit einer Webseite interagieren können, und genau das messen die Core Web Vitals-Metriken.

Um dies zu erreichen, nennt Google drei Core Web Vitals:

  • Größte inhaltsreiche Farbe (LCP).
  • Erste Eingabeverzögerung (FID)
  • Kumulative Layoutverschiebung (CLS)

Diese Kennzahlen sind für Ihre Website die wichtigsten, um ein besseres Benutzererlebnis zu bieten.

Vielleicht klingen diese Namen für Sie technisch oder verwirrend, aber keine Sorge! Sie sind recht einfach zu verstehen und ich erkläre jede Metrik auf leicht verständliche Weise. Ich möchte Ihnen ein besseres Verständnis dafür vermitteln, was jedes Core Web Vital bedeutet und welche Auswirkungen es hat, damit Sie diese Core Web Vitals für WordPress-Sites verwenden können.

Größter Contentful Paint (LCP)

Der Größter Contentful Paint (LCP) misst, wie schnell der Hauptinhalt, normalerweise der Hero-Bereich oder das vorgestellte Bild Ihrer Website, für Ihre Benutzer sichtbar ist. Der Hauptinhalt, oder man könnte sagen, das LCP-Element, ist für jede Site unterschiedlich. Ja, auch für Mobil- und Desktop-Versionen. Die LCP-Elemente können Bilder, Inhalte oder Beschreibungen sein.

Sie haben eine Website besucht und festgestellt, dass das erste und Hauptbild (normalerweise ein Heldenbereich) wurde nicht geladen. Wie würden Sie sich als Besucher fühlen? Selbstverständlich verlassen Sie diese Website und wechseln zu einer anderen Website. Auf diese Weise steht die größte Contentful-Paint-Metrik in engem Zusammenhang mit der Benutzererfahrung und ist eine wesentliche Metrik der Core Web Vitals für WordPress-Sites.

Sie können im obigen Bild sehen, dass die Google-Schwellenwerte für die LCP-Zeit sind:

  • Gut – Weniger als oder gleich 2,5 Sekunden
  • Muss verbessert werden – Kleiner oder gleich 4,0 Sekunden
  • Arm – Mehr als 4,0 Sekunden.

Erste Eingabeverzögerung (FID)

Erste Eingabeverzögerung (FID) misst die Zeit zwischen der Benutzerinteraktion und der Ereignisverarbeitung. Unter FID versteht man einfach den Zeitpunkt, zu dem ein Benutzer auf einen Link klickt, bis zu dem Zeitpunkt, an dem sein Browser mit der Verarbeitung des Ereignisses beginnt. Die Interaktion könnte ein Klick auf den Link, eine Call-To-Action (CTA)-Schaltfläche oder die Übermittlung eines Formulars sein.

Wenn ein Benutzer ein Formular ausfüllt und auf die Schaltfläche „Senden“ klickt, wie lange dauert es, bis Ihre Website das Ereignis verarbeitet und Ihr Formular erfolgreich übermittelt? Dies misst die First Input Delay (FID). wie schnell Ihre Website Interaktionen verarbeitet.

Lesen:  Die Anwendungen einer neuen Technologie: Li-Fi (Lichttreue)

JavaScript hat großen Einfluss auf die Verzögerung der ersten Eingabe. Aus diesem Grund ist es kompliziert, die FID-Metrik von Core Web Vital für WordPress-Sites zu optimieren.

Laut Google fallen die FID-Zeiten (First Input Delay) in die folgenden Kategorien:

  • Gut – Kleiner oder gleich 100 ms
  • Muss verbessert werden – Kleiner oder gleich 300 ms
  • Arm – Mehr als 300 ms.

Kumulative Layoutverschiebung (CLS)

Haben Sie schon einmal erlebt, dass sich beim Lesen das Layout oder die Schriftarten einer Website ändern? Und wenn Sie irgendwo auf der Website klicken, ändert sich die Position? Diese Änderungen verärgern den Benutzer und führen zu einer schrecklichen Benutzererfahrung.

Cumulative Layout Shift (CLS) ist eine der wichtigen Metriken von Core Web Vitals für WordPress-Websites, die für die Messung der Häufigkeit der Layoutverschiebungen verantwortlich ist, die Benutzer normalerweise auf verschiedenen Websites erleben.

Anzeigen sind häufig für das CLS-Problem verantwortlich, da Anzeigen in mehreren Größen mit nicht spezifizierten Abmessungen geschaltet werden. Ein häufiges Beispiel ist eine Nachrichten-Website, auf der sich der Inhalt des Artikels ändert, die Website wiederholt Anzeigen lädt und Sie beim Lesen den Überblick verlieren.

Hier sind die Google-Scores für den CLS:

  • Gut – Kleiner oder gleich 0,1 Sekunden
  • Muss verbessert werden – Kleiner oder gleich 0,25 Sekunden
  • Arm – Mehr als 0,25 Sekunden.

Google bringt seine beliebten Tools mit, die zur Messung der Core Web Vitals für WordPress-Websites verwendet werden. Mit diesen Tools können Sie Probleme mit der Benutzererfahrung schnell diagnostizieren und beheben. Dies sind zwei Tools zur Messung der Core Web Vitals: Laborwerkzeuge Und Feldwerkzeuge.

Wie Sie im Bild oben sehen können, messen die Tools von Google alle drei Metriken – LCP, FID und CLS – mit Ausnahme von Chrome DevTools und Lighthouse.

Chrome DevTools und Lighthouse verwenden die Gesamtblockierungszeit (TBT) als Alternative zum First Input Delay (FID). Die Gesamtblockierungszeit (TBT) ist eine im Jahr 2020 eingeführte Kennzahl für die Leuchtturmleistung und liefert nur Labordaten. Die FID kann nur mit tatsächlichen Benutzerdaten gemessen werden.

Hier sind die fünf Tools zur Messung der Core Web Vitals auf einer WordPress-Website:

  1. Leuchtturm
  2. PageSpeed-Einblicke
  3. Suchkonsole
  4. Web Vitals-Erweiterung
  5. Web.Dev

So testen Sie Ihren Google Core Web Vitals Score

PageSpeed-Einblicke ist der einfachste Weg, Core Web Vitals für WordPress-Websites zu testen. Es wird nur die URL Ihrer Website benötigt, also geben Sie einfach die ein URL und klicken Sie auf Analysieren Taste.

Sobald das Testtool PageSpeed ​​Insights die URL gründlich analysiert hat, werden die wichtigsten Web-Vitaldaten im Abschnitt „Felddaten“ angezeigt.

Oben zeigen die Felddaten, ob diese Seite die Core Web Vital-Bewertung besteht oder nicht. Sie können alle drei Core Web Vitals mit den Ergebnissen einsehen. Sie müssen die grundlegenden Vitalwerte verbessern und dabei die von Google empfohlenen Werte berücksichtigen:

  • Größter Contentful Paint (LCP) – 2,5 Sekunden
  • Erste Eingabeverzögerung (FID) – Weniger als 100 Millisekunden
  • Kumulative Layoutverschiebung (CLS) – Weniger als 0,1

Entdecken Sie LCP Element mit Pagespeed Insights

Wie bereits erwähnt, misst der Largest Contentful Paint (LCP), wie schnell der Hauptinhalt Ihrer Website für Ihre Benutzer sichtbar ist. Um das LCP zu ermitteln, scrollen Sie im PageSpeed ​​Insights-Tool nach unten zum Abschnitt „Diagnose“ und erweitern Sie die Registerkarte „Größtes Contentful Paint-Element“.

Hier finden Sie das größte von Google erstellte inhaltsreiche HTML-Element.

Ein HTML-Element, das auf dem Desktop vorhanden ist, muss nicht unbedingt auf dem Mobilgerät vorhanden sein. Das HTML-Element in der mobilen Version kann sich von der Desktop-Version unterscheiden, daher müssen Sie die LCP-Zeit für beide Versionen Ihrer Website optimieren.

Entdecken Sie FID und TBT mit Pagespeed Insights

Erinnern? First Input Delay (FID) misst die Zeit zwischen der Benutzerinteraktion und der Ereignisverarbeitung.

Sie können die FID-Zeit nur im Abschnitt „Felddaten“ sehen, da die FID auf tatsächlichen Benutzerdaten basiert. Der PageSpeed ​​Insights-Test ist ein Labortest, weshalb er den FID-Score nicht anzeigen kann. Im Abschnitt „Labordaten“ sehen Sie ein Gesamtblockierungszeit (TBT)eine Alternative zu Erste Eingabeverzögerung (FID).

Die Gesamtblockierungszeit ist direkt proportional zum FID. Je mehr Sie die TBT verbessern, desto besser ist die FID-Zeit.

Entdecken Sie CLS-Elemente mit Pagespeed Insights

Kurze Zusammenfassung: Der Cumulative Layout Shift (CLS) steht im Zusammenhang mit plötzlichen Änderungen im Inhalt der Website während der Website-Suche und beim Laden neuer Inhalte, die sich im Layout der Website bewegen.

Lesen:  Top 6 der besten Remote-Desktop-Software im Jahr 2024

Gehen Sie zum Abschnitt „Große Layoutverschiebungen vermeiden“ im Bereich „Diagnose“ und finden Sie heraus, welches Element die Verschiebung verursacht und sich auf den Site-Score auswirkt.

Wie kann ich die vollständige Website von Google Core Web Vitals anzeigen?

Wenn Sie die Stammseite Ihrer Website überprüfen, können Sie alle Seiten der Core Web Vitals der WordPress-Website anzeigen, indem Sie auf klicken 'Ursprungszusammenfassung anzeigen' Kontrollkästchen.

Um noch detailliertere Berichte über Core Web Vitals für WordPress-Sites zu erhalten, können Sie den Lighthouse-Geschwindigkeitstest nutzen, indem Sie hier klicken Web.dev-MesstoolGeben Sie einfach Ihre URL ein und klicken Sie auf die Schaltfläche „Prüfung ausführen“. Sie erhalten einen detaillierten Prüfbericht der Core Web Vitals für Ihre WordPress-Website.

Eine weitere Möglichkeit, einen Leuchtturm-Geschwindigkeitstest durchzuführen, ist die Verwendung des integrierten Tests im Google Chrome-Browser. Führen Sie Ihre Website in Chrome aus, öffnen Sie das Inspektionselement (klicken Sie mit der rechten Maustaste auf den Bildschirm und wählen Sie dann „Inspizieren“) aus und wählen Sie die Lighthouse-Option für Registerkarten. Klicken Sie anschließend auf 'Bericht generieren' Taste.

So verbessern Sie Ihre wichtigsten Web-Vitals für WordPress

Durch die Übernahme einiger wichtiger Tipps zur Leistungsoptimierung können Sie Ihre Core Web Vitals in WordPress ganz einfach verbessern. Sehen wir uns also die Tipps einzeln an.

Optimieren Sie Ihr WordPress-Hosting

Ihr WordPress-Hosting ist der wichtigste Teil der Leistung Ihrer Website. Sie können die Leistung Ihrer Website auf viele technische und nicht-technische Weise verbessern. Wenn Ihr Hosting jedoch nicht gut ist, lohnen sich Ihre Optimierungstechniken möglicherweise nicht.

Sie müssen alle Ihre Bemühungen auf das Wachstum Ihres Unternehmens konzentrieren und nicht auf die technischen Aspekte des Servers. Sie sollten in gutes WordPress-Hosting investieren, da es Personal und Zeit spart und eine bessere Leistung bietet. Darüber hinaus bietet WordPress-Hosting zahlreiche Funktionen, von denen die wichtigsten sind:

  • Höhere Geschwindigkeiten
  • Serverseitiges Caching
  • Bessere Sicherheit
  • Staging-Sites

DreamHost bietet ein vorinstalliertes Breeze-Cache-Plugin mit Ihrer WordPress-Installation und Varnish-Cache auf der DreamHost-Plattform. Beides hilft Ihnen dabei, bessere Core Web Vitals-Ergebnisse zu erzielen. Schauen Sie sich den DreamHost-Artikel zum WordPress-Hosting an und erfahren Sie, wie Sie eine Ladezeit von 79 ms erreichen können.

Erfahren Sie von den Experten die wichtigsten Web-Vitals

Sehen Sie zu, wie Experten die wichtigsten Web-Vitalwerte analysieren und Ihre Webseiten optimieren, um in den Google-Rankings an der Spitze zu stehen!

Verbesserung des LCP-Scores (Largest Contentful Paint).

Ziel des Nutzers ist es, hilfreiche Inhalte möglichst schnell auf den Bildschirm zu bringen. Je schneller der Inhalt geladen wird, desto höher wäre Ihr LCP-Score. Wie bereits erwähnt, finden Sie das größte Inhaltselement im Abschnitt „Diagnose“ des PageSpeed ​​Insights-Tools. Sie sehen die Elemente, die für den LCP-Score berücksichtigt werden.

Wenn das größte Element Text ist, können Sie den Inhalt verbessern, indem Sie ihn in mehrere Absätze und Titel aufteilen.

Wenn Mediendateien das größte Element im LCP-Score sind, können Sie versuchen, größere Bilder in kleinere zu konvertieren. Es werden Bilder mit kleinerer Dateigröße empfohlen, da das Laden größerer Bilder länger dauert und die Seite größer wird.

Hier sind die Plugins, mit denen Sie Ihre Bilder optimieren können, um eine bessere Bewertung der Core Web Vitals für die WordPress-Website zu erzielen:

  1. EWWW Bildoptimierer
  2. ShortPixel-Bildoptimierer
  3. Imagify – Bilder optimieren und WebP konvertieren
  4. WP Compress – Bildoptimierer [All-In-One]
  5. Smush – Lazy Load Images, Optimieren und Komprimieren von Bildern

Sehen Sie sich unseren Leitfaden zur Optimierung von WordPress-Bildern mit WP Compress an.

Verbesserung des FID-Scores (First Input Delay).

Der wichtigste Tipp, um bessere FID-Werte zu erzielen, ist die Verwendung von verwaltetem WordPress-Hosting, da die meisten verwalteten WordPress-Hosting-Plattformen über integrierte Cache-Einstellungen verfügen, die den Ereignisprozess beschleunigen.

Eine weitere einfache Möglichkeit, den FID-Score zu verbessern, ist die Anwendung der Deferred-JavaScript-Technik auf Ihrer WordPress-Website. Dadurch werden Ihre Webseiten schneller angezeigt, ohne auf das Laden von JavaScript warten zu müssen. Sie können Cache-Plugins verwenden, die die Option „Deferred JavaScript“ bereitstellen.

In dieser Anleitung verwende ich die Breeze Cache-Plugin (ein kostenloses Plugin für alle WordPress-Benutzer). Sobald Sie das Plugin installiert und aktiviert haben, gehen Sie zu WordPress-Einstellungen > Breeze; Auf der Registerkarte „Erweiterte Optionen“ wird Folgendes angezeigt: „JS-Dateien in die Fußzeile verschieben“ Und „JS-Dateien mit verzögertem Laden“ Geben Sie die URL der JS-Datei ein und klicken Sie auf die Schaltfläche „Änderungen speichern“, um Ihre Änderungen zu speichern.

Lesen:  "Gaming in Indien entwickelt sich mittlerweile zu einer Karrieremöglichkeit": Vickram Bedi, Senior Director HP, über die India Gaming Landscape Study 2024 (exklusiv)

Ihre Website muss nicht auf das Laden von JavaScript warten. Dies verbessert den FID-Score (First Input Delay) und trägt dazu bei, die Core Web Vitals für die WordPress-Website zu verbessern.

Verbesserung des CLS-Scores (Cumulative Layout Shift).

Der Cumulative Layout Shift (CLS) steht im Zusammenhang mit plötzlichen Änderungen im Inhalt und dem Verschieben anderer Elemente auf dem Bildschirm.

Zunächst müssen Sie die Elemente überprüfen, die sich auf das CLS auswirken. Zu diesem Zweck gibt es im PageSpeed ​​Insights-Tool einen Abschnitt „Diagnose“, in dem Sie die Elemente finden, die behoben werden müssen, um die Core Web Vitals für WordPress zu verbessern.

Die häufigsten Ursachen für einen schlechten CLS könnten Bilder ohne richtige Größe, eingebettete Videos und Anzeigen sein. Die Lösung besteht also darin, die Größenattribute „Breite“ und „Höhe“ für Ihre Bilder und Videoelemente zu verwenden.

Um die Größenattribute des Bildes zu ermitteln, prüfen Sie das Bild, indem Sie mit der rechten Maustaste auf den Browserbildschirm klicken. Klicken Sie auf die verschiedenen Seitenelemente, um deren Quellcode anzuzeigen und alle Bilder zu überprüfen, ob die Bilder über die richtigen Größenattribute verfügen oder nicht.

Beseitigen Sie Render-blockierende Elemente

Render-Blocking-Elemente sind statische Dateien wie HTML-, CSS- und JavaScript-Dateien, die für den Prozess des Renderns einer Webseite wichtig sind. Diese Dateien verfügen über Skripte, und diese Skripte können Besucher daran hindern, den Inhalt zu sehen.

Das Page Speed ​​Insights-Tool identifiziert Rendering-blockierende Elemente. Normalerweise werden diese Elemente aus den JavaScript- und CSS-Dateien Ihres WordPress-Website-Plugins und Tools von Drittanbietern wie Google Analytics erstellt. Diese Elemente wirken sich auf die gesamten Core Web Vitals für WordPress-Websites aus und wirken sich auch auf die Benutzererfahrung aus.

Im Folgenden finden Sie die Best Practices, um die Anzahl der Render-blockierenden Skripte auf Ihrer Website zu reduzieren:

  • Minimieren Sie Ihr JavaScript und CSS – Entfernen Sie alle Leerzeichen und unnötigen Kommentare.
  • Verketten Sie Ihr JavaScript und CSS – Kombinieren Sie die verschiedenen JavaScript-Dateien in einer Hauptdatei und machen Sie dasselbe mit CSS-Dateien.
  • Verzögern Sie das Laden von JavaScript – Erzwingen Sie, dass JavaScript-Dateien warten, bis alles andere auf der Seite fertig ist.

Hier sind die Plugins, die die Render-Blocking-Elemente beseitigen können:

  1. Breeze von DreamHost
  2. WP Rocket
  3. Automatisch optimieren

Um die Render-blockierenden Elemente zu beseitigen, verwende ich ein Breeze-Plugin. Installieren und aktivieren Sie zunächst das Breeze Cache-Plugin, gehen Sie dann zu den WordPress-Einstellungen und klicken Sie auf Breeze. Auf der Registerkarte „Grundlegende Optionen“ sehen Sie eine Minimierungsoption. Aktivieren Sie die HTML-, CSS- und JavaScript-Minimierung und speichern Sie die Einstellungen. Nachdem ich Änderungen vorgenommen habe, durchlaufe ich erneut die Testphase, um die Verbesserung in Core Web Vitals für WordPress zu überprüfen.

Informationen zum verzögerten Laden von JavaScript finden Sie in der Überschrift „Verbesserung des FID-Scores (First Input Delay)“ oben in diesem Artikel.

Verwenden Sie CDN, um die wichtigsten Web-Vitals für WordPress zu verbessern

Mit CDN kann der Benutzer die Website-Dateien wie Bilder und Skripte von den nächstgelegenen Servern laden. Es hilft auch, die Belastung Ihrer Website zu reduzieren. CDN ist ein Netzwerk von Servern rund um den Globus. Für die Websites stehen zahlreiche CDN-Dienste von Drittanbietern zur Verfügung.

Werfen wir einen Blick auf einige CDN-Drittanbieter:

  1. Cloudflare-CDN
  2. KeyCDN
  3. Amazon CloudFront
  4. CDN77

Wenn Sie ein sind Wolkenwege Als Benutzer können Sie die Partnerschaft von DreamHost mit Cloudflare nutzen und das Cloudflare Enterprise CDN-Add-on aktivieren, das CDN-Funktionen auf Unternehmensebene bietet.

Einpacken!

Wenn es um die Geschwindigkeit von Websites geht, ist es eine Tatsache, dass niemand langsam ladende Websites mag, nicht einmal die Google-Suchmaschine. Mit Hilfe dieses Artikels können Sie die wichtigsten Webvitals für WordPress verstehen und die Leistung Ihrer Website verbessern, indem Sie die gegebenen Tipps befolgen. Wenn Sie weitere Tipps zur Website-Optimierung erfahren möchten, lesen Sie den DreamHost-Artikel mit 23 Tipps zur Beschleunigung einer WordPress-Site für eine bessere Leistung.