Ladezeit deines WordPress-Blog optimieren

Die Ladezeit einer Webseite wird für das Ranking bei Google immer wichtiger. Daher solltest du dich besser früher als später damit beschäftigen. Leider ist das Thema immer noch sehr technisch und es gibt nur wenig, was für WordPress-Selbstadministratoren leicht verständlich aufbereitet ist. In diesem Post stelle ich mein Vorgehen vor, wie ich für den Blog geekyorganizer.com die Ladezeit optimiert habe.

Warum solltest du dich mit der Ladezeit deines Blogs beschäftigen?

Im März habe ich an der Rock the Blog 2016 teilgenommen. Dort hat Rohit Dhawan von Google über „Improving User Engagement in Today’s Mobile and Social World“ gesprochen. Er stellte vor, dass mobile Zugriffe immer mehr werden und dass gerade bei mobilen Geräten aber die Ladezeit besonders relevant sei. Nach den Untersuchungen von Google gibt der mobile Nutzer einer Webseite maximal 5 Sekunden zum Laden, bevor er den Besuch abbricht.

Rohit forderte dann alle Zuhörer auf, ihre Seiten mit einem mobilen Gerät aufzurufen und einfach durch zählen abzuschätzen, ob die eigene Seite unter 5 Sekunden kommt. Was soll ich sagen. Meine Ladezeit lag eher bei 7 Sekunden. Wieder zu hause habe ich mich daran gemacht, das zu verbessern. Schon nach kurzer Zeit war ich hinreichend eingeschüchtert, weil man mit allem, was Ladezeit optimiert, einiges auf der Webseite kaputt machen kann. Um ein bisschen Einlesen und Recherchieren kommst Du also nicht herum.

Einen guten Einstieg bietet die Dokumentation des Premium-Plugins „WP Rocket“. Hier gibt es gute Erklärungen, wie die Dinge funktionieren, was sie tun und wofür sie gut sind. Leider alles auf Englisch. Wenn es etwas tiefer gehen soll, finde ich die Artikelreihe „High Speed: Was WordPress-Websites wirklich schnell macht“ von Dr. Web sehr gut.

Damit kannst du die Ladezeit messen

Am besten schaust du als erstes, wie die Geschwindigkeit deiner Webseite aktuell ist. Wie gesagt – deutlich unter 5 Sekunden, da soll sie hin. Es gibt zwei Tools, die du für eine Messung verwenden kannst den Speed Test von Pingdom und Google PageSpeed Insights.

Für den Speed Test von Pingdom folgst du dem Link oben. Hier gibst du die URL deiner Webseite ein und wählst unter „Test from“ Stockholm aus, wenn du vorwiegend Leser aus Europa hast. Du bekommst nicht nur die Ladezeit deiner Seite in Sekunden, sondern auch noch diverse Infos, was wie lang lädt. So kannst du ggf. analysieren, wo es hakt. Inzwischen zeigt die Seite auch einen Teil der Ergebnisse von Google PageSpeed Insights mit an.

Bei Goole PageSpeed Insights gibt es zwei Aspekte, die du kennen solltest:

  • Google misst nicht wirklich die Ladezeit, sondern vergibt einen Score aufgrund verschiedener Parameter.
  • Du musst zwischen zwei Messungen 30 Sekunden warten.

Bei Google PageSpeed bekommst du eine qualitative Bewertung der Ladezeit. Zu den einzelnen Einträgen gibt Google immer auch Infos, wie du das ggf. verbessern kannst. Außerdem bekommst du eine Empfehlung, ob eine Verbesserung unbedingt gemacht werden sollte oder eher ein Nice-To-Have ist. Was die dringend empfohlenen Verbesserungen angeht, ist das so eine Sache. Ich bin hier auf Einträge gestossen, die ich einfach mit Bordmitteln und meinen beschränkten Entwicklerkenntnissen schlicht nicht umsetzen kann. Das muss also erstmal so bleiben.

Welche Caching-Methoden gibt es?

Sobald du dich mit der Optimierung der Ladezeit deiner Webseite beschäftigst, stolperst du über das Wort „Caching“. Das ist der Hauptansatzpunkt, wie du deine Ladezeiten verbessern kannst. Dabei gibt es verschiedene Methoden.

gzip-Komprimierung

gzip-Komprimierung muss Server-seitig aktiviert sein, damit du es nutzen kannst. Hier lohnt sich eine Suche in den Foren deines Hosters. Wenn du es aktivieren kannst, dann bringt das alleine schon ziemlich viel.

Browser-Caching

Mit Browser-Caching forderst du die Browser deiner Besucher auf eine Version deiner Seite im Browser-Cache zu speichern. Damit verkürzt sich die Ladezeit deiner wiederkehrenden Besucher. Google belohnt allein schon das Aktivieren dieser Funktion spürbar.

Minifizierung

Unter Minifizierung versteht man das Zusammenfassen von HTML/CSS-Dateien oder auch Skripten, die auf deiner Seite geladen werden. Das bringt auch schon einiges, da es aber je nach Theme und Plugins immer wieder Dateien gibt, die sich nicht ohne weiteres minifizieren lassen, wenn du kein Entwickler bist, bleibt hier immer etwas übrig, worüber Google meckert.

Page-Caching

Beim Page-Caching werden statische HTML-Versionen deiner Seiten auf deinem Server vorgehalten und bei Anfrage ausgegeben. Das beschleunigt die Anzeige von Inhalten für deine Nutzer, da keine Datenbankabfrage gemacht werden muss.

Datenbank-Caching

Datenbank-Caching ist besser als gar kein Caching, aber so richtig viel bringt das nicht. Hier werden anders als beim Page-Caching keine statischen HTML-Seiten gespeichert, sondern die Datenbank-Abfragen. Bei mir brachte die Aktivierung keinerlei Effekt.

Objekt-Caching

Und mit dem Objekt-Caching geht es noch eine Stufe weiter in die Datenbank und es werden nur noch Objekte der Datenbank gespeichert, um schneller abgefragt zu werden. Das bringt noch weniger, als das Datenbank-Caching.

Content Delivery Network (CDN)

Mit CDNs werden Media-Dateien auf zentrale Server (nicht deinen) hochgeladen und von dort optimiert ausgegeben. Die Photon-Option von Jetpack ist so ein CDN. Es streiten sich die Geister im Netz, ob das für Seiten mit einer europäischen Zielgruppe überhaupt was bringt oder die Ladezeiten durch den Standort des CDN (meist USA) nicht sogar länger werden. Ich habe bisher aber niemanden gefunden, der das mal richtig gemessen hat.

WordPress-Plugins für Caching

Wenn du dich ein bisschen einliest, merkst du schnell, dass das ein sehr technisches Thema ist. Oft wird auf die Gefahr hingewiesen, dass du dir mit irgendeiner Einstellung die ganze Seite lahm legen kannst. Von daher an dieser Stelle der Disclaimer:

Egal, was du tust, um deine Ladezeiten zu verbessern, mache immer, immer, immer VORHER Backups von deiner Seite.

Obwohl die wohl effektivsten Methoden – gzip-Komprimierung und Browser-Caching – theoretisch direkt über die htaccess eingestellt werden können, habe ich mich dafür entschieden, ein Plugin einzusetzen, da ich mir das schlicht nicht zugetraut habe. Bei der Suche nach Caching-Plugins stösst du schnell auf die üblichen verdächtigen wie W3 Total Cache, Cachify, WP Super Cache und WP Rocket (es gibt noch viele mehr…).

Cachify

Cachify hat viele begeisterte Anhänger, da es wirklich einfach zu bedienen ist. Mich hat es nicht überzeugt, da die einfache Bedienung bei mir auf Kosten der Ladezeit-Optimierung ging. Ja, es gab einen Effekt, aber das war sehr klein, daher habe ich es wieder deinstalliert und mich weiter umgeschaut.

WP Rocket

WP Rocket ist ein Premium-Plugin, zu dem es keine freie Version im WordPress-Repository gibt. Es scheint aber nach allem, was man hört und liest, sehr gut zu sein. Mich haben aber drei Dinge abgehalten:

  • Es gibt nirgendwo auf der Webseite Screenshots oder ähnliches, die einem die Oberfläche des Plugins nach der Installation zeigen. Es gibt zwar eine sehr schöne Doku, aber ich hatte trotzdem das Gefühl die Katze im Sack zu kaufen.
  • Es gibt keine Testversion. Du musst das Plugin kaufen und hast eine 30-Tage-Geld-Zurück-Garantie. WP Rocket behält sich aber vor, deine Unzufriedenheit zu analysieren und dir bei der Problemlösung zu helfen. Sprich, einfach mal ausprobieren, wenn du es nicht wirklich verwenden willst, geht nicht.
  • Was mich letztendlich abgehalten hat, war das Lizenzmodell. Du kannst eine Lizenz für eine Webseite kaufen und diese entweder auf 3 Webseiten oder beliebig viele Webseiten erweitern. Letzteres lohnt sich erst ab der 6. Webseite. Wenn du nun zwei oder vier Webseiten hast, zahlst du immer Lizenzkosten, die du nicht brauchst. Es gibt nicht die Möglichkeit zwei einzelne Lizenzen zu kaufen und diese später zu einer Dreier-Lizenz zu kombinieren, wenn die dritte Webseite dazukommt.

Abgesehen davon ist WP Rocket nicht billig. Mit einer einzelnen Seite bist du mit 39$ Erstinvest und jährlich 19$ Update/Pflege dabei. Wenn das Lizenzmodell und der Preis für dich okay sind, solltest du einen genaueren Blick darauf werfen. Man liest im Netz nur gutes über WP Rocket.

W3 Total Cache

Da mich bei WP Rocket das Lizenzmodell abgeschreckt hat, habe ich mich bei der kostenlosen Konkurrenz umgesehen und bin bei W3 Total Cache fündig und bisher glücklich geworden.

Das Plugin hat (sehr) viele aktive Installationen. Dass es gratis ist, erkaufst du dir durch Werbung für die Premium-Version, deren Nutzen sich mir aber noch nicht erschlossen hat. Die freie Version kann alles, was ich brauche.

Es gibt sehr viele Einstellungs-Optionen. Ich finde aber wirklich schön, dass du auf einer Seite in den Einstellungen alle verfügbaren Caching-Mechnismen in der empfohlenen Standardkonfiguration aktiveren kann. Das ist für Dummies. Erst, wenn du einen Mechanismus speziell tweaken möchtest, musst du in die Detaileinstellungen – und dann solltest du wissen, was du tust (und ein Backup vorher machen). Out of the box funktioniert das Plugin aber bereits super und hat meine Ladezeit runter auf ca. 2 Sekunden gebracht.

Gegenüber WP Rocket fehlt W3 Total Cache eine Funktion, für die du ein separates Plugin benötigst: Lazyload für Bilder.

Was hat noch Einfluss auf die Ladezeit?

Neben dem Caching bin ich noch über drei weitere Aspekte gestossen, die meine Ladezeit beeinflussen.

Serverantwortzeiten

Bei meinem Hoster für geekyorganizer.com mäkelt Google PageSpeed Insights immer die Serverantwortzeiten als zu langsam an. Ich habe nicht das kleinste Webhosting-Paket, aber könnte auch bezahlbar noch ausbauen. Parallel bin ich aber mit einer anderen Seite zu dem schweizer Hoster cyon* gewechselt. Hier gibt es kein Gemäkel von Google. Ich kann cyon generell empfehlen (Stichwort: Let’s encrypt und http/2) und werde auch mit geekyorganizer.com in absehbarer Zeit dorthin umziehen.

Das verwendete WordPress-Theme

Einen weiteren Effekt, den ich zwischen den beiden Seiten deutlich sehe, geht auf das verwendetet Theme zurück. Auf geekyorganizer.com ist Twenty Sixteen im Einsatz, auf der anderen Seite GeneratePress*. Beide haben unterschiedliche Vor- und Nachteile, was die Ladezeit angeht.

Optimierte Bildgrößen

Und das dritte sind die optimierten Bildgrößen. Hier wird WordPress mit jeder Version besser und ich bin derzeit auch ohne Lazyload-Plugin schon ganz zufrieden.

Weitere Quellen rund um das Thema Ladezeit

Dieser Post ist ein Beitrag zum #bloggeralphabet von neontrauma.de „L wie Ladezeit“.

Schreibe einen Kommentar