Die Ladezeiten einer Website sind für ein erfolgreiches Webprojekt essentiell. Lädt deine Website länger als 3 Sekunden, ist die Chance hoch, dass der User deine Seite sofort verlässt oder keine Conversion ausführen wird.
Damit kann sich eine lange Ladezeit aber nicht nur negativ auf den Erfolg deiner Website auswirken, sondern auch auf die Rankings. Auch wenn Google selbst immer wieder bestätigt, dass bei der Suchmaschinenoptimierung der Content an erster Stelle steht, sollte man die Ladezeit nicht außeracht lassen. Denn eine lange Ladezeit spiegelt für Google eine schlechte Nutzererfahrung wieder. Zum Beispiel in der Anzahl der Abbrüche. Das wiederum ist ein sehr wichtiger Rankingfaktor.
Sollte deine Website langsam laden, brauchst du aber nicht den Kopf in den Sand zu stecken. Gerade als WordPress Nutzer hat man einfache und schnelle Möglichkeiten die Ladezeit zu verbessern. Zum Beispiel mit dem Plugin WP Rocket.
Was ist WP Rocket?
WP Rocket ist ein s.g. Cache Plugin, das dafür sorgt, dass deine Website schneller lädt. Außerdem bringt WP Rocket viele weitere Funktionen mit, die dir Ladezeit deiner Website erheblich verbessern können. Dazu zählen zum das verzögerte Laden von Bildern und JavaScript (Lazy Load), Minimierung von HTML-Code sowie die Verknüpfung und Minimierung von CSS- und JavaScript-Dateien.
Das besondere dabei ist das WP Rocket wirklich sehr einfach in der Bedienung ist und jede Einstellung einfach erklärt wird. Damit ist es auch für Anfänger kein Problem WP Rocket in nur wenigen Minuten einzurichten.
Mit WP Rocket starten – in 5 Schritten zur schnellen Website
Mit WP Rocket kannst du schnell und einfach starten. Hier möchte ich dir zeigen, wie ich die Ladezeit der Online Marketing Site mit Hilfe von WP Rocket um 400% verbessern konnte. Ja du ließt richtig. Ich habe mit dem WordPress Caching Plugin über 10 Sekunden Ladezeit einsparen können.
Schritt 1: Ladezeit deiner Website überprüfen
Bevor du mit den Optimierungen startest, solltest du überprüfen, wie schnell deine Website lädt und dir diese Werte notieren. Nur so hast du später einen Vergleich.
Die folgenden Tools zum Messen der Website Geschwindigkeit kann ich dir empfehlen:
Dir wird hierbei auffallen, dass die Tools möglicherweise unterschiedliche Werte ausspucken. Das liegt daran, dass jedes Tool seine eigenen Messmethoden hast. Lass dich davon nicht verunsichern.
Bietet dir ein Tool die Möglichkeit eine „Testlocation“, also der Ort von dem getestet wird, und ein Testbrowser auszuwählen, solltest du hier die Auswahl treffen, die am ehesten auf die Besucher deiner Website zutrifft. Ich wähle hier zum Beispiel immer einen Testort in Deutschland und einen beliebten Browser wie Chrome oder Firefox aus. So stellst du sicher, dass dir der Test die Ladezeiten anzeigt, die auch die User deiner Website betreffen.
Wie schon erwähnt solltest du dir von diesen Testergebnissen Screenshots machen um diese dann mit den optimierten Ladezeiten vergleichen zu können.
Um dir hier zu zeigen, dass WP Rocket wirklich eine Verbesserung bringt, optimiere ich heute ein Testprojekt von mir. Bisher habe ich an diesem Projekt keinerlei Optimierungen vorgenommen. Das spiegelt sich auch in der Ergebnissen der Tools wieder:
Page Speed Insights Mobil vor WP Rocket
Page Speed Insights Desktop vor WP Rocket
Web Page Test vor WP Rocket
Schritt 2: WP Rocket herunterladen & installieren
WP Rocket ist ein kostenpflichtiges Plugin, welches du hier erwerben kannst. Hast du nur eine Website die optimiert werden soll, reicht dir das kleinste Paket. Hier kostet WP Rocket einmalig 44€. Darin enthalten sind Updates und Support für ein Jahr. Du musst für WP Rocket also wirklich nur einmalig bezahlen. Möchtest du weiterhin Updates und Support erhalten, kannst du WP Rocket nach einem Jahr ganz einfach verlängern. Persönlich kann ich dir das sehr empfehlen, da WP Rocket mit seinen Updates viele neue, hilfreiche Funktionen implementiert. (Meist bietet dir WP Rocket bei Verlängerung auch Angebote, sodass du bei einer Verlängerung zum Beispiel nur 50% zahlen musst). Wie bereits erwähnt ist die Verlängerung aber kein „Muss“. Bist du mit der Geschwindigkeit deiner Website zufrieden und brauchst keine neuen Funktionen, kannst du das Plugin einfach so weiter laufen lassen.
Nachdem du WP Rocket gekauft hast, erhältst du eine .zip Datei mit dem Plugin. Diese kannst du dann unter „Plugins > Installieren“ im WordPress Dashboard einfach hochladen. Solltest du nicht wissen wie das funktioniert, findest du hier eine Erklärung.
Nachdem du das Plugin aktiviert hast, nimmt WP Rocket bereits automatisch einige Optimierungen vor, die schon dann für eine Verbesserung deiner Ladezeiten sorgen. Aber da ist noch mehr rauszuholen.
Schritt 3: WP Rocket richtig einrichten
Um WP Rocket einzurichten gehe in deinem WordPress Dashboard auf „Einstellungen“ und wähle hier „WP Rocket“ aus. Hier findest du nun verschiedene Kategorien in denen du entsprechende Einstellungen vornehmen kannst. Wir starten mit der Kategorie „Cache“.
WP Rocket Cache einstellen
Beim Cache müssen in der Regel keine weiteren Einstellungen getroffen werden. Einige Sonderfälle gibt es jedoch, auf die ich hier gerne kurz eingehen möchte:
1. Caching für mobile Geräte aktivieren
Diese Checkbox ist in der Regel automatisch ausgewählt und das sollte auch so bleiben. Deaktivierst du diesen Cache wird sich das negativ auf die Ladezeit auf mobilen Geräten auswirken.
2. Separater Cache für mobile Geräte
Ist deine Website responsive, das heißt deine Website passt sich automatisch an die Bildschirmgröße des Endgeräts an, musst du diese Option nicht auswählen.
Wähle diese Option aus wenn deine Website ein separates Theme für mobile Geräte hat oder Sonderfunktionen bietet, die nur auf mobilen Geräten verfügbar sind.
3. Aktiviere Caching für angemeldete WordPress – Benutzer/-innen
Diese Option ist deaktiviert, da sie in den meisten fällen nicht benötigt wird. Du solltest die Option jedoch auswählen, wenn du einen Mitgliederbereich oder Shop hast. So können diese Daten ebenfalls für die angemeldeten User gecached werden.
4. Cache Dauer
Diese Option ist bereits automatisch eingestellt und sollte in der Regel nicht geändert werden. Hier wird festgelegt, nach welcher Zeit der Cache gelöscht wird.
Dateioptimierung
Die Dateioptimierung ist der „schwierigste“ Teil der Einstellungen bei WP Rocket. Hier geht es darum Daten zu komprimieren um so schnellere Ladezeiten zu erreichen.
Je nachdem welche Plugins und Funktionen du auf deiner Website nutzt, kann es vorkommen, dass die ein oder andere Komprimierung zu Darstellungs- oder Funktionsfehlern führt. Deshalb empfehle ich dir hier wie folgt vorzugehen:
- Eine Funktion aktivieren
- WP Rocket Cache leeren
- Website im Inkognito (Privaten) Modus testen (auch auf mobilen Geräten)
CSS – Dateien:
Hierbei geht es darum deine CSS Dateien zu minifizieren. Dabei werden zum Beispiel Leerzeichen und Kommentare entfernt.
1. CSS minifizieren
Diese Option kannst du guten Gewissens aktivieren. Hier sind uns keine Probleme bekannt. Die Dateigröße wird dadurch reduziert, was gerade bei großen Dateien sehr wichtig ist.
2. CSS zusammenfassen
Diese Option kannst du aktivieren, in einzelnen Fällen kann es aber zu Problemen kommen. Deshalb prüfe danach deine Website genau. Dadurch das mehrere CSS Dateien zu einer Datei zusammengefasst werden, wird die Anzahl der HTTP – Anfragen reduziert. Auch das führt zu besseren Ladezeiten.
Diese Option solltest du nicht aktivieren, wenn deine Website HTTP/2 nutzt. Ob das der Fall ist kannst du hier ganz einfach testen.
3. CSS Darstellung optimieren
Auch diese Funktion ist empfehlenswert. Sie entfernt CSS Dateien, die das rendern blockieren. Dadurch kann vor allem die gefühlte Ladezeit, also die Zeit bis der User das Gefühl hat, dass die Website geladen ist, verbessert werden.
JavaScript – Dateien:
Wie der Name schon sagt geht es in diesem Abschnitt darum JavaScript Dateien zu optimieren. Gerade wenn eine Website sehr viel JavaScript nutzt, wirkt sich das stark auf die Ladezeit aus. Dementsprechend kann hier mit der richtigen Optimierung einiges erreicht werden.
4. Remove jQuery Migrate
Seit WordPress 3.6 wird automatisch die Datei jquery-migrate.min.js geladen. In den meisten Fällen wird diese Datei nicht benötigt. Aktivierst du diese Funktion, wird die Datei entfernt und eine Anfrage gespart.
Es gibt jedoch Plugins und Themes die veraltete jQuery Versionen nutzen. In diesem Fall wird die Datei benötigt. Stellst du nach der Aktivierung Fehler fest, solltest du diese Funktion wieder deaktivieren.
5. JavaScript minifizieren
Genau wie bei der CSS Funktion entfernt WP Rocket hier aus JavaScript Dateien Leerzeilen und Kommentare um die Dateigrößte zu reduzieren. Nach aktivieren dieser Funktion tauchten bei uns oftmals Darstellungsfehler auf. Deshalb prüfe danach deine Website genau.
6. JavaScript zusammenfassen
Hier gilt das gleiche wie beim „CSS zusammenfassen“. Diese Funktion solltest du nicht aktivieren wenn du HTTP/2 nutzt. Auch sonst kann es hier hin und wieder zu Problemen kommen, weshalb du anschließend deine Website ausgiebig testen solltest.
7. JavaScript verzögert laden
In der Regel gibt es mit dieser Funktion keinerlei Probleme, sodass du sie ruhig aktivieren kannst. Aktivierst du diese Datei wird automatisch eine weitere Funktion „Sicherer Modus für jQuery“ aktiviert. Ich empfehle dir dringend diese Funktion aktiviert zu lassen da es sonst mit hoher Wahrscheinlichkeit zu Problemen kommen wird.
8. Delay JavaScript execution
Bei dieser Funktion wird das Laden von JavaScript Dateien so lange blockiert, bis der User mit der Seite interagiert (zum Beispiel den Mauszeiger bewegt). Bei einigen Projekten verursacht diese Funktion bei uns keine Fehler, bei anderen Projekten konnten wir jedoch schwerwiegende Darstellungsfehler feststellen. Prüfe deine Website nach der Aktivierung also bitte genau.
Medien
Medien, wie zum Beispiel Bilder oder Videos, machen oftmals einen großen Teil der gesamten Daten einer Website aus. Hier gibt es ein hohes Einsparungspotential. Deshalb solltest du hier unbedingt weitere Einstellungen vornehmen.
1. Lazyload
Bilder, Videos und iframes werden bei dieser Funktion erst geladen, sobald diese Daten im Sichtfeld des Users ankommen. Diese zwei Optionen solltest du auf jeden Fall aktivieren, da so Ladezeit und HTTP requests gespart werden können.
2. Emoji
Wie von WP Rocket bereits automatisch erledigt sollten die Emojis immer deaktiviert sein. Nutzen und Datenmenge stehen hier einfach in keiner Relation weshalb du auf die kleinen Bildchen lieber verzichten solltest.
3. Embeds
Diese Funktion empfehle ich dir zu aktivieren. Damit verhinderst du, dass andere Websites Inhalte, zum Beispiel Bilder, direkt von deiner Seite laden.
4. WebP compatibility
Mit dieser Funktion liefert WP Rocket, wenn vorhanden, Bilder im WebP Format an die Browser aus. Grundsätzlich empfehle ich diese Funktion zu nutzen, denn WebP Bilder sind im durchschnitt 30% kleiner als JPG oder PNG Bilder. Dazu sind aber noch weitere Einstellungen notwendig, die ich dir zu einem späteren Zeitpunkt hier genau erkläre. Lasse diese Funktion bitte bis dahin noch deaktiviert.
Cache füllen
Mit dieser Funktion stellst du sicher, dass User selbst beim ersten Aufruf deiner Website nicht alle Daten herunterladen müssen, sondern sich bereits auf einem vorbereiteten Cache bedienen können. Dazu sollten die folgenden Einstellungen getätigt werden:
1. Preload Cache
„Activate Preloading“ ist von WP Rocket bereits aktiviert und sollte auch aktiv bleiben. Zudem empfehle ich das Sitemap – basierte Füllen des Cache ebenfalls zu aktivieren. So stellst du sicher, dass WP Rocket wirklich all deine Seiten cached. Hinterlege hier bitte die URL zu deiner Sitemap.
2. Preload Links
Diese Funktion ist relativ neu bei WP Rocket und sollte unbedingt aktiviert werden. Sobald ein User den Eindruck erweckt einen Link auf deiner Seite anzuklicken, zum Beispiel in dem er mit dem Mauszeiger über einen Link in deiner Navigation fährt, lädt WP Rocket im Hintergrund bereits die HTML Daten der Seite herunter. Wechselt der User nun auf diese Seite, erscheint die Seite in rasanter Geschwindigkeit.
3. DNS – Prefetch
Das Einbinden von Inhalten Dritter (also anderer Domains) kann sich negativ auf die Ladezeit deiner Website auswirken. WP Rocket kann in dieser Funktion dem Browser schon bevor die Daten überhaupt angefragt werden mitteilen, eine Verbindung zur jeweiligen Domain aufzubauen.
Dazu musst du die Funktion aktivieren und im Textfeld die entsprechenden Domains eintragen. Ich gehe mal davon aus das du nicht genau weißt ob das bei dir der Fall ist oder welche Domains du hier eintragen musst. Kein Problem. Das kannst du ganz einfach mit prefetch.xyz herausfinden. Trage hier einfach deine Domain an und kopiere dir anschließend die Domains die Prefetch gefunden hat. Diese kannst du dann bei WP Rocket unter „DNS-Prefetch“ einfügen.
4. Preload Fonts
Nutzt du benutzerdefinierte Fonts, kannst du diese hier eintragen und damit Vorladen lassen. Dadurch können sich die Ladezeiten deiner Website verbessern.
Erweiterte Regeln
In den erweiterten Regeln kannst du zum Beispiel festlegen welche URLs oder User Agents niemals gecached werden sollen. Das ist aber nur in den wenigsten Fällen von Bedeutung, etwa nur dann, wenn du einen Onlineshop hast. Hier sollte der Checkout Bereich zum Beispiel nicht gecached werden um sensible Daten zu schützen.
Da das aber sehr individuell ist, möchte ich hierzu keine allgemeine Empfehlung abgeben. Trifft es aber auf dich zu, solltest du hier entsprechende Anpassungen mit deinem Webentwickler durchsprechen.
Datenbank
In einer Datenbank sammeln sich im Laufe der Jahre viele Daten an, die höchstwahrscheinlich gar nicht mehr benötigt werden. Dadurch wird eine Datenbank unnötig groß, was du mit den richtigen Einstellungen bei WP Rocket aber beheben kannst.
1. Beiträge bereinigen
Revisionen
Bearbeitest du einen Beitrag, wird die vorherige Version als s.g. Revision gespeichert. Dabei wird aber nicht nur die vorherige Version gespeichert, sondern auch viele weitere davor. Hier sammeln sich eine ganze Menge Daten an.
Diese solltest du Regelmäßig über WP Rocket löschen, denn oftmals werden die Revisionen nicht mehr benötigt.
Automatisch erstellte Entwürfe
Entwürfe empfehle ich dir nicht automatisch löschen zu lassen. Vielleicht hast du eine Seite oder einen Beitrag noch nicht fertiggestellt, sodass dieser als Entwurf gespeichert wurde. In dem Fall würde dieser ebenfalls gelöscht werden.
Haben sich hier viele Entwürfe angesammelt, gehe diese am besten manuell in deiner Beitrags- bzw. Seitenübersicht durch und lösche sie direkt hier.
Gelöschte Einträge im Papierkorb
Den Papierkorb kannst du mit Hilfe von WP Rocket regelmäßig leeren. In der Regel werden gelöschte Einträge nicht wieder benötigt.
2. Kommentare bereinigen
Bei dieser Option kannst du sowohl „Spam Kommentare“ als auch „Gelöschte Kommentare“ auswählen. WP Rocket kann diese ruhig löschen, da diese nicht mehr benötigt werden.
3. Transients bereinigen
Dieser Punkt wird von WP Rocket selbst ganz gut erklärt. Es handelt sich hier um zeitlich begrenzte Optionen, die von Plugins benötigt werden. Diese kannst du ruhig löschen. Sollte ein Plugin eine solche Option wieder benötigen, wird die automatisch erstellt.
4. Datenbank bereinigen
Bei dieser Option werden automatisch Daten aus der Datenbank entfernt, die nicht länger benötigt werden. Das können zum Beispiel Daten sein, die ein gelöschtes Plugin hinterlassen hat.
Bevor du diese Option aktivierst, solltest du auf jeden Fall eine Sicherung deiner Datenbank durchführen. Weißt du nicht wie das geht, lass besser die Finger davon, denn die Reinigung kann nicht rückgängig gemacht werden.
5. Automatische Bereinigung
Gleiches gilt für die automatische Bereinigung. Hier rate ich dir sogar davon ab die Option zu aktivieren. Möchtest du deine Datenbank bereinigen, führe das lieber manuell über Punkt 4 aus und erstelle vorher eine Sicherung deiner Datenbank.
CDN (Content Delivery Network)
Hier hast du die Möglichkeit ein Content Delivery Network (CDN) zu aktivieren. Für eine Website, die hauptsächlich in einem Land aktiv ist, ist ein CDN eigentlich nicht notwendig.
Möchtest du mehr Informationen dazu, kann ich dir den Beitrag von XOVI empfehlen.
Heartbeat
Die WordPress Heartbeat API ermöglicht einen Echtzeit Austausch von Daten zwischen Server und Browser. Das ist zum Beispiel notwendig, wenn du Beiträge bei WordPress anlegst und bearbeitest.
Gerade wenn du viel und lange bei WordPress aktiv bist, kann sich das auf die Serverlast auswirken. Bei einem guten, schnellen Server wird das nicht so schnell ins Gewicht fallen, bei langsamen Servern kann sich das aber schon in der Ladezeit bemerkbar machen. Durch die richtigen Einstellungen bei WP Rocket kannst du das aber optimieren.
1. Control Heartbeat
Diese Funktion solltest du aktivieren. Dadurch kannst du erst festlegen, ob oder wie die Heartbeat API reduziert bzw. komplett abgeschaltet werden soll.
2. Reduce or disable Heartbeat activity
Dieser Abschnitt ist sehr wichtig. Hier geht es darum zu bestimmen wie die Heartbeat API in den einzelnen Bereichen (Backend, Editor und Frontend) geregelt werden soll. Standardmäßig stehen alle Bereiche auf „Reduce“ also „Reduzieren“. Diese Einstellung solltest du auch so bestehen lassen. Verbietest du es komplett, können deine Beiträge zum Beispiel nicht mehr automatisch gespeichert werden. Außerdem kann das auch zu Problemen mit Plugins führen.
Add-Ons
In den Add-ons hast du die Möglichkeit verschiedene Dienste mit WP Rocket zu kombinieren. Dazu gehört zum Beispiel Google Analytics und der Facebook Pixel. Setzt du ein solches Add-On ein, kannst du die entsprechende Option aktivieren. Ansonsten brauchst du dich hier um nichts weiteres zu kümmern.
Image Optimization
Im Bereich Image Optimization schlägt WP Rocket dir vor, dass Plugin Imagify für die Optimierung deiner Bilder zu nutzen:
Ich möchte dir das an dieser Stelle ebenfalls empfehlen. Das Plugin läuft einfach am saubersten und unkompliziertesten in Verbindung mit WP Rocket. Im nächsten Abschnitt möchte ich dir ganz genau zeigen, wie du das Plugin nutzt und die richtigen Einstellungen bei WP Rocket vornimmst.
Schritt 4: Bilder optimieren mit WP Rocket und Imagify
In den Einstellungen zu WP Rocket sind die Bilder das ein oder andere Mal schon zur Sprache gekommen. Unter anderem als es um die Bild Optimierung und die Ausgabe von s.g. WebP Bildern ging.
Genau diese Optimierungsmöglichkeiten bringt Imagify mit. Bilder können automatisch komprimiert und verkleinert werden. Das spart Ladezeit. Außerdem können Bilder mit Imagify automatisch in WebP Bilder konvertiert werden. Unterstützt der Browser WebP, liefert WP Rocket diese dann aus um wieder Ladezeit und Dateigröße einzusparen.
So gehst du bei der Installation und Einrichtung richtig vor:
Imagify installieren
Zur Bildoptimierung und Umwandlung in WebP Dateien empfehle ich dir das Plugin „Imagify“. Dieses Plugin von den Entwicklern von WP Rocket ist kostenlos und kann ganz einfach über das Pluginverzeichnis von WordPress installiert werden.
Nachdem du Imagify installiert und aktiviert hast, kommst du zur Einrichtung. Hier wirst du gebeten dir zunächst einen kostenlosen Account zu erstellen. Klicke hierzu einfach auf den entsprechenden Button und gebe deine E-Mail Adresse ein. Anschließend erhältst du per Mail den API Schlüssel.
Kopiere dir den API Schlüssel aus der E-Mail und füge Ihn unter Punkt 2 bei Imagify ein. Das war es schon. Jetzt können wir mit den Einstellungen starten.
Imagify einstellen
Imagify ist schon soweit voreingestellt, dass du eigentlich gar nicht groß etwas ändern musst. Dennoch möchte ich dir kurz die Einstellungsmöglichkeiten erklären:
In den allgemeinen Einstellungen hast du zunächst die Möglichkeit die Optimierungsstufe einzustellen. Standardmäßig ist hier „Aggressiv“ ausgewählt. Für die meisten Fälle ist das die richtige Einstellung.
Bei der Optimierung geht natürlich etwas Qualität verloren. Hast du zum Beispiel ein Fotografie – Blog, spielt die Bildqualität eine besonders hohe Rolle. Hier könntest du dann zum Beispiel auch auf die Stufe „Normal“ wechseln.
In der Optimierungsstufe „Ultra“ werden die Qualitätsverluste schon deutlicher sichtbar. Dafür wird die Dateigrößer aber natürlich noch kleiner. Ist die Qualität deiner Bilder nicht so wichtig, kannst du natürlich auch diese Optimierungsstufe wählen.
Um dir die Auswahl zu erleichtern, erreichst du über den Buttons „Vergleichsübersicht nutzen“ auch ein Bildvergleich. Hier kannst du dir sowohl die optischen Unterschiede als auch Ersparnis in der Dateigröße gegenüber dem Original genau ansehen:
„Backup der original Bilder“ empfehle dir immer immer angeschaltet zu lassen. Sollte bei der Komprimierung einmal ein Ergebnis herauskommen, mit dem du nicht zufrieden bist, kannst du so noch auf die unkomprimierten Bilder zurückgreifen.
Die Funktion „EXIF-Daten deiner Bilder erhalten“ muss in der Regel nicht aktiviert werden. Die Funktion ist eigentlich nur interessant, wenn du die Meta Daten deiner Bilder irgendwo anzeigen lässt.
Bei den weiteren Optimierungen sollten die Einstellungen, die bereits automatisch von Imagify getätigt werden, bestehen bleiben.
Ich empfehle dir hier noch zu überlegen, welche maximale Größe die Bilder auf deiner Website haben. Hast du zum Beispiel ein großes Bild auf der Startseite, was die komplette Seitenbreite füllt, solltest du die Funktion „Größere Bilder verkleinern“ entsprechend anpassen. Gleiches gilt aber auch, wenn du auf deiner Website keinerlei Große Bilder einsetzt. Dann kann die maximale Größe natürlich auch verkleinert werden.
Ein wichtiger Punkt ist auch noch die Datei-Optimierung:
Hier kannst du festlegen, welche von WordPress automatisch erzeugten Bildgrößen ebenfalls von Imagify optimiert werden sollen.
Gerne erkläre ich dir kurz was genau damit gemeint ist.
Lädst du ein Bild bei WordPress hoch, wird es von WordPress je nach Bildgröße auf bis zu 4 feste Größen skaliert. Je nachdem welches Theme du nutzt, können hier auch noch weitere Bildgrößen dazukommen.
Das hat erst einmal den Vorteil, dass du das Bild in passenden Größer ausliefern kannst. Wird nur ein Vorschaubild von 150 x 150 Pixeln benötigt, muss das Bild dann auch nur in dieser Größe geladen werden. Das spart Ladezeit.
Bei Imagify bringt das aber ein kleines Problem mit. Das Plugin konvertiert monatlich nur 25 MB (etwa 250 Bilder). Hast du sehr viele Bilder und dazu auch noch sehr viele zusätzliche Bildgrößen, ist dieses Kontingent schnell erschöpft.
Um das zu Verhindern solltest du in der oben gezeigten Auswahl auch wirklich nur die Bildgrößen auswählen, die du auch nutzt.
Hast du alle Einstellungen getroffen kannst du jetzt am Ende der Seite auf den Button „Speichern und zur Mengen – Optimierung gehen“ klicken.
Imagify Mengenoptimierung
In der Mengen Optimierung hast du verschiedene Möglichkeiten Daten zur Optimierung deiner Bilder einzusehen. Hast du noch keine Bilder optimiert, sieht dieses Dashboard so aus:
Im Überblick siehst du zum Beispiel wie groß die Ersparnis deiner Bilder ist. In der Grafik daneben kannst du einsehen, wie viele deiner Bilder bereits optimiert wurden.
In der Box „Dein Konto“ siehst du wie viel „Guthaben“ dir noch zur Verfügung steht. Wie bereits erwähnt sind 25 MB monatlich inklusive. Sollte dir das nicht ausreichen kannst du über den Button „Welchen Tarif brauche ich?“ Auch noch weiteres Volumen dazu buchen. Hier empfehle ich dir auf den „Einmal – Tarif“ zurückzugreifen. 1GB reicht bei einer normalen Website bzw. Einem Blog in der Regel für viele Monate aus.
Unter „Optimiere deine Media-Dateien“ kannst du, sobald du die Mengen – Optimierung gestartet hast, „live“ verfolgen wie deine Bilder optimiert wurden.
Um die Mengenoptimierung zu starten, gehe einmal ans Ende der Seite. Hier findest du den Button „Alle optimieren“. Nachdem du den Button angeklickt hast, bekommst du noch einige Hinweise. Unter anderem den Hinweis, dass deine Seite geöffnet bleiben muss um die Bilder zu optimieren. Du kannst aber natürlich in einem anderen Browsertab weiter arbeiten.
Je nachdem wie viele Dateien du hast, kann die Mengenoptimierung einige Zeit dauern.
Einstellungen zur Bildoptimierung bei WP Rocket
Zu guter letzt müssen bei WP Rocket nun noch die Einstellungen zur Auslieferung der WebP getroffen werden. Gehe dazu in deinem WordPress Dashboard auf „Einstellungen > WP Rocket“. Hier kannst du nun im Reiter „Medien“ den Haken bei „WebP compatibility“:
Hier siehst du jetzt auch am Kommentar unter der Checkbox, dass WP Rocket erkannt hast das du Imagify nutzt. Speichere nun noch deine Änderungen. Damit werden deine Bilder in Browsern, die WebP unterstützen nun entsprechend ausgeliefert. Dazu gehören zum Beispiel Google Chrome, Firefox, Edge oder Opera.
Schritt 5: Ladezeiten erneut testen
Nachdem wir uns jetzt so lange mit den Einstellungen beschäftigt haben, steigt nun die Spannung, was uns die Optimierungen gebracht haben. Damit du einen guten Vergleich hast, zeige ich dir hier die Screenshots meiner Tests vorher und nachher direkt beieinander:
Page Speed Insights Mobil vor WP Rocket
Page Speed Insights Mobil nach WP Rocket
Page Speed Insights Desktop vor WP Rocket
Page Speed Insights Desktop nach WP Rocket
Web Page Test vor WP Rocket
Web Page Test nach WP Rocket
Du siehst die Verbesserungen sind enorm. Fast 4 Sekunden Ladezeit konnten laut webpagetest.org wir durch die Optimierungen mit WP Rocket und Imagify einsparen. Auch die Page Speed Scores haben sich erheblich verbessert. Mobil haben sich die Werte um mehr als 20 Punkte verbessert, in der Desktop Version sogar um 30 Punkte.
Fazit: WP Rocket ist das Tool zur Ladezeit – Optimierung
Mit WP Rocket kann man auch als Laie seine Website schnell, einfach und unkompliziert optimieren. In meiner Schritt für Schritt Anleitung hast du nun alle Einstellungsmöglichkeiten kennengelernt und kannst deine Ladegeschwindigkeit nun schnell verbessern.
Nicht nur die Ladegeschwindigkeit verbessert WP Rocket, sondern auch die Datenmenge. Damit stellst du sicher, dass deine Seite gerade auf mobilen Geräten nicht allzu viel Datenvolumen frisst und selbst bei schlechter Verbindung immer noch relativ schnell lädt.
Aber allein mit diesem Optimierungen ist es nicht unbedingt getan. Du solltest auch stets drauf achten, dass du deine Bilder nur in der Größe anbindest, die wirklich benötigt wird. Auch das spart Ladezeit und Datenmenge.
Außerdem solltest du besonders rechenintensive Medien nie auf deinen eigenen Server hochladen. Dazu zählen zum Beispiel Videos oder Audiodateien. Lade diese lieber bei Drittanbietern zum Beispiel Youtube hoch.
Und: Nutze nur Plugins, die du auch wirklich benötigst. Jedes Plugin bringt eigenen Ballast mit und wird deine Ladezeit dadurch etwas verschlechtern. Auch wenn ein Plugin nicht so große Auswirkungen hat, nutzt du viele Plugins macht sich das wieder bemerkbar.
Häufige Fragen zu WP Rocket
Warum sind gute Ladezeiten so wichtig?
Die Ladezeiten einer Website sind vor allem für die User wichtig. Studien haben ergeben, dass 3 Sekunden Ladezeit eine „magische Grenze“ ist. Lädt eine Seite länger ist die Chance, dass die User die Seite wieder verlassen deutlich höher. Auch wirkt sich eine längere Ladezeit negativ auf die Conversion aus. Das heißt du erzielst weniger Verkäufe, Eintragungen oder Anfragen als mit einer schnellen Website.
Eine Ladezeit die nicht extrem langsam aber in Ordnung ist, wirkt sich nicht unbedingt direkt auf die Rankings aus, aber: Die Nutzererfahrung ist ein sehr wichtiger Rankingfaktor. Das heißt, ist deine Ladezeit zu hoch und viele User springen dadurch schnell ab, wirkt sich das negativ auf die Nutzererfahrung aus. Das wiederum wird sich dann auch negativ auf deine Rankings auswirken.
Außerdem ist 2021 mit einem Google Update zu rechnen, das Wert auf die s.g. Web Vitals legt. Auch hier geht es um Kennzahlen, die die Nutzererfahrung in einheitlichen Qualitätssignalen widerspiegelt.
Warum Geld für WP Rocket ausgeben?
Neben WP Rocket gibt es natürlich auch noch viele weitere Cache Plugins für WordPress. Einige darunter sind sogar kostenlos. Warum also Geld ausgeben?
Ich habe einige Cache Plugins getestet und hier stundenlang Ladezeiten, Dateigrößen und Benutzerfreundlichkeit verglichen. Hier bin ich ganz klar zu dem Entschluss gekommen, dass WP Rocket klar die Nase vorn hat. Genau deswegen möchte ich dir auch raten diese 44€ zu investieren. Es erspart dir einfach viel Arbeit und viele Probleme mit deiner Website.
Reicht es meine Website nur mit WP Rocket zu optimieren?
WP Rocket ist ein Caching Plugin, mit dem du viele wichtige Faktoren verbessern kannst, die dann zu besseren Ladezeiten und geringeren Dateigrößen führen. Das alles bringt dir aber nicht viel, wenn der Server furchtbar langsam ist. Bei günstigen Shared Hosting Paketen ist das leider häufig der Fall. Hier können die besten Optimierungen deine Ladezeit trotzdem nicht auf einen grünen Zweig bringen.
Hier empfehle ich dir definitiv den Hoster oder das Hostingpaket zu wechseln. Empfehlen kann ich dir hierbei konkret Domain Factory. Domain Factory bietet nicht nur beste Antwortzeiten, sondern einen super Kundenservice. Ich selbst nutze DomainFactory bereits seit über 10 Jahren und kann dir diesen Hoster nur ans Herz legen.
Mein Tipp: Sichere dir jetzt 25€ Prämie bei Domain Factory
Entscheide dich jetzt für Domain Factory als deinen zuverlässigen Hostinganbieter und sichere dir sofort 25€ Prämie.
Aber nicht nur dein Hoster spielt eine wichtige Rolle, sondern auch der allgemeine technische Zustand deiner Website. So kann zum Beispiel auch ein extrem aufgeblähtes Theme für sehr hoch Ladezeiten sorgen. Aber auch ein schlechter Page Builder kann dafür sorgen, dass deine Website langsamer lädt.
Falls du hiermit Probleme hast, kann ich dir nur die Produkte von Thrive Themes ans Herz legen. Der sowohl der PageBuilder Thrive Architect als auch der Themebuilder Thrive Themes Builder konnten in unseren Tests sehr gut abschneiden und ermöglichen super schnelle Ladezeiten.
Zu guter letzt möchte ich dich auch nochmal auf das Thema Plugins aufmerksam machen. Für jedes Plugin das du auf deiner WordPress Website einsetzt, kommen neue Javascript Dateien dazu, die meist direkt zu Beginn geladen werden müssen. Dadurch verschlechtert sich nicht nur die Gesamtladezeit, sondern vor allem auch die gefühlte Ladezeit für die Nutzer. Damit meine ich, wie lange es dauert bis der User das Gefühl hat deine Website wäre geladen und er kann sie bedienen. Das wiederum erhöht natürlich die Absprungrate. Deshalb versuche so gut es geht auf Plugins zu verzichten. Setze wirklich nur die Plugins ein, auf die du nicht verzichten kannst.
Beachtest du meine Tipps und Hinweise wirst du mit WP Rocket schnell die besten Ladezeiten erreichen.
Ich hoffe meine Anleitung konnte dir helfen deine Website Ladezeiten zu optimieren. Solltest du Fragen oder Probleme haben, hinterlasse mir gern einen Kommentar.
Möchtest du mich unterstützen?
Gerne stelle ich dir diese Inhalte auf der Online Marketing Site kostenfrei zur Verfügung.
Ich verlange dafür kein Geld und erwarte auch keine Spenden. Aber ich freue mich sehr, wenn du mich dabei unterstützt, meine Inhalte zu verbreiten.
So kannst du mich unterstützen:
Verlinke diesen Beitrag auf deiner Website / deinem Blog
Teile diesen Beitrag auf deinen Social Media Profilen
Bewerte diesen Beitrag mit fünf Sternen
[Gesamt: 1 Durchschnitt: 5/5]
