Tipps zur Verbesserung der Core Web Vitals Ihrer WordPress-Website

Google hat eine Möglichkeit, sowohl bei Webdesignern als auch bei Website-Eigentümern eine Welle der Panik auszulösen. Wenn sie ihren Suchalgorithmus ändern, fangen die Leute an, aufzuholen. Es ist leicht zu verstehen, warum. Niemand möchte, dass seine SEO-Rankings darunter leiden.

Als die Core Web Vitals-Metriken bekannt gegeben wurden, war die Reaktion also ziemlich vorhersehbar. Da diese Änderungen auf der Leistung der Website basieren, haben wir uns darauf konzentriert, sicherzustellen, dass die Ladezeiten blitzschnell sind.

Aber es ist nicht immer einfach. Websites, auf denen ein Content-Management-System (CMS) wie WordPress ausgeführt wird, können eine besondere Herausforderung darstellen. Es spielen viele Faktoren eine Rolle. Daher erfordert die Verbesserung der Leistung einen mehrgleisigen Ansatz.

Wo soll man anfangen? Sehen Sie sich unseren Leitfaden zur Steigerung des Core Web Vitals-Scores Ihrer WordPress-Website an.

Caching implementieren

Eine der einfachsten Möglichkeiten, die Geschwindigkeit einer WordPress-Website zu erhöhen, ist die Implementierung von Caching. In vielen Fällen wird eine zuvor träge Website mit diesem einzigen Schritt deutlich schneller. Dies gilt auch für relativ günstiges Hosting.

Standardmäßig müssen WordPress-Seiten und -Beiträge Inhalte und Einstellungen aus der Datenbank der Website abrufen. Das braucht Zeit. Cache hingegen stellt Inhalte als statische HTML-Dateien bereit und macht einen Datenbankaufruf überflüssig. Wenn der Mittelsmann (dh die Datenbank) aus dem Weg geräumt ist, werden schnellere Ladezeiten folgen.

Einige Hosting-Pakete, insbesondere verwaltetes WordPress-Hosting, enthalten einen serverbasierten Cache. Dies ist oft die beste Option, da es sehr wenig von Webdesignern verlangt und recht gut funktioniert. Es kann sein, dass es von Zeit zu Zeit gelöscht werden muss. Ansonsten ist es eine praktische Erfahrung. Und es kann effektiv mit einem Plugin kombiniert werden, um die Geschwindigkeit weiter zu erhöhen.

Auch wenn Ihr Host kein Caching auf Serverebene bietet, können Sie die Leistung dennoch über ein Plugin optimieren. Caching-Plugins variieren in Umfang, Komplexität und Preisgestaltung. Aber sie liefern greifbare Ergebnisse, wenn es um die Verbesserung der Ladezeiten geht. Das wiederum ist auch ein positiver Schub für Core Web Vitals.

Verzögern Sie das Laden von Render-Blocking-Skripten und -Stilen

Wenn Sie die Leistung Ihrer Website in Google PageSpeed ​​Insights testen, scheint das Thema Render-Blocking-Ressourcen häufig aufzutauchen. Dies sind die Skripte und Stile, die nicht als „kritisch“ betrachtet werden – was bedeutet, dass sie nicht erforderlich sind, um den Seiteninhalt „above the fold“ zu rendern.

Diese Ressourcen können schnelleren Ladezeiten im Wege stehen. Insbesondere wirken sie sich auf die Punktzahl „Largest Contentful Paint (LCP)“ in Core Web Vitals aus. Dies ist die Zeit, die zum Laden des Hauptinhaltsbereichs einer Seite benötigt wird. Die Reduzierung von LCP ist, nun ja, lebenswichtig.

Eine Möglichkeit, die Situation zu verbessern, besteht darin, das Laden verschiedener Inhaltselemente (Bilder, Videos, Text auf Blockebene) zu verzögern (oder aufzuschieben). Dadurch wird sichergestellt, dass nur die benötigten Skripte und Stile zuerst geladen werden, während alles andere erst danach kommt.

Neben der Minimierung enthalten viele WordPress-Caching-/Optimierungs-Plugins auch diese Art von Funktionalität. Es kann jedoch ein wenig Experimentieren erfordern, da das Zurückstellen der falschen Ressource problematisch sein kann.

Testen Sie alle Änderungen, die Sie vorgenommen haben, und überprüfen Sie die Browserkonsole auf Fehler. Sobald Sie die richtige Konfiguration gefunden haben, sollte die Anzahl der Render-Blocking-Ressourcen auf Ihrer Seite erheblich reduziert werden.

Bilder optimieren

Die weit verbreitete Verwendung von großen Hero-Bildern und komplexen Schiebereglern trägt nur zu der Herausforderung der Leistungsoptimierung bei. Diese Assets sehen zwar gut aus, können sich aber leicht zu Daten im Megabyte-Wert summieren. Das bringt Ihnen keine bestandene Note für Core Web Vitals – besonders auf Mobilgeräten.

Zum Glück gibt es ein paar Möglichkeiten, die Last zu verringern. Entfernen Sie in erster Linie alle Bilder, die Sie für unnötig halten. Das Entfernen von sogar einem großen Bild kann einen Unterschied machen.

Der Rest Ihrer Bilder kann optimiert werden. Dadurch wird ihre Dateigröße reduziert und die Auswirkungen auf die Ladezeit verringert.

Wie Sie bei der Bildoptimierung vorgehen, bleibt Ihnen überlassen. Sie könnten eine Kopie Ihrer schlimmsten Übeltäter herunterladen und sie mit Ihrem bevorzugten Bildbearbeitungsprogramm komprimieren und dann wieder auf Ihre Website hochladen. Oder Sie können den Prozess mit einem hilfreichen WordPress-Medien-Plugin automatisieren.

Responsive Bilder

Für mobile Benutzer bietet WordPress die Möglichkeit, responsive Bilder über srcset . Tatsächlich erledigt es automatisch die Drecksarbeit für Bilder, die in Ihren Inhalten platziert werden. Dies ist unglaublich wertvoll, da es verhindert, dass riesige Medien in Desktop-Größe die mobile Benutzererfahrung verlangsamen. Für Bilder außerhalb des Hauptinhaltsbereichs müssen Sie möglicherweise einige Anpassungen vornehmen, um diese Funktion zu implementieren.

Moderne Bildformate

Es lohnt sich auch, einen Blick auf die von Ihnen verwendeten Dateiformate zu werfen. Beispielsweise kann das WebP-Format von Google häufig die Dateigröße reduzieren, während die Bildqualität erhalten bleibt. Beachten Sie, dass einige neumodische Formate in älteren Browsern (ähem, IE) nicht unterstützt werden, sodass möglicherweise Fallback-Versionen erforderlich sind. Plugins können auch dabei helfen.

Lazy Load All die Dinge

Die Lazy-Load-Funktion lädt Elemente erst, wenn sie sich im Darstellungsbereich des Browsers befinden. Indem Sie das Laden von Bildern, Iframes und anderen Inhalten von Drittanbietern (z. B. Social-Media-Widgets) verzögern, können Sie Ressourcen auf die Elemente konzentrieren, die Benutzer zuerst sehen.

WordPress implementiert bereits natives, browserbasiertes Lazy Loading für Bilder. Wenn Sie einer Seite oder einem Beitrag ein Bild hinzufügen, wird das loading="lazy" -Attribut innerhalb des <img> -Tags platziert. Das heißt, vorausgesetzt, das Bild enthält Höhen- und Breitenattribute.

Das ist großartig – aber was ist mit anderen Elementen wie Videos oder Iframes? Diese Elemente können eine Seite auch belasten, wenn sie von Anfang an geladen werden.

Iframes werden jetzt standardmäßig lazy-loaded – also keine Sorge. Einige komplexere Elemente erfordern möglicherweise benutzerdefinierten Code oder ein Plugin, um diese Funktionalität zu implementieren.

Räumen Sie die Unordnung auf

Mit der Zeit kann selbst eine gut gepflegte WordPress-Seite unübersichtlich werden. Eine verstopfte Datenbank, ungenutzte Plugins, die noch aktiv sind, ein aufgeblähtes Theme mit Funktionen, die Sie nicht verwenden – das passiert. Und es kann auch Ihre Core Web Vitals herunterziehen.

Deshalb ist es wichtig, hin und wieder aufzuräumen. Die Datenbank Ihrer Website kann manuell optimiert oder regelmäßig optimiert werden. Nicht verwendete Plugins können deaktiviert und gelöscht werden. Themen können schlanker gemacht oder durch etwas Besseres ersetzt werden.

Untersuchen Sie, was Ihre Website verlangsamt, finden Sie die Übeltäter und gehen Sie mit ihnen um. Sie werden überrascht sein, wie viel Unterschied dies machen kann.

Verbessern Sie die Kern-Web-Vitals Ihrer Website

Core Web Vitals verkompliziert den ohnehin schon kniffligen Prozess der Optimierung der Leistung von WordPress-Websites. Selbst eine Website, die in anderen Leistungskennzahlen gut abschneidet, kann in diesem Bereich immer noch zu kurz kommen. Dies zeigt sich vor allem im mobilen Testen.

Die gute Nachricht ist, dass es viele kleine Dinge gibt, die Designer tun können, um aufzuholen. Die Implementierung von Cache bildet eine hervorragende Grundlage und sorgt für einen sofortigen Schub. Von dort aus geht es darum, die Dateigröße zu reduzieren und Stile und Skripte in der Reihenfolge ihrer Wichtigkeit zu laden.

Um noch weiter zu gehen, ist es auch sinnvoll, das CSS Ihrer Website unter Berücksichtigung von Core Web Vitals anzupassen. Dies kann beim gefürchteten CLS-Score (Cumulative Layout Shift) helfen und das Aufblähen reduzieren.

Im Allgemeinen sind die Dinge, die gut für die Leistung sind, auch gut für Core Web Vitals. Die Ergebnisse können sich ziemlich schnell verbessern. Seien Sie sich bewusst, dass es einige Versuche und Irrtümer erfordern wird, um einige dieser individuellen Mängel zu beseitigen.

Das übergeordnete Ziel ist sicherzustellen, dass nur das Wesentliche geladen wird, wenn ein Benutzer Ihre Website besucht. Dies wird sowohl Besucher als auch Google sehr glücklich machen.