Wie man Core Web Vitals für WordPress optimiert (ultimative Anleitung)

Wie man Core Web Vitals für WordPress optimiert (ultimative Anleitung)
Paul Steele

Möchten Sie die wichtigsten Webvitalien für WordPress optimieren?

Core Web Vitals ist eine Initiative von Google, die Website-Betreibern dabei hilft, das Nutzererlebnis und die Qualität ihrer Websites zu verbessern. Diese Signale sind entscheidend für den Erfolg jeder Website.

In dieser Anleitung zeigen wir Ihnen, wie Sie Google Core Web Vitals für WordPress ganz einfach und ohne besondere technische Kenntnisse optimieren können.

Hier ist ein kurzer Überblick über die Themen dieses Leitfadens:

    Was sind Google Core Web Vitals?

    Google Core Web Vitals sind eine Reihe von Website-Performance-Metriken, die Google als wichtig für die allgemeine Nutzererfahrung einer Website erachtet. Diese Web-Vital-Bewertungen sind Teil der Google-Gesamtwertung für die Seitenerfahrung, die sich auf Ihre SEO-Rankings auswirkt.

    Die Wahrheit ist, dass niemand eine langsam ladende Website mag, auch Google nicht.

    Selbst wenn Ihre Website schnell geladen wird, kann es sein, dass sie für die Nutzer nicht voll funktionsfähig ist, um das zu tun, was sie tun wollen, oder um auf die Informationen zuzugreifen, die sie benötigen.

    Core Web Vitals hilft Ihnen zu messen, wie schnell Ihre Website lädt, wie schnell sie sichtbar wird und wie schnell sie für Ihre Nutzer bereit ist.

    Zu diesem Zweck verwendet Google drei Qualitätstests:

    • Größte inhaltsreiche Farbe (LCP)
    • Erste Eingabeverzögerung (FID)
    • Kumulative Layout-Verschiebung (CLS)

    Die Namen dieser Tests mögen zu technisch klingen, aber was sie bewirken, ist leicht zu verstehen.

    Sehen wir uns an, wie die einzelnen Core Web Vitals Tests funktionieren, was sie messen und wie Sie Ihr Ergebnis verbessern können.

    Größte inhaltsreiche Farbe (LCP )

    Largest Contentful Paint (LCP) prüft, wie schnell der Hauptinhalt (ob es sich um ein Bild, einen Artikel oder eine Beschreibung handelt) für die Nutzer sichtbar wird.

    So kann Ihre Website beispielsweise schnell geladen werden, aber der größte Inhalt erscheint nicht so schnell auf dem Bildschirm wie der Rest der Seite.

    Andere Geschwindigkeitstests geben Ihnen eine hohe Punktzahl, aber aus der Sicht des Benutzers ist die Seite immer noch langsam.

    Aus diesem Grund misst Google den LCP als Teil seines Web-Vital-Scores, so dass Website-Besitzer ein klareres Bild davon bekommen können.

    Erste Eingabeverzögerung (FID)

    Die erste Eingabeverzögerung (First Input Delay, FID) misst die Zeit, die der Browser eines Benutzers benötigt, um mit der Verarbeitung von Ereignis-Handlern als Reaktion auf eine Benutzerinteraktion zu beginnen.

    Im Klartext: Nehmen wir an, ein Benutzer befindet sich auf Ihrer Kontaktformularseite, füllt das Formular aus und klickt auf die Schaltfläche Absenden. FID misst, wie schnell Ihre Website diese Interaktion verarbeitet.

    Ein noch einfacheres Beispiel wäre die Zeit zwischen dem Anklicken eines Links und dem Zeitpunkt, an dem der Browser mit der Verarbeitung der nächsten Abfolge von Ereignissen beginnt.

    Kumulative Layout-Verschiebung (CLS)

    Die kumulative Layoutverschiebung (CLS) misst die Zeit, die eine Website benötigt, um visuell stabil zu werden.

    Wenn eine Website geladen wird, benötigen einige Elemente mehr Zeit als andere. Während dieser Zeit kann sich der Inhalt Ihrer Website auf dem Bildschirm weiterbewegen.

    Wenn ein Nutzer beispielsweise auf einem mobilen Gerät einen Absatz liest und darüber eine Videoeinbettung geladen wird, wird der gesamte Inhalt nach unten verschoben.

    Dies kann sehr frustrierend sein, wenn ein Benutzer versucht, eine Aktion durchzuführen, z. B. ein Produkt in den Einkaufswagen zu legen, und sich die Schaltfläche nach unten verschiebt, weil sich andere Elemente auf der Seite bewegen.

    Video-Anleitung

    Abonnieren

    Wenn Sie eine schriftliche Anleitung bevorzugen, lesen Sie einfach weiter.

    So testen Sie Ihren Google Core Web Vitals Score

    Der einfachste Weg, Ihren Google Core Web Vitals Score zu testen, ist die Verwendung des Page Speed Insights-Tools. Geben Sie einfach die URL ein, die Sie testen möchten, und klicken Sie auf die Schaltfläche "Analysieren".

    Die wichtigsten Ergebnisse werden unter dem Abschnitt "Felddaten" angezeigt.

    Der Einfachheit halber wird oben eine Meldung angezeigt, die besagt: "[...] die Felddaten zeigen, dass diese Seite die Core Web Vitals-Bewertung besteht".

    In der nachstehenden Tabelle sehen Sie die tatsächliche Punktzahl für alle drei Core Vitals, d. h. die Punktzahl, die Sie erreichen müssen, um die Core Web Vitals-Tests für jedes Element zu bestehen.

    • Größtes gehaltvolles Bild (LCP): 2,5 Sekunden
    • First Input Delay (FID): weniger als 100 Millisekunden
    • Kumulative Layout-Verschiebung (CLS): weniger als 0,1

    Wie zeigt man Google Core Web Vitals für eine komplette Website an?

    Mit dem Page Speed Insights-Tool können Sie nun eine einzelne Seite überprüfen. Wenn es sich bei der zu überprüfenden Seite um das Stammverzeichnis Ihres Domainnamens handelt, können Sie auch auf die Checkbox "Show Origin Summary" klicken.

    Dies zeigt Ihnen die Punktzahl für alle Seiten, die von diesem Ursprung aus bedient werden.

    Um jedoch wirklich in die Tiefe zu gehen, können Sie auch auf den Core Web Vitals-Bericht in Ihrem Google Search Console Dashboard zugreifen.

    So können Sie sehen, wie viele URLs auf Ihrer Website die Tests bestanden haben, welche URLs verbessert werden müssen und welche Seiten schlecht abschneiden.

    Um noch detailliertere Berichte für Core Web Vitals zu erhalten, können Sie den Lighthouse-Geschwindigkeitstest verwenden, indem Sie das Web.dev Measure-Tool aufrufen oder den integrierten Test im Chrome-Browser verwenden.

    Öffnen Sie einfach eine Website in Chrome, klicken Sie mit der rechten Maustaste auf eine beliebige Stelle des Bildschirms und wählen Sie dann die Option Untersuchen.

    Klicken Sie anschließend auf die Schaltfläche Bericht generieren.

    Anmerkung: Sie müssen den Chrome-Test im Inkognito-Modus durchführen, um die genauesten Ergebnisse zu erhalten, da sonst Ihre Browser-Erweiterungen den angezeigten Kernwert für Webvitalität negativ beeinflussen können.

    Warum sind Core Web Vitals wichtig?

    Core Web Vitals sind wichtig, weil sie die Leistung Ihrer Website für die Nutzer widerspiegeln. Es geht nicht nur darum, wie schnell eine Website lädt, sondern auch darum, wie schnell die Nutzer sie tatsächlich nutzen können.

    Laut einer aktuellen Studie kann eine Verzögerung von 1 Sekunde bei der Seitenladezeit zu einem Verlust von 7 % bei den Konversionen, 11 % bei den Seitenaufrufen und 16 % bei der Kundenzufriedenheit führen.

    Deshalb ist es wichtig, Ihre Website auf Geschwindigkeit und Leistung zu optimieren. Die meisten Tools zur Leistungsmessung berücksichtigen jedoch nicht wirklich die Qualität der Benutzererfahrung.

    Eine schnellere Website mit schlechtem Benutzererlebnis kostet Sie immer noch Konversionen, weniger Seitenaufrufe und eine geringere Kundenzufriedenheit. Die Verbesserung von Core Web Vitals hilft Ihnen, das zu ändern.

    Auch die Nutzererfahrung ist ein wichtiger Faktor für das SEO-Ranking: Seit Mai 2021 zählt die Seitenerfahrung zu den Ranking-Faktoren im Google-Suchalgorithmus.

    Sehen wir uns also an, wie Sie Ihre Core Web Vitals leicht verbessern können, um eine bessere Nutzererfahrung auf Ihrer Website zu bieten.

    Verbessern Sie Ihre wichtigsten Web-Vitaldaten in WordPress (7 Tipps)

    Es ist gar nicht so schwer, den Core Web Vitals-Score in WordPress zu verbessern. Mit ein paar grundlegenden Tipps zur Leistungsoptimierung können Sie den Core Web Vitals-Score leicht übertreffen.

    1. die Optimierung Ihres WordPress-Hostings

    Ihr WordPress-Hosting-Unternehmen spielt die wichtigste Rolle für die Leistung Ihrer Website.

    Sie sind in der Lage, ihre Server für WordPress zu optimieren, was Ihrer Website eine felsenfeste Plattform bietet, auf der sie aufbauen kann.

    Für eine leistungsstarke Website empfehlen wir SiteGround, einen der offiziell empfohlenen WordPress-Hosting-Anbieter, den wir für unsere Website nutzen.

    Um Ihrer Website den nötigen Leistungsschub zu geben, verwendet SiteGround die Google Cloud Platform für seine Server zusammen mit ultraschnellem PHP.

    Das SG Optimizer Plugin, das von über einer Million Websites genutzt wird, nimmt automatisch weitere Leistungsverbesserungen vor und schaltet das integrierte Caching ein, das alles tut, was WP Rocket tut, und noch mehr.

    Es ist wichtig anzumerken, dass das SG Optimizer-Plugin nur auf SiteGround-Hosting-Accounts funktioniert, und diese Leistungsoptimierungen sind für alle Tarife verfügbar, einschließlich der niedrigsten Option.

    Wenn Sie einen anderen WordPress-Hosting-Anbieter verwenden, empfehlen wir Ihnen, WP Rocket zusammen mit einigen anderen Tools zu verwenden, um eine bessere Core Web Vitals-Bewertung zu erzielen.

    WP Rocket ist das beste WordPress-Caching-Plugin auf dem Markt, mit dem Sie ganz einfach Caching auf Ihrer WordPress-Website einrichten können, ohne sich mit den technischen Details der Serververwaltung auseinandersetzen zu müssen.

    2. die Verbesserung der LCP-Punktzahl (Largest Content Paintful)

    Wie bereits erwähnt, ist der Largest Content Paintful (LCP) buchstäblich der größte Inhaltsteil innerhalb des Ansichtsfensters einer Seite, z. B. bei einem Blogbeitrag das Hauptbild oder der Artikeltext.

    Je schneller dieser Inhalt geladen wird, desto höher ist Ihre LCP-Punktzahl.

    Woher wissen Sie, welcher Inhalt bei dem Test als der größte angesehen wird? Nun, Sie müssen zu den Testergebnissen nach unten scrollen und die Registerkarte "Größtes inhaltsreiches Malerelement" ausklappen.

    Sie sehen die Elemente, die für die LCP-Bewertung berücksichtigt werden. Wenn es sich um ein größeres Bild handelt, können Sie versuchen, es durch ein kleineres Bild oder ein Bild mit einer geringeren Dateigröße und Qualität zu ersetzen. Siehe unseren Leitfaden zur Optimierung von Bildern für die Web-Performance.

    Wenn es sich um Text handelt, können Sie versuchen, ihn in Absätze und Überschriften zu unterteilen.

    3. die Verbesserung des First Input Delay (FID) Score

    Der Wert für die erste Eingabeverzögerung misst die Zeit, die vergeht, bis ein Nutzer auf etwas auf Ihrer Website klickt und sein Browser beginnt, Elemente zu verarbeiten.

    Der wichtigste Tipp, um das zu verbessern, ist die Verwendung eines besseren Webhostings oder sogar einer verwalteten WordPress-Hosting-Plattform.

    Eine weitere einfache Möglichkeit, den FID-Score zu verbessern, ist die Verwendung eines Caching-Plugins wie WP Rocket, das über eine integrierte Funktion verfügt, mit der Sie die Bereitstellung von Dateien optimieren können.

    Zuerst müssen Sie das WP Rocket-Plugin installieren und aktivieren. Weitere Einzelheiten finden Sie in unserer Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.

    Danach gehen Sie zu Einstellungen " WP Rocket und wechseln Sie zur Registerkarte Datei-Optimierung.

    Scrollen Sie zum unteren Ende der Seite und aktivieren Sie das Kästchen neben der Option "JavaScript zeitversetzt laden".

    Vergessen Sie nicht, auf die Schaltfläche "Änderungen speichern" zu klicken, um Ihre Änderungen zu speichern.

    Durch das Zurückstellen von JavaScript kann Ihre Website geladen werden, ohne dass auf das Laden von JavaScript gewartet werden muss. Dies verbessert den First Input Delay (FID) Score für Seiten, bei denen JavaScript die Ursache sein könnte.

    4. die Verbesserung der kumulativen Layout-Verschiebung (CLS)

    Der Wert für die kumulative Layoutverschiebung (CLS) wird beeinflusst, wenn verschiedene Elemente auf einer Webseite langsam laden und andere Elemente auf dem Bildschirm verschieben.

    Sie können sehen, welche Elemente sich auf den CLS-Wert auswirken, indem Sie die Registerkarte "Große Layoutverschiebungen vermeiden" in den Page Speed Insights-Ergebnissen erweitern.

    Dies zeigt Ihnen die Elemente, die beim Laden der Seite die größten Auswirkungen auf das Layout haben.

    Um sicherzustellen, dass sich das visuelle Layout Ihrer Seite nicht verschiebt, wenn andere Elemente geladen werden, müssen Sie den Browsern die Abmessungen (Breite und Höhe) von Elementen wie Bildern, Videoeinbettungen, Anzeigen wie Google AdSense und anderen mitteilen.

    WordPress fügt den von Ihnen hinzugefügten Bildern automatisch Höhen- und Breitenattribute hinzu. Sie können jedoch auch alle anderen Medien, insbesondere eingebettete, überprüfen, um sicherzustellen, dass sie alle Höhen- und Breitenattribute haben.

    Klicken Sie einfach mit der rechten Maustaste in Ihren Browser und wählen Sie "Inspect", um die Entwicklerkonsole zu öffnen.

    Sie können dann auf verschiedene Seitenelemente zeigen und klicken, um deren Quellcode zu markieren. Dort können Sie sehen, ob für das Element Breiten- und Höhenattribute definiert sind.

    5. die Beseitigung von Rendering-blockierenden Elementen

    Renderblockierende Elemente sind die Elemente, die langsamer laden, aber andere Elemente daran hindern, zuerst zu laden. Dies wirkt sich auf die Gesamtbewertung von Core Web Vitals und die Benutzerfreundlichkeit Ihrer Website aus.

    Die Ergebnisse von Page Speed Insights zeigen Ihnen die Elemente, die das Rendern blockieren. Das sind in der Regel JavaScript- oder CSS-Dateien, die von Ihren WordPress-Plugins hinzugefügt wurden, sowie Tools von Drittanbietern wie Google Analytics, Facebook Pixel, Google Ads und andere.

    Die meisten dieser Elemente werden jedoch von verschiedenen Plugins oder Themes programmatisch zu Ihrer Website hinzugefügt, was es für einen Anfänger schwieriger macht, sie zu entfernen oder richtig zu laden.

    Wir haben eine Schritt-für-Schritt-Anleitung, wie Sie Rendering-Blocking-Elemente in WordPress ganz einfach beseitigen können, ohne in den Code Ihrer Website einzugreifen.

    6. die richtige Größe von Bildern in WordPress

    Eine weitere häufige Ursache für niedrigere Core Web Vitals-Werte sind sehr große Bilder. Viele WordPress-Nutzer laden hochauflösende Bilder auf ihre Websites hoch, die länger zum Laden brauchen und in den meisten Fällen nicht notwendig sind.

    Noch problematischer wird dies für Nutzer auf mobilen Geräten: Ihr responsives WordPress-Theme und WordPress passen das Bild automatisch an den Bildschirm des Nutzers an, aber sie würden trotzdem eine größere Datei laden.

    Wir haben einen detaillierten Leitfaden, wie Sie Bilder für Ihre WordPress-Website richtig optimieren können, ohne Qualitätsverluste oder Leistungseinbußen.

    7. die Verwendung eines CDN für Server zur Verbesserung Ihres Core Web Vitals Score

    CDNs oder Content-Delivery-Networks sind Dienste von Drittanbietern, die es Ihnen ermöglichen, statische Inhalte Ihrer Website von mehreren Servern rund um den Globus bereitzustellen.

    Dies ermöglicht es den Nutzern, statische Dateien wie Bilder und CSS von Servern herunterzuladen, die sich in ihrer Nähe befinden, und entlastet Ihre Website, die dann andere Elemente laden kann.

    Sie können eine Cloud-Firewall-App wie Sucuri verwenden, die über einen integrierten CDN-Dienst verfügt. Sucuri hilft Ihnen auch, bösartige und Spam-Anfragen zu blockieren, was die Ressourcen Ihrer Website weiter entlastet.

    Als Alternative können Sie auch das kostenlose CDN von Cloudflare nutzen, das einen grundlegenden Firewall-Schutz und einen CDN-Service bietet, der den Core Web Vitals-Score Ihrer Website verbessern würde.

    Wir hoffen, dass dieser Leitfaden Ihnen geholfen hat, Core Web Vitals für WordPress zu optimieren. Ein weiterer wichtiger Aspekt einer guten Benutzererfahrung ist die Sicherheit. Wir empfehlen Ihnen, unsere WordPress-Sicherheitscheckliste zu befolgen, um sicherzustellen, dass die Leistung Ihrer Website nicht durch Spam oder DDoS-Angriffe beeinträchtigt wird.

    Vielleicht interessiert Sie auch unser Vergleich der besten Videobearbeitungssoftware und der besten Webinar-Plattformen, um leistungsoptimierte Medieninhalte zu erstellen, die die Geschwindigkeit Ihrer Website nicht verlangsamen.

    Wenn Ihnen dieser Artikel gefallen hat, dann abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Videotutorials. Sie können uns auch auf Twitter und Facebook finden.




    Paul Steele
    Paul Steele
    Als Gründer der erfolgreichen Online-Marketing-Agentur unterstützt Paul Steele seit über einem Jahrzehnt Unternehmen jeder Größe beim Aufbau einer starken Online-Präsenz. Sein Fachwissen umfasst alles von Suchmaschinenoptimierung bis hin zu Social-Media-Marketing, aber seine wahre Leidenschaft liegt darin, Anfängern dabei zu helfen, das Innenleben von WordPress zu verstehen. Mit seinem Talent, komplizierte Konzepte in leicht verständliche Schritte zu zerlegen, ist Pauls Anfängerleitfaden für WordPress zu einer unverzichtbaren Ressource für neue Website-Besitzer, Blogger und Unternehmer geworden, die die Kontrolle über ihre Online-Präsenz übernehmen möchten. Egal, ob Sie Ihre Website für Suchmaschinen optimieren, das Erscheinungsbild Ihrer Website anpassen oder einfach nur durch die WordPress-Benutzeroberfläche navigieren möchten, Pauls freundliche und zugängliche Herangehensweise sorgt dafür, dass sich der Prozess weniger einschüchternd und überschaubarer anfühlt. Als begeisterter Blogger und erfahrener digitaler Vermarkter teilt Paul sein Wissen und seine Erkenntnisse auch zu anderen Themen im Zusammenhang mit Online-Marketing und hilft seinen Lesern, über die neuesten Trends und Best Practices in der Branche auf dem Laufenden zu bleiben.