12. Tipps zur Optimierung der Geschwindigkeit der WordPress Webseite

Willst du deine WordPress-Website beschleunigen? Diese Tipps sorgen für blitzschnelle Ladezeiten und ein besseres Nutzererlebnis. Die Bedeutung der Website-Geschwindigkeit – Optimiere Deine WordPress-Website jetzt, denn die Geschwindigkeit und Ladezeiten Deiner Website beeinflussen das Nutzererlebnis Deiner Besucher.

Bring deine WordPress-Website auf Trab: Tipps zur Optimierung der Geschwindigkeit

Im heutigen digitalen Zeitalter ist die Geschwindigkeit einer Website ein wichtiger Aspekt für den Online-Erfolg. Da die Nutzerinnen und Nutzer immer schnellere Ladezeiten fordern und die Suchmaschinen Websites mit besserem Nutzererlebnis bevorzugen, ist die Website-Geschwindigkeit zu einem entscheidenden Faktor für den Erfolg jeder Online-Plattform geworden. Das gilt besonders für WordPress-Websites, die mit verschiedenen Themes, Plugins und Webhostern erstellt werden, die die Auslieferungsgeschwindigkeit erheblich beeinflussen können.

Die Optimierung der Geschwindigkeit einer WordPress-Website kann eine schwierige Aufgabe sein, ist aber unerlässlich, um das Nutzererlebnis zu verbessern, die Konversionsrate zu erhöhen und das Suchmaschinenranking zu verbessern. In diesem Artikel geben wir dir Tipps und Strategien an die Hand, mit denen du die Geschwindigkeit deiner WordPress-Website erhöhen und sicherstellen kannst, dass du die Anforderungen der Core Web Vitals und des Page Experience Updates von Google erfüllst.

Von der Optimierung von Bildern bis zum Einsatz von Caching-Plugins erfahren wir alles, was du über die Optimierung der Geschwindigkeit deiner WordPress-Website wissen musst. Egal, ob du ein Anfänger oder ein erfahrener Webentwickler bist, dieser Artikel wird dir das nötige Wissen vermitteln, um die Geschwindigkeit deiner Website zu optimieren und der Konkurrenz voraus zu sein.

Das Wichtigste in Kürze

• Die Geschwindigkeit einer Website ist entscheidend für die Auslieferung und das Ranking, und die wichtigsten Webvitalien sind wichtige Metriken, die du berücksichtigen solltest.
• Google Pagespeed Insights ist ein umfassendes Tool zur Analyse der Website-Geschwindigkeit und bietet Optimierungsmöglichkeiten.
• Die mobile Geschwindigkeit ist eine Priorität für das Algorithmus-Update von Google. Zu den praktischen Tipps gehören die Optimierung von leeren Seiten, die Reduzierung von Plugins und die Verwendung eines Caching-Plugins und CDN.
• Die Optimierung von Bildern ist wichtig, und Litespeed Server und WP Rocket sind empfehlenswerte Tools zur Geschwindigkeitsoptimierung. Testen ist auch notwendig, um die Leistung zu bestimmen.

Wichtigkeit der Website-Geschwindigkeit

Die Bedeutung der Website-Geschwindigkeit kann gar nicht hoch genug eingeschätzt werden, da sie sich negativ auf die Auslieferung und das Ranking einer Website auswirken kann. Eine langsame Website-Geschwindigkeit kann auf Faktoren wie Themes, Plugins und den Webhoster zurückgeführt werden, die alle die Leistung der Website beeinflussen können.

Außerdem spielen laut Core Web Vitals Metriken wie Largest Contentful Paint, Total Blocking Time und Cumulative Layout Shift eine entscheidende Rolle für das Website-Ranking.

Das Website-Ranking ist ein wichtiger Aspekt der Website-Optimierung, da es die Sichtbarkeit und Erreichbarkeit der Website für die Nutzer/innen bestimmen kann. Die Core Web Vitals, die Metriken wie Ladegeschwindigkeit, Interaktivität und visuelle Stabilität umfassen, sind ein wesentlicher Faktor im Google-Algorithmus, der das Ranking einer Website bestimmt.

Daher ist die Optimierung der Website-Geschwindigkeit entscheidend, um die Platzierung der Website zu verbessern und den Nutzern ein reibungsloses Erlebnis zu bieten.

Optimierung der WordPress-Website

Die Optimierung einer WordPress-Website umfasst mehrere Schritte. Dazu gehören die Reduzierung unnötigen Codes, die Minimierung von Seitenelementen, die auf Drittanbieterquellen angewiesen sind, die Optimierung von Bildern, die Verwendung von Caching- und Speed-Performance-Plugins und die Implementierung eines CDN.

Die Optimierung von Bildern ist ein wichtiger Aspekt bei der Optimierung der Website-Geschwindigkeit. Es wird empfohlen, die Größe der Bilder unter 200 KB zu halten und die empfohlene Web-Bildgröße zu verwenden, um die Geschwindigkeit der Website zu verbessern. Beliebte Plugins zur Bildoptimierung wie Imagify und ShortPixel können Bilder ohne Qualitätsverlust komprimieren.

Die Bereitstellung von Bildern im WebP-Format kann ebenfalls dazu beitragen, die Bildgröße zu reduzieren und die Geschwindigkeit der Website zu verbessern. Der Litespeed-Server ist ein weiteres Tool, mit dem du die Geschwindigkeit deiner Website erhöhen kannst. Er ist schneller als NGINX und reduziert die Anzahl der verwendeten Plugins.

Litespeed hat auch einen eigenen CDN-Dienst namens Quic Cloud, der dabei helfen kann, Inhalte schneller an die Nutzer zu liefern. Der Einsatz von Litespeed-Servern und Quic Cloud kann dazu beitragen, die Geschwindigkeit der Website zu verbessern und ein besseres Nutzererlebnis zu schaffen.

Geschwindigkeit testen und überwachen

Das Testen und Überwachen der Website-Geschwindigkeit ist ein wichtiger Schritt, um eine optimale Website-Leistung zu gewährleisten. Bei der Analyse der Website-Leistung wird die Ladegeschwindigkeit der Website gemessen, die Ursachen für langsame Ladezeiten ermittelt und die notwendigen Optimierungen zur Verbesserung der Geschwindigkeit vorgenommen.

Dieser Prozess ist sehr wichtig, denn eine schnellere Website verbessert nachweislich das Nutzererlebnis und kann zu höheren Umsätzen und Einnahmen führen. Für die Analyse der Website-Leistung können Geschwindigkeitstools wie GTmetrix, Pingdom und Google Pagespeed Insights verwendet werden.

Diese Tools liefern detaillierte Berichte über die Geschwindigkeit der Website, einschließlich Informationen über die Ladezeiten der Seiten, die Antwortzeiten des Servers und Empfehlungen zur Optimierung. Darüber hinaus sollten Website-Betreiber/innen die Geschwindigkeit ihrer Website regelmäßig überwachen, um eine optimale Leistung sicherzustellen und mögliche Probleme zu erkennen.

Durch regelmäßiges Testen und Überwachen der Website-Geschwindigkeit können Website-Betreiber sicherstellen, dass ihre Website optimal funktioniert und ein optimales Nutzererlebnis bietet.

Häufig gestellte Fragen

Wie kannst du die Geschwindigkeit deiner WordPress-Website verbessern?

Wusstest du, dass jede WordPress-Website mit einem Theme und einer Reihe von Plugins ausgeliefert wird und dass jedes Theme und jedes Plugin eine Reihe von Codes auf die Seite(n) geladen hat, damit die Funktionen funktionieren. Je mehr Codes also auf eine Seite geladen werden, desto langsamer wird die Website. Das ist unvermeidlich. Außerdem werden alle Websites auf einem Webhoster gehostet, damit alle Codes der Website den Nutzern in einer verständlichen Form zur Verfügung gestellt werden können.

Wenn dein Webhoster langsam ist, wirkt sich das auf die Auslieferung aus, und wenn eine Verbindung zu externen Quellen wie Google Fonts, Google Maps, Display-Anzeigen oder reCAPTCHA besteht, ist es unvermeidlich, dass deine Website viel langsamer ausgeliefert wird, denn wir müssen nicht nur darauf warten, dass dein Webhoster alle Seitenelemente lädt, sondern auch darauf, dass die externen Quellen die Informationen analysieren, die auf deiner Seite angezeigt werden sollen.

Nehmen wir an, meine Website hat ein paar Seiten. Das Theme fügt einige Codes hinzu, hauptsächlich in der Kopf- und Fußzeile der Seiten. Die Plugins fügen einige Codes zu einigen oder allen Seiten hinzu. Wenn einer Seite ein Code hinzugefügt wird, um Google Maps anzuzeigen, muss sie warten, bis Google Maps auf die Daten reagiert hat, bevor die Karten angezeigt werden.

Die Frage ist, ob du nur die Startseite oder alle Seiten deiner Website optimieren solltest.

Die Antwort auf diese häufig gestellte Frage lautet, dass du alle deine Seiten auf Geschwindigkeit optimieren solltest, vor allem die Seiten, die für bestimmte Schlüsselwörter, die für deine Website oder dein Unternehmen wichtig sind, ranken. Die Dinge, die deine Website verlangsamen könnten, sind also vor allem das Theme, die Plugins und der Webhoster. Aber das ist noch nicht alles. Ich verrate dir 9 praktische Tipps, wie du deine WordPress-Website beschleunigen kannst, um die Verweildauer deiner Besucher zu erhöhen, was wiederum zu einem besseren Ranking in den Suchergebnissen führen kann. Du solltest auf jeden Fall bis zum Ende durchhalten, denn ich verspreche dir, dass du von einigen der Tipps noch nie gehört hast, weil sie von mir selbst erdacht und ausprobiert wurden.

Also los geht’s. Hey, hier ist Jack von Rank Math, dem WordPress-SEO-Plugin, mit dem dein Unternehmen die besten Chancen hat, die Konkurrenz in den Suchmaschinen zu schlagen. Wir veröffentlichen viele Videos, die dir helfen, deinen Suchverkehr zu steigern. Abonniere unseren Kanal, um SEO- und Geschäftswissen direkt in deine YouTube-Benachrichtigung zu bekommen.

Heute habe ich etwas Einzigartiges mit dir zu teilen, denn ich habe viele WordPress-Websites optimiert und dabei einige Gemeinsamkeiten bei den Hauptursachen für die Website-Geschwindigkeit gefunden, die du in diesem Video kennenlernen wirst. Zuerst werden wir uns mit internen Problemen wie Themes, Plugins und Seitenelementen beschäftigen.

Dann beschäftigen wir uns mit externen Faktoren wie Seiten-Caching, Webhosting und Content Delivery Network (CDN). Und nichts ist besser, als dir die Probleme anhand eines Beispiels zu erläutern. Wir werden diese Website durch den Google Pagespeed Insights Test laufen lassen, um den aktuellen Stand der Dinge zu erfahren, denn ohne die Grundlage der Optimierung wüssten wir nicht, was wir optimieren sollten. Wie du sehen kannst, scheint es keine Elemente zu geben, die die Webseite verlangsamen könnten. Es gibt viele Tools zum Testen der Geschwindigkeit, aber da wir versuchen, unsere Seitengeschwindigkeit zu optimieren, um von Googles Algorithmus-Update namens Page Experience Update zu profitieren, und es uns ein so umfassendes Tool zur Analyse unserer Website gegeben hat, würde ich sagen, dass das beste Tool zur Geschwindigkeitsoptimierung Google Pagespeed Insights ist.

Kopieren wir also die URL der Startseite und fügen sie in Google Pagespeed Insights ein. Wenn du nicht weißt, wie du zu dieser Seite kommst, haben wir einen Link in der Beschreibung hinterlassen. Nun, was wissen wir? Der mobile Wert dieser Seite ist schlecht und der Desktop-Wert ist durchschnittlich. Da Google sich sehr auf die mobile Geschwindigkeit konzentriert und die Desktop-Kennzahl sich natürlich verbessern wird, wenn wir für die mobile Geschwindigkeit optimieren, konzentrieren wir uns nur auf die mobile Bewertung und Kennzahl.

All diese Metriken beeinflussen die Leistungsbewertung, und das ist die Gewichtung der Punkte. Wie du siehst, konzentriert sich die aktuelle Version von Pagespeed Insights stark auf das größte inhaltsreiche Bild, die Gesamtblockierungszeit und die kumulative Layoutverschiebung.

Falls du den Begriff “Core Web Vitals” noch nicht kennst: Er ist Teil des bereits erwähnten Page Experience-Updates und bedeutet einfach, dass die Geschwindigkeitsleistung deiner Website einen Einfluss auf ihr Ranking hat. Das Largest Contentful Paint ist also ein Teil der Core Web Vitals. Das Gleiche gilt für die kumulative Layout-Verschiebung.

Und die Total Blocking Time hat Einfluss auf die First Input Delay, die ein Maß für die Reaktionsfähigkeit deiner Webseite auf der Grundlage der Interaktivität des Nutzers ist. Nachdem wir nun wissen, was die Core Web Vitals sind und wie sie mit den Metriken von Google Pagespeed Insights zusammenhängen, wollen wir uns ansehen, was die einzelnen Metriken bedeuten. Wenn du auf “Ansicht erweitern” klickst, siehst du eine kurze Beschreibung der einzelnen Metriken. Wenn du mehr darüber erfahren möchtest, kannst du auf “Mehr erfahren” klicken und du erhältst einen ausführlichen Bericht über die Metrik.

Aber lass mich deinen Lernprozess beschleunigen. Der First Contentful Paint misst, wie schnell das erste Objekt deiner Website im Browser angezeigt wird.

In diesem Fall dauert es 3,7 Sekunden, was wirklich langsam ist. Ich bin mir ziemlich sicher, wenn du eine Website besuchst und dein Browser länger als 3 Sekunden eine leere Seite anzeigt, wirst du die Seite verlassen, oder? Um eine gute Punktzahl zu erreichen, muss dein erstes Objekt also unter 1,8 Sekunden angezeigt werden.

Zwischen 1,8 und 3 Sekunden hast du die orangefarbene Anzeige und über 3 Sekunden die rote Anzeige, was langsam bedeutet, wie wir hier sehen können. Die erste zufriedenstellende Farbe wird durch diese Prüfungen beeinflusst. Wie du hier siehst, sind dies die zu optimierenden Audits und die bestandenen Audits, die zusammen das First Contentful Paint beeinflussen.

Der Geschwindigkeitsindex ist die Zeit, die es dauert, bis alle Objekte am oberen Rand der Seite auf dem Bildschirm angezeigt werden, mit anderen Worten, die Objekte oberhalb des Falzes, werden angezeigt.

In unserem Fall dauert es 12,1 Sekunden, was unglaublich langsam ist. Um eine gute Note zu bekommen, sollte der Geschwindigkeitsindex 3,4 Sekunden oder weniger betragen. Zwischen 3,4 und 5.

8 Sekunden erhältst du die orangefarbene Anzeige und über 5,8 Sekunden die rote Anzeige.

Wie wir hier gesehen haben, ist der Largest Contentful Paint die Zeit, die es dauert, bis das größte Element above the fold geladen ist. In unserem Beispiel sind das alle above the fold-Elemente und das größte Element ist das Bild der Dame, das 12 Sekunden zum Laden braucht. Für ein gutes Ergebnis streben wir 2,5 Sekunden oder weniger an.

Zwischen 2,5 und 4 Sekunden siehst du eine orangefarbene Anzeige und mehr als 4 Sekunden zum Laden des größten Elements gelten als langsam.

Die Audits, die den Largest Contentful Paint beeinflussen, sind diese Möglichkeiten sowie die bestandenen Audits. Und vergiss nicht, dass das größte Inhaltsbild eine der Metriken für Core Web Vitals ist. Das ist also sehr wichtig.

Die Zeit bis zur Interaktivität ist die Zeit, in der der Nutzer etwas auf der Website tun kann, z. B. scrollen oder auf eine Schaltfläche klicken. In unserem Beispiel dauert es 13,3 Sekunden, bis der Nutzer die Seite gescrollt hat. Meine Frage ist: Würdest du dich auf dieses Geschäft einlassen, wenn es 13,3 Sekunden dauert, bis du die Seite gescrollt hast?

Das bezweifle ich stark. Um eine gute Bewertung für diese Kennzahl zu erhalten, muss die Interaktivität zwischen 0 und 3,8 Sekunden liegen, zwischen 3,9 und 7,3 Sekunden gilt sie als mäßig und alles über 7.

3 Sekunden gilt als langsam.

Die Gesamtblockierzeit, die hier angegeben wird, ist die Summe aller Zeitspannen zwischen dem ersten Contentful Paint und der Zeit bis zur Interaktivität, wenn eine Aufgabe länger als 50 ms dauert. Das bedeutet, dass zwischen dem Zeitpunkt, an dem deine Seite geladen wird, und der Aufgabe, zum Beispiel eine Google-Karte zu laden, die länger als 50 Millisekunden dauert, vielleicht 400 ms, und einer anderen Aufgabe, vielleicht dem Laden des reCAPTCHA, die 150 ms dauert. Insgesamt werden diese Aufgaben, die länger als 50 ms dauern, addiert. Das ist die Idee hinter der Total Blocking Time und sie hat einen Einfluss auf die Leistung der First Input Delay, die Teil der Core Web Vitals ist. Um bei dieser Kennzahl eine gute Note zu erhalten, darf die Gesamtblockierzeit nicht mehr als 200 ms betragen.

Ein Wert zwischen 200 und 600 ms gilt als moderat, und da er in unserem Fall über 600 ms liegt, wird er als langsam eingestuft. Schließlich haben wir noch die kumulative Layoutverschiebung, die ein Core Web Vital ist und am besten erklärt, was das ist. In diesem Beispiel beschließt der Nutzer, zur vorherigen Seite zurückzukehren, aber weil sich die Seitenelemente verschoben haben, klickt er stattdessen auf die Schaltfläche “Meine Bestellung aufgeben”, wo er ungewollt 56 Artikel gekauft hat. Das passiert in der Regel, wenn sich entweder ein Bild oder ein Video mit unbekannten Abmessungen auf der Seite befindet oder eine Schriftart, die größer oder kleiner dargestellt wird als ihr Fallback, d.h. wenn du z.B. Google Fonts verwendest, dauert es eine Weile, bis sich deine Website mit Google Fonts verbunden hat, bevor der Stil der Schriftart auf deine Seite geladen wird. Während dieser Zeit der Verbindung hast du also eine Ersatzschrift, die du anzeigen kannst.

Wenn deine Ersatzschriftart z. B. 20 Pixel groß ist und die Google-Schriftart 40 Pixel groß ist, wenn sie die Ersatzschriftart ersetzt, wird der gesamte Inhalt darunter nach unten verschoben.

Eine weitere Ursache für das CLS-Problem ist eine Anzeige oder ein Widget eines Drittanbieters, das seine Größe dynamisch ändert. Wenn du dieses Problem hast, solltest du die Größe des Anzeigenplatzhalters begrenzen. Glücklicherweise haben wir auf dieser Seite kein Problem mit dem CLS. Jetzt, wo wir wissen, was die sechs Metriken sind und wie sie mit Core Web Vitals zusammenhängen, möchte ich dir alle Tipps zeigen, wie du deine WordPress-Website schneller machen kannst.

Dies ist meine ganz eigene Sichtweise auf die Geschwindigkeitsleistung. Wenn deine leere Seite bei Google Pagespeed Insights keinen Wert von über 90 erreicht, werden alle Seiten, die du für die Geschwindigkeit optimieren willst, nicht besser als die leere Seite.

Das macht Sinn, oder? Wenn du also die Probleme identifizierst, die deine leere Seite verlangsamen, und sie optimierst, werden natürlich auch alle anderen Seiten eine bessere Leistung haben. In unserem WordPress-Dashboard.

Ich füge eine neue Seite hinzu. Ich nenne sie “Leere Seite” und veröffentliche sie. Wie du sehen kannst, ist dies die leere Seite. Ich kopiere die URL und füge sie in Google Pagespeed Insights ein. Und was haben wir hier?

Wir haben einen so schlechten Wert für eine leere Seite, was können wir also von den anderen Seiten erwarten? Alle Metriken außer dem CLS sind rot, und wenn wir uns die Optimierungsmöglichkeiten ansehen, sehen wir, dass das eingebettete YouTube-Video in der Fußzeile zu dem ungenutzten JavaScript beiträgt.

Das ungenutzte CSS. Es hat einen großen Einfluss auf das Laden der Drittanbieter-Assets. Erinnerst du dich daran, dass wir darüber gesprochen haben, wie das Laden von Inhalten aus externen Quellen die Seite verlangsamen würde?

All diese Inhalte stammen aus dem YouTube-Video und erhöhen die JavaScript-Ausführungszeit. Es steht also fest, dass das YouTube-Video der Hauptverursacher für eine langsame leere Seite ist. Generell wollen wir nicht, dass Codes von Drittanbietern, wie die hier gezeigten, auf einer leeren Seite geladen werden, vor allem nicht solche, die die Blockierzeit des Haupt-Threads erhöhen. Hier stellt sich die Frage, ob wir wirklich ein allgemeines YouTube-Video in der Fußzeile der Seite brauchen? Oder hast du eine Google-Karte in der Fußzeile oder vielleicht ein Wettervorhersage-Widget?

Brauchen wir sie wirklich in der Fußzeile, weil sie auf jeder Seite deiner Website erscheinen und alle anderen Seiten verlangsamen? Wenn die Antwort nein lautet, gehe ich dorthin, wo das Element ist, und entferne es.

Jetzt fügen wir einen Text auf der leeren Seite ein, sagen wir, es ist die Testseite und testen sie erneut. Der Grund, warum wir das tun, ist, dass wir wissen wollen, ob Google die richtige Seite testet. Manchmal testet es eine Cache-Seite, die die Änderung nicht widerspiegelt.

Da wir den von uns hinzugefügten Text sehen, testet Pagespeed Insights die richtige Seite und wir können sehen, dass die Probleme mit YouTube verschwunden sind. Der Score wird viel besser. Wenn du also die leere Seite so optimierst, dass sie bei Google Pagespeed Insights einen Wert von über 90 erreicht, wird sich die Leistung aller anderen Seiten natürlich verbessern. Du kannst auch ein Caching-Plugin hinzufügen, um die Seite zu optimieren, worauf ich später noch eingehen werde. In diesem Video gebe ich dir alle Ressourcen, die du brauchst, um deine leere Seite auf einen Wert von über 90 zu bringen.

Ehrlich gesagt, ist dieser Tipp subjektiv, wird aber oft übersehen. Wie können wir also langsam ladende Plugins erkennen? Ich empfehle, die folgenden Tests auf einer separaten Website oder in einer Staging-Umgebung durchzuführen. Ich verwende dieses Tool namens Pingdom, weil die Ergebnisse stabiler sind.

Wir wollen alle Plugins auf deiner Website deaktivieren und die leere Seite mit Pingdom testen. So haben wir eine Basis für den Vergleich. Sobald wir die Ergebnisse für die leere Seite ohne Plugins haben, wollen wir ein Plugin nach dem anderen aktivieren. Sagen wir “Contact Form 7” und wir öffnen einen neuen Tab und testen dieselbe Seite erneut.

Wenn du die Ergebnisse der beiden Tests vergleichst, wirst du sehen, dass Contact Form 7 mehr Anfragen stellt, mehr Ladezeit benötigt und die Seitengröße um etwa 15 KB erhöht, ohne dass wir irgendwelche Elemente auf der Seite hinzufügen.

Das bedeutet, dass das Contact Form Seven Plugin der Seite mehr Code hinzufügt, noch bevor du irgendeine Funktion hinzufügst. Wenn wir zum Beispiel Rank Math testen, deaktivieren wir Contact Form Seven und aktivieren sowohl die kostenlose als auch die Pro-Version von Rank Math und testen sie erneut mit Pingdom.

Rank Math fügt etwa 0,7 KB zur Seitengröße hinzu. Es fügt der Seite keine zusätzlichen Anfragen hinzu und die Ladezeit ist fast gleich.

Wenn du also nach dem schnellsten WordPress-SEO-Plugin suchst, dann solltest du dir Rank Math auf jeden Fall ansehen, denn wir verwenden die wenigsten Codezeilen. Unser Plugin-Ordner ist der kleinste, wir haben den geringsten Speicherbedarf und wir sind die schnellsten in Bezug auf die Seitengeschwindigkeit. Wir fügen deinem Beitrag eine Statusleiste hinzu, wenn du eingeloggt bist, damit du die Seitengeschwindigkeit des Beitrags, auf dem du dich befindest, leicht überprüfen kannst. Du kannst die Statusleiste ausblenden, wenn du willst, und du kannst sie auch von anderen Beiträgen komplett entfernen, wenn du das möchtest.

Du hast die volle Kontrolle.

Außerdem können alle unsere Module je nach Anwendungsfall ein- oder ausgeschaltet werden. Wenn du das Weiterleitungsmodul nicht brauchst, kannst du es ausschalten, damit die ungenutzte Funktion keine Codes auf deine Website lädt. Das macht deine Website noch schlanker. Außerdem kannst du die Anzahl der Plugins, die du auf deiner Seite installierst, reduzieren. Du brauchst zum Beispiel kein zusätzliches Plugin für den 404-Monitor, kein zusätzliches Plugin für Weiterleitungen, Schema, Sitemap usw.

Das meiste, was du in Sachen SEO brauchst, findest du in diesem kleinen Plugin-Ordner.

Das Wichtigste ist, dass wir keine Plugins installieren, die nur einmalig verwendet werden, es sei denn, sie sind notwendig, und wir wollen keine Plugins installieren, die den Umfang der Seite vergrößern, ohne dass wir etwas dazu beitragen. Geh also deine vorhandenen Plugins durch und sieh nach, ob du Plugins findest, die deine Seite verlangsamen, und ob es eine Möglichkeit gibt, sie zu ersetzen, ohne dass es zu Funktionsproblemen kommt. Tipp drei ist wahrscheinlich der einfachste und zugleich effektivste Weg, um die Geschwindigkeit deiner Seite und die Vitalwerte des Core Web zu verbessern. Ich zeige dir mal etwas ganz Tolles.

Wenn wir den vorherigen Geschwindigkeitstest auf unserer Startseite besuchen und nach unten scrollen, sehen wir das Audit “Größtes inhaltsreiches Paint-Element”.

Wenn wir es erweitern, sehen wir, dass das größte Element oberhalb des Falzes die Dame ist, die Yoga macht. Da Bilder größer sind als Text oder Schaltflächen, gibt es zwei Möglichkeiten, für das größte Contentful Paint zu optimieren. In meinem Beispiel können wir entweder das Bild optimieren, damit es schneller geladen wird, oder wir können das größte Element oberhalb des Falzes durch ein anderes Element ersetzen. Lass mich dir zeigen, was ich meine.

Die aktuelle mobile Version unserer Seite zeigt zuerst das Bild, dann den Text und die Schaltflächen. Diese Spalte Nummer eins stellt das Bild dar und der Inhalt hier drüben befindet sich in Spalte Nummer zwei. Wenn wir die Seite aktualisieren, schalten wir das um. Jetzt sehen wir, dass der Text und die Schaltflächen ganz oben stehen und das Bild ganz unten. Ich habe das Bild nach unten verschoben, damit es nicht ganz über dem Falz zu sehen ist.

Wenn wir diese Seite noch einmal testen, kannst du sehen, dass sich das Bild mit dem größten Inhalt von dem hier zu dem hier geändert hat und sich die Punktzahl um 15 Punkte verbessert hat.

Der Grund dafür, dass die Seite immer noch in der orangen Zone liegt, sind andere Probleme, die wir in Kürze angehen werden. Eine einfache Änderung des größten Contentful-Elements in ein leichteres Element kann also zu einer deutlichen Verbesserung der Geschwindigkeit und der Core Web Vitals führen. Natürlich muss diese Änderung für dein Unternehmen sinnvoll sein. In meinem Fall ist es sinnvoller, den Text und den Button oberhalb des Folds zu platzieren als das Bild.

Bilder sind ein wesentlicher Bestandteil einer Website. Ohne Bilder würden die Webseiten nur aus Text bestehen und das ist langweilig. Ein Bild sagt mehr als 1000 Worte. Kennst du die Redewendung? Bilder sind also wichtig, und doch sind sie eine der Hauptursachen für die Geschwindigkeit einer Website.

Ein Standard-Desktop-Bildschirm hat eine Größe von 1920 x 1080p, und auf einem Handy, sagen wir, es ist ein iPhone 13 Pro Max. Es hat eine Bildschirmgröße von etwa 295 x 608 Pixeln. Stell dir also vor, du lädst ein Bild mit einer Größe von 3000 x 3000 Pixeln auf deine Website.

Dann gibt es zwei Probleme. Erstens: Die Größe deines Bildes wird zu groß sein.

Die empfohlene Größe für ein Webbild liegt unter 200 KB, so dass es sehr lange dauern würde, bis dein Server das Bild in den Browser geladen hat. Das zweite Problem ist, dass dein Server mehr Zeit braucht, um das Bild an die Größe der Geräte anzupassen. Daher ist die Optimierung deiner Bilder für das Internet sehr wichtig für die Geschwindigkeit deiner Website.

Wenn du ein Bild in voller Länge brauchst, das sowohl auf dem Desktop als auch auf dem Handy gut aussieht, empfehlen wir, die Breite des Bildes auf 800 Pixel zu beschränken, und für Bilder mit halber Breite, bei denen Text und Bild nebeneinander stehen, empfehlen wir eine Breite von 300 Pixeln. Wenn du die Größe des Bildes gemäß unserer Empfehlung anpasst, sollte dein Bild weniger als 400 KB groß sein, und dann optimierst du dein Bild weiter, um die Größe unter 200 KB zu halten.

Beliebte Plugins zur Bildoptimierung sind Imagify und Short Pixel, mit denen du deine Bilder beim Hochladen automatisch optimieren kannst. Ich persönlich bevorzuge jedoch die manuelle Optimierung eines Bildes mit dem kostenlosen Tool Kraken.io. Klicke auf “Try Free web interface”. Ich verwende gerne die “verlustbehaftete” Komprimierung. Ziehen wir dieses Bild mit einer Dateigröße von 336kb zu Kraken und du wirst sehen, dass die Dateigröße drastisch reduziert wurde.

Ich würde dieses Bild herunterladen, bevor ich es auf die Website hochlade. Das ist meine persönliche Praxis. Und schließlich kannst du deine Bilder noch weiter optimieren, indem du sie im WebP-Format bereitstellst, dem von Google entwickelten Goldstandard für Bildformate.

Auch hier bieten Plugins wie Imagify und Short Pixel diese Funktion, aber ich möchte dir noch einen kleinen Tipp geben. Wenn deine Website auf einem Apache- oder NGINX-Server gehostet wird, funktionieren Plugins wie Imagify und Short Pixel am besten mit diesem.

Außerdem solltest du dein Plugin zur Bildoptimierung mit Caching-Plugins wie WP Rocket oder diesen anderen Plugins kombinieren, um die Geschwindigkeit deiner Website zu verbessern. Wenn deine Website jedoch auf einem Litespeed-Server gehostet wird, wie in unserem Beispiel, installiere ich ein Plugin namens “LS Cache”, weil es alle oben erwähnten Bildoptimierungs-Tools enthält und darüber hinaus alle Funktionen von WP Rocket bietet. Ein weiterer Tipp: Wenn möglich, solltest du deine Website auf einem Litespeed-Server hosten lassen, denn der ist nicht nur zwölfmal schneller als NGINX, sondern du kannst auch die Anzahl der verwendeten Plugins um eins reduzieren. Nun zurück zu unserem Beispiel. Installieren wir der Einfachheit halber das ShortPixel Image Optimizer Plugin.

Wenn du neu bei ShortPixel bist, kannst du einen Schlüssel anfordern, der dann an die von dir angegebene E-Mail-Adresse geschickt wird.

Kopiere den API-Schlüssel aus der E-Mail und füge ihn zur Überprüfung hier ein. Wenn du das getan hast, gehst du auf “Erweitert” und dann auf “Bilder der nächsten Generation”. Aktiviere dieses Kästchen und dieses Kästchen für die Lieferung von WebP-Bildern. Beachte, dass ShortPixel auf Guthabenbasis arbeitet.

Mit dem kostenlosen Plan kannst du 100 Bilder pro Monat optimieren. Auf der Preisseite findest du weitere Informationen, indem du auf den Link Upgrade Now klickst. Da unser Guthaben knapp bemessen ist, optimieren wir nur die Bilder auf der Startseite. Danach testen wir diese Seite noch einmal. Das ist das Vorher und das ist das Nachher.

Die Leistung ist etwas besser als vorher und das Problem mit den “Bildern im Next-Gen-Format” wird bei dem neuen Test behoben. Wie du an unserem Beispiel sehen kannst, haben wir eine sehr schöne Startseite und wissen, dass alle Seitenelemente, die eine Verbindung zu Drittquellen benötigen, die Webseite verlangsamen, wie z. B. die Google-Karte. Die Frage ist: Brauchen wir wirklich eine Karte auf der Startseite? Die Startseite ist in der Regel die erste Seite, die von Suchmaschinen gecrawlt wird, also solltest du auf jeden Fall dafür sorgen, dass sie schnell geladen wird.

Wäre es also besser, wenn die Karte auf der Kontaktseite eingefügt wird?

Dann lautet die nächste Frage: Würde die Kontaktseite nicht langsamer laden? Wo ist da der Unterschied? Oder? Lass mich das mit dir teilen. Für welche anderen möglichen Keywords wird deine Kontaktseite ranken?

Ich nehme an, dass es dein Markenname plus Kontakt, Support oder was auch immer sein wird. Das Wichtigste ist, dass sie für Marken-Keywords ranken wird, die wenig bis gar keine Konkurrenz haben.

Egal, wie langsam die Seite ist, sie wird für diese Marken-Keywords immer ganz oben ranken. Natürlich darf sie nicht so langsam sein, dass deine Kunden sie verlassen, ohne dich zu kontaktieren. Ich will damit sagen, dass jede Seite auf deiner Website, die für wettbewerbsfähige Suchbegriffe gerankt wird, so schnell wie möglich geladen werden sollte, also solltest du nicht zu viele Elemente hinzufügen, die diese Seiten verlangsamen.

Du willst diese Ressourcen richtig einsetzen. Ein weiteres Beispiel ist reCAPTCHA. Brauchst du diese Funktion auf allen deinen Webseiten? Die Antwort ist nein, oder? Du brauchst sie z. B. nur auf Anmeldeseiten oder Lead Capture-Seiten, um Spam oder Brute-Force-Angriffe abzuwehren.

Bitte beachte, dass dies die Seitenelemente sind, die deine Webseite verlangsamen können. Versuche, sie von deinen Seiten zu entfernen und schau, wie deine Seite funktioniert. Ich bin mir ziemlich sicher, dass es Elemente sind, die deine Seite verlangsamen. Sobald du deine Seite ohne diese Elemente optimierst, verbessert sich deine Seite natürlich bei der ersten Eingabeverzögerung, die ein Core Web Vital ist. Wie du weißt, fügen WordPress-Themes Codes in alle deine Webseiten ein.

Sie fügen Codes im Header, in der Fußzeile, in der Sidebar und sogar in den Inhaltsbereichen ein, sodass ein leichtgewichtiges Theme entscheidend ist, wenn es darum geht, deine Website zu beschleunigen.

Das Schwierige daran ist, dass es tonnenweise WordPress-Themes auf dem Markt gibt und es schwer ist, das für dich am besten geeignete Theme auszuwählen. Bei kostenlosen Themes mache ich mir keine Sorgen, denn sie müssen einen bestimmten Standard erfüllen, bevor WordPress sie in sein Repository aufnimmt, daher können wir sicher sein, dass die meisten kostenlosen Themes leichtgewichtig sind. Der Nachteil ist jedoch, dass sie oft nicht ausreichend anpassbar sind. Bezahlte Themes hingegen müssen keinen Standard erfüllen, so dass die Theme-Entwickler so viele Funktionen wie möglich in das Theme einbauen können, um es noch attraktiver zu machen.

Aber oft sind sie mit vielen unnötigen Codes aufgebläht. Glaube mir, wenn ich sage, dass ich einen langen Weg zurückgelegt habe, um diese Liste von hochgradig anpassbaren WordPress-Themes zu finden, die leichtgewichtig sind und deine Website nicht verlangsamen. Und natürlich glaube ich, dass es noch andere leichtgewichtige Themes auf dem Markt gibt. Wenn du welche kennst, die in der Liste noch nicht erwähnt sind, kannst du sie mir mitteilen? Hinterlasse sie im Kommentarbereich.

Wenn du dich noch nicht mit Geschwindigkeitsoptimierung befasst hast und den Begriff “Caching” noch nicht kennst, ist das einfach eine separate Version deiner Website, die vorübergehend auf deinem Server gespeichert wird, damit sie viel schneller ausgeliefert werden kann. Das ist so, als ob ein fertiges Essen schneller serviert werden kann, weil du es nicht von Grund auf neu zubereiten musst. Das Gleiche gilt für deine Website. Wenn jemand deine Webadresse in den Browser eingibt, wird die Anfrage an den Server geschickt.

Wenn keine Zwischenspeicherung vorhanden ist, muss der Server die Elemente deiner Website einzeln laden, bevor sie bereitgestellt werden können.

Stell dir vor, du hast jede Minute Hunderte oder Tausende von Anfragen. Der Server muss deine Website hunderte oder tausende Male laden. Wenn der Server jedoch eine gespeicherte Version hat, kann er die Website den Besuchern sofort zur Verfügung stellen. Ein Caching-Plugin hilft dir, diese Version deiner Website zu erstellen. Wie ich bereits erwähnt habe, gibt es viele Caching-Plugins, aber in diesem Beispiel verwende ich WP Rocket für alle, deren Websites nicht auf einem Litespeed-Server gehostet werden. Nachdem wir das WP Rocket Plugin installiert haben, stellt sich die nächste Frage: Was ist die beste Einstellung?

Ehrlich gesagt, gibt es keine, denn jede Website funktioniert anders.

Was auf meiner Seite funktioniert, muss auf deiner nicht funktionieren. Beginnen wir mit den Cache-Einstellungen. In der Standardeinstellung sind das bereits die besten Einstellungen. Es sei denn, du hast ein spezielles mobiles Theme oder eine spezielle Version deiner Website, dann solltest du das überprüfen.

Aber bei den meisten modernen WordPress-Themes brauchst du das nicht zu tun. Bei den Einstellungen zur Datei-Optimierung ist es am besten, wenn du jede Einstellung einzeln testest.

Wenn du diese Einstellung aktivierst, siehst du die Meldung, dass dies zu Problemen führen kann. Du solltest also vorsichtig sein. Wenn du diese Einstellung aktivierst und die Änderungen speicherst, solltest du sofort den Cache löschen und deine Webseiten besuchen, um zu sehen, ob etwas kaputt geht.

Wenn nichts kaputt geht, wie in diesem Beispiel, können wir diese Einstellung anlassen. Mach das Gleiche mit allen anderen Einstellungen. Jede Einstellung, die deine Seite kaputt macht, solltest du ausschalten. Dinge, die deine Seite kaputt machen könnten, sind in der Regel die Optimierung für CSS und JavaScript, also musst du auf jeden Fall vorsichtig sein, wenn du eine dieser Einstellungen aktivierst. Ich werde nicht zu sehr darauf eingehen, was diese Einstellungen sind, weil es zu technisch werden könnte.

Du solltest aber wissen, dass diese Einstellungen deine Website beschleunigen und die meisten der üblichen Probleme, die du in den Google Pagespeed Insights findest, wie z. B. “Rendering-blocking resources eliminieren”, ersetzen können.

Am Ende unserer Konfiguration erhältst du die besten WP Rocket-Einstellungen für deine Website. Wenn wir nach all diesen Einstellungen die Website erneut testen, sollte die Leistung beim Pagespeed Insights Test in bester Verfassung sein. Die letzte Grenze der Geschwindigkeitsoptimierung ist die Verwendung eines Content Delivery Network. Schau dir das an.

Das ist die Weltkarte. Wenn sich dein Webhoster in den USA befindet, kann er deine Website schnell für Menschen in den USA anzeigen. Wenn jedoch Menschen auf der anderen Seite der Welt, z. B. in Japan, Indien oder Singapur, deine Website besuchen wollen, kann es etwas dauern, bis sie geladen ist, weil die Daten deiner Website eine lange Strecke zurücklegen müssen. Mit Hilfe von Content Delivery Networks, die auf der ganzen Welt verteilt sind. Genau wie dein Webserver speichern sie eine zwischengespeicherte Version deiner Website, so dass sie dem Publikum auf der ganzen Welt viel schneller zur Verfügung gestellt werden kann.

Das ist das Tolle an CDN. Wenn deine Website auf einem Litespeed-Server gehostet wird, gibt es einen speziellen CDN-Dienst namens Quic Cloud.

Die andere beliebte Alternative für andere Webserver ist das Cloudflare CDN. Sobald du deine Website mit dem Cloudflare CDN verbunden hast, kannst du auf WP Rocket unter “Addons” deine Website und WP Rockets ganz einfach in Cloudflare integrieren. Rekapitulieren wir.

Als Erstes solltest du eine leere Seite erstellen und sie testen, um zu sehen, ob es Codes gibt, die unnötigerweise auf allen anderen Seiten deiner Website eingefügt werden. Wenn ja, musst du sie entweder entfernen oder einen Weg finden, sie zu optimieren.

Dann solltest du alle aktiven Plugins testen, um festzustellen, ob eines davon deine Website verlangsamt. Wir empfehlen, einen Test auf einer separaten Website oder in einer Staging-Umgebung durchzuführen. Verwende Pingdom oder ein anderes Geschwindigkeitstest-Tool, um zunächst die Leistung einer leeren Seite ohne installierte Plugins zu ermitteln und sie dann mit der Leistung zu vergleichen, wenn die Plugins nacheinander aktiviert sind.

Sobald du alle unnötigen Plugins und Codes auf der Seite, die du optimierst, entfernt hast, solltest du die Elemente oberhalb der Faltung verschieben, damit schwerere Elemente wie Bilder, Videos, Karten, Anzeigen oder was auch immer nicht als größtes inhaltsreiches Bild angesehen werden.

Und dann willst du deine Bilder für das Web optimieren, indem du sicherstellst, dass die Bilder gut auf die Bildschirme der Geräte passen. Wir empfehlen, die Breite von Bildern in voller Länge auf 800 Pixel zu beschränken und für Bilder in halber Länge eine Breite von 300 bis 400 Pixeln zu wählen. Dann solltest du Plugins und Tools verwenden, um die Größe der Bilder zu optimieren und zu komprimieren und sie schließlich im Webp-Format bereitzustellen. Danach empfehlen wir dir, deine Website auf einem Litespeed-Server zu hosten, da dieser im Allgemeinen viel schneller ist und du die Anzahl der installierten Plugins reduzieren kannst.

Apropos Plugins: Ein SEO-Plugin ist ein Muss. Das Rank Math Plugin ist das leichteste, das die meisten Funktionen bietet und mit dem du die Anzahl der aktiven Plugins noch weiter reduzieren kannst.

Wann immer du ein Seitenelement entdeckst, das deine Seite verlangsamt, wie z. B. diese Elemente, frage dich, ob die Seite für stark umkämpfte Keywords rankt. Wenn ja, solltest du das Element nach Möglichkeit entfernen. Wenn nicht, versuche, es zu optimieren.

Die Installation eines leichtgewichtigen Themes ist ebenfalls wichtig, da es viele Codes in alle Seiten deiner Website einbaut. Hier findest du eine Liste von leichtgewichtigen Themes, die wir empfehlen. Achte darauf, dass du ein Caching- und Speed-Performance-Plugin verwendest, um deine gesamte Website zu optimieren. Dadurch wird deine Website viel schneller geladen. Anschließend solltest du ein CDN verwenden, damit dein Publikum weltweit viel schneller auf deine Website zugreifen kann.

Das sind alle Tipps, die wir für dich haben, und ich bin mir ziemlich sicher, dass einige der Tipps für dich neu sind und du sie noch nirgendwo anders gehört hast, weil sie von mir selbst aus jahrelanger persönlicher Erfahrung stammen. Ich hoffe, sie gefallen dir. Wenn du dieses Video hilfreich findest, vergiss nicht, den Daumen hoch zu drücken.

Wir wissen das wirklich zu schätzen. Wenn du noch weitere Tipps zur Geschwindigkeitsoptimierung kennst, kannst du gerne unten einen Kommentar hinterlassen.