Wordpress Pagespeed verbessern

Viele Projekte von Orange Raven im Bezug auf SEO sind Seiten, welche wir übernehmen nachdem andere Agenturen die Seite in irgendeiner Form verschlimmbessert haben. Wir haben bereits vor Jahren aufgehört uns zu wundern, welche Arbeit andere „Agenturen“ abliefern und dafür auch noch 4-Stellige Summe von den Kunden verlangen.

Ein Punkt, welcher besonders bei WordPressseiten immer wieder stark ins Gewicht fällt ist das Thema Pagespeed, also die Optimierung der Seitengeschwindigkeit.

Wie finde ich heraus, wie schnell meine Seite ist?

Dazu gibt Google den Betreibern ein eigenes Tool an die Hand: Pagespeed Insighs. Mit Hilfe dieses Tools kann jeder die Performance der eigenen Seite messen.

Wichtig zu wissen ist dazu, dass das Pagespeed Tool von Google nicht der Weisheit letzter Schluss ist. Vielmehr gibt das Tool eher so etwas wie eine ungefähre Orientierung, wo man leistungstechnisch steht. Es kommt nicht darauf an, dass die Seite nach möglichkeit 100/100 Punkten hat. Auch eine Seite im 80er Bereich kann ausreichend schnell sein. Und eine Seite mit einer niedrigeren Punktzahl kann deutlich besser ranken als eine Seite mit einer hohen Punktzahl. Es macht also keinen echten Unterschied ob 80/100 Punkten oder 84/100 Punkten. Es macht aber sehr wohl einen Unterschied ob man 31 Punkte oder 80 Punkte hat.

Eine Seite ist vor allem dann schnell, wenn sie weniger als 2 MB, besser noch 1 MB oder weniger lädt und weniger als 3 Sekunden für den Aufbau benötigt. Dazu ist natürlich auch ein guter Server unerlässlich. Oft liegen lange Ladezeiten an einer schlechten Performance beim Hoster, weil das Paket nicht leistungsstark genug ist. Hier sollte man also nicht sparen und lieber 5 € mehr pro Monat ausgeben.

Wie kann eine WordPressseite beim Pagespeed schneller werden

Da WordPress ein sehr nutzerfreundliches System ist, gibt es zahlreiche Möglichkeiten die Geschwindigkeit der eigenen Seite zu verbessern.

Möglichkeit 1: Pro Theme statt Free Theme nutzen

Viele nutzen bei WordPress ein Free Theme, welches sich einfach installieren lässt. Im Bezug auf den Pagespeed ist davon einfach abzuraten. Free Themes sind häufig nur einfache Versionen von großen Designs oder haben keine regelmäßige Wartung. Die meisten großen Pro Themes (z.B. Enfold von Kriesi.at) bieten eigene Performance Optionen, welche helfen die Seitengeschwindigkeit zu optimieren. So kann man bei den meisten Pro Themes problemlos die Scripte verringern, festlegen welche Daten nicht immer geladen werden sollen und wo eine sogenannte Kompression von Daten möglich ist, ohne dass die Funktionen eingeschränkt werden.

Mit Hilfe von 30-40 € Einsatz kann man so also schon den eigenen Pagespeed massiv verbessern. Mal ganz von der Tatsache abgesehen, dass Pro Themes noch viele weitere Vorteile bieten.

Möglichkeit 2: Bilder im Vorfeld optimieren und nur .jpg Dateien verwenden

Einer der häufigsten Fehler, die zu großen Datenmengen führt ist das Verwenden von .png Dateien. Diese haben zwar den Vorteil, dass sie ohne weißen Hintergrund stehen, sind aber kaum reduziert und somit sehr groß. Man sollte daher .png Dateien ausschließlich einsetzen, wenn keinerlei andere Möglichkeit besteht. So kann man Icons gegen .gif Dateien ersetzen oder auf eingebettet Font-Icons zurückgreifen. Andere Style-Elemente lassen sich meist mit .jpg Dateien ersetzen.

Auch sollte man von .svg Dateien absehen. Zwar gibt es mittlerweile einen Trend zur Verwendung, da diese verlustfrei vergrößert und verkleinert werden können (Stichwort: Vektorgrafik), aber die datensparsamere Lösung ist nach wie vor die Verwendung von verschieden großen .jpg Dateien auf verschiedenen großen Displays.

.jpg Dateien sollten auch nicht einfach hochgeladen werden. Besser ist es, sie im Vorfeld per Photoshop, Gimp oder einer anderen Bildsoftware auf die passende Größe zu schneiden und dann mit leichter Reduzierung zu speichern. Auf diese weise lassen sich bereits im Vorfeld viele MB an Daten vermeiden.

Möglichkeit 3: Bildoptimierung per Plugin

Selbst im Vorfeld optimierte Bilder lassen sich mit Hilfe eines guten Plugins noch weiter reduzieren. Orange Raven arbeitet hierbei häufig mit EWWW Image Optimizer. Dieser hat zwei entscheidende Vorteile, auch in der Free-Version: Er optimiert die Bilder bereits beim Hochladen und es ist eine Stapelverarbeitung für alle bereits hochgeladene Bilder möglich. In unseren Test gelang uns eine Reduzierung der Dateigrößen um 10 – 25 %, selbst bei voroptimierten Bildern, ohne dass es einen sichtbaren Qualitätsverlust gab. Auf diese Weise konnten noch einmal relevante Datenmengen eingespart werden.

Möglichkeit 4: Cache Plugins

WordPress ist ein dynamisches System auf php Basis. Das bedeutet, dass mit jedem Seitenaufruf eine Reihe Quellcodes abgerufen werden, die bestimmte Befehle auf dem Server auslösen um bestimmte Daten aus einer MySQL-Datenbank zu laden. Dieser Prozess benötigt Rechenleistung und damit Zeit. Diese Funktion ist wichtig, damit man Seiten ohne Programmierkenntnisse bearbeiten kann oder Nutzer mit der Seite interagieren können. Was schneller lädt sind statische html-Seiten, wie sie in den Anfängen des Internets verwendet wurden, als noch niemand Begriffe wie CMS oder Plugin kannte.

Mit Hilfe von Cache Plugins kann man aber eine sinnvolle Zwischenlösung schaffen. Aus den dynamischen Seiten werden statische Seiten erzeugt, die dem Nutzer zur Verfügung gestellt werden. Dadurch reduziert sich die Serverlast enorm, da die Verarbeitung über die Datenbank wegfällt. Plugins wie WP Fastes Cache oder WP Super Cache leisten darüber hinaus noch mehr. Mit ihrer Hilfe ist es möglich die Menge der Scripte zu reduzieren oder bestimmte Style-Informationen (z.B. CSS) zu reduzieren, ohne dass die Funktion der Seite beeinträchtigt wird. Auf diese Weise kann man den Speed der eigenen Seite noch einmal stark verbessern.

Auch hier gibt es die Möglichkeit für Free-Versionen, die schon viel mitbringen und den Pro-Versionen, die mehr mitbringen.

Wie stark lässt sich der Pagespeed von WordPress verbessern

Das soll an einem aktuellen Beispiel gezeigt werden, das auch Ideengeber für diesen Beitrag war.

Es geht um die Seite einer lokalen Werkstatt hier in Chemnitz. Die umgesetzte WordPresseite kann nur mit „Katastrophe“ beschrieben werden und es war Aufgabe von Orange Raven die WordPressseite grundlegend zu optimieren. Neben vielen technischen Problemen, verkorksten Style-Problemen und einer nicht vorhandenen SEO-Optimierung war auch der Pagespeed ein Problem:

Schlechter Pagespeed

Der Fokus wurde zunächst auf die Desktop-Seite gelegt, da in einem nächste Schritt die Seite sowieso noch einmal vollständig mobil optimiert wird.

Es waren ca. 6 MB an Daten, welche übertragen wurden. Die Seite benötigte über 6 Sekunden zum Aufbau.

Was wurde gemacht:

  • Sämtliche verwendete Bilder (vor allem als Slider im Kopfbereich jeder Seite) wurden per Photoshop optimiert (Redukt
  • EWWW Image Optimizer wurde verwendet die Bilder nochmals zu optimieren, sowie bestehende Bilder auf dem Server zu optimieren
  • Per WP Fastes Cache wurden diverse reduzierungen aktiviert
  • Das verwendete Avada Theme wurde optimiert und nutzlose CSS-Anpassungen wurden entfernt

Das Ergebnis:

Pagespeed Optimiert

Die mobile Seite krankt noch an einem einzelnen Script, der jedoch in der nächsten Optimierung entsprechend angepasst wird.

Unser SEO Whitepaper analysiert übrigens auch den Pagespeed.