26 Tipps um WordPress Webseiten schneller zu machen

Die Geschwindigkeit einer Webseite zu optimieren ist eine der einfachsten und effektivsten Wege, die Surferfahrung eines Webseitenbesuchers zu verbessern. Ganz nebenbei verbessern sich dadurch die Absprungraten, Pageviews und Besuchszeiten. Google dankt es einem durch bessere Rankings. Folgende Möglichkeiten sollten genutzt werden um mehr Pagespeed aus seiner Webseite herauszuholen. (Stand 17.07.2018)

Webseiten schneller machen

Ein kleiner Hinweis vorweg: aufgrund der Menge an Optimierungsmöglichkeiten bitte ich um Nachsicht, dass nur auf die Möglichkeiaten ansich hingewiesen und ggfs. auf weitere Infos weiterverwiesen wird. Auf Pseudobilder-Schnickschnack wurde bewusst verzichtet.

Caching einbauen

Die beste Art eine Webseite schneller zu machen, liegt im Caching. Mit einem sauberen Caching müssen Webseiten nicht dynamisch aus Datenbanken geladen werden, sondern werden statisch auf der Server Festplatte abgelegt und abgerufen. Der Geschwindigkeitsvorteil ist teilweise enorm. Gerade Content Management Systeme wie WordPress profitieren deutlich davon.

Ein sehr gutes Plugin hierfür ist WP Rocket, welches nicht nur die Webseite statisch ablegt, sondern auch in der Lage ist CSS und Javascript Dateien zusammenzufassen und zu minimieren. Ausserdem kann WP Rocket auch Lazyload: Mit Lazyload werden Bilder erst beim Scrollen des Users zum Bild hin geladen. D.h. die Ladezeiten verringern sich massiv. Vor allem der First View, der wichtig dafür ist, ob der User überhaupt auf der Webseite verbleibt. Man sagt, dass nach 3 Sekunden Ladezeit der User verschwindet. Das halte ich immer etwas für übertrieben, aber je kürzer die Ladezeit, desto besser.

Caching Plugin für WordPress

Ein schneller Server

Webhoster horten bei billigen Verträgen häufig viele Webseiten auf einem einzigen Server und garantieren keine Bandbreiten. Dadurch werden Webauftritte langsamer. Achten Sie also darauf, dass Sie nicht den billigsten Vertrag abschließen und verlassen Sie sich auf Erfahrungswerte anderer Webmaster.

Hier ein Beispiel für einen guten Webhoster. Hier findest du eine Übersicht über sehr empfehlenswerte WordPress Hoster.

Nutzung eines Reverse Proxy

Mithilfe eines Reverse Proxy Servers (z.B. mit Nginx) in Kombination mit einem Apache Webserver, können statische Inhalte direkt von diesem schnellen Proxy bei Anfragen geladen werden. Neue Anfragen werden weiterhin vom Apache Server ausgeliefert. Dadurch wird viel Last vom Webserver genommen und die Webseite teilweise deutliche performanter.

Weitere Infos zu Reverse Proxy Server

PHP optimieren

PHP ist nicht immer gut eingerichtet und hält Optimierungspotential für Webseiten bereit. Mit PHP können MySQL Abfragen zwischengespeichert werden, damit diese nicht immer wieder neu ausgeführt werden müssen. Oft werden zu viele PHP Module geladen, die einen Server schwerfälliger machen.

Weitere Infos um PHP zu optimieren

Nutzung von mod_pagespeed

Betreibt man selber den verwendeten Webserver kann man einen Blick auf das Modul mod_pagespeed von Google werfen. Dieses Modul umfasst 15 Anpassungen, die Webseiten automatisch beschleunigen sollen.

Weitere Infos zu mod_pagespeed

Keep Alive aktivieren

HTTP Keep Alive erlaubt es TCP Verbindungen aufrechtzuerhalten und verringert erneute Anfragen. Manche Webhoster bieten dieses Feature an. Also einfach mal nachfragen.

Weitere Infos zu Keep Alive

GZip Kompression nutzen

Per GZip können Datentransfers zwischen dem Server und dem Browser komprimiert werden. Dadurch reduzieren sich Ladezeiten erheblich. Aktivieren kann man GZip am Server, per PHP, .htaccess und per Plugin (z.B. in WordPress). Am Einfachsten ist es über den Server zu aktivieren.

Weitere Infos zu GZip

Einen CDN nutzen

Mit einem Content Delivery Server (CDN) können bestimmte Daten auf einen externen, hochperformanten Server ausgelagert werden. Oftmals werden dadurch diese Daten schneller geladen. Zudem verringert sich die Last für den eigenen Webserver, der weniger Daten ausliefern muss. Gerade bei Newsletterversendungen kann dies erhebliche Lastersparnis bedeuten. Bei Nutzung eines schnellen Webservers ist ein Performancegewinn allerdings nicht zwangsweise zu erwarten.

Beispiel eines CDN Anbieters

Browser Caching Nutzen

Haben Sie wiederkehrende Besucher auf Ihrer Webseite, können Sie Browser Caching aktivieren um z.B. Bilder für eine bestimmte Zeit zwischenzuspeichern. Dadurch sinkt die Last für den Webserver und die Bilder werden lokal vom Rechner des Besuchers geladen.

Infos zum Einrichten von Browser Caching

Laden von externen Seiten vermeiden

Mal abgesehen von der Nutzung eines CDN, sollte man vermeiden, allzuhäufig Elemente (wie Bilder) von externen Seiten zu laden. Viele Quellen bergen eine höhere Gefahr für längere Ladezeiten. Ist der verlinkte Inhalt auf einem langsamen Server gehostet, kann dies die Ladezeit einer Webseite deutlich verschlechtern.

Werbung vermeiden

Ad-Server, die automatisch Werbung einblenden, können eine Seite quälend langsam machen. Mal abgesehen davon, dass der User über Flash-Lightboxes und riesen Hockeystickbanner nicht gerade begeistert sind.

Redirects vermeiden

Webseiten, die erst durch Redirects erreichbar sind, haben immer mit einer gewissen Latenzzeit zu kämpfen. Vermeiden Sie es also, Ihre Webseite über mehrere Hürden, wie 301 Redirects zu schicken.

Query Strings in URLs vermeiden

URLs, die mit „?“ ergänzt werden und z.B. dynamisch generiert sind, können schlecht gecacht werden, da sie sich wie die Tastenkombination „Strg+F5“ verhalten. Versuchen Sie also klare, statische, suchmaschinenfreundliche URLs zu verwenden, welche nicht dynamisch generiert werden.

Charset festlegen

Um das Browser Rendering zu verbessern, fügt man dem Header das Charset an.

Manche CMS’s setzen dieses (so wie einige andere) Meta Tag dynamisch, indem die Admineinstellung abgerufen wird. Weiß man das Character Set, sollte man dies am besten hart in das Template der Webseite kodieren.

Codes minifizieren

CSS und Javascript Dateien können einfach verkleinert werden. Hierzu nutzt man diverse Tools, die im Netz zu finden sind. Je kleiner die Files sind, desto schneller werden sie geladen.

Code Minifizierer

Fehlerhafte Requests vermeiden

Versucht man auf der Webseite Inhalte wie Bilder oder Scripts zu laden, die aber nicht gefunden werden können, verlängert sich die Ladezeit manchmal bis zum Timeout. Eine fehlerhafte Seite ist somit absolut elementar.

Bilder-Dimensionen angeben

Es ist allgemein bekannt, dass die Angabe von Breite und Höhe eines Bildes, die Ladezeit verringert. So muss der Browser die Größe nicht selbst nach dem Laden der Bilder berechnen und kann so Inhalte schneller korrekt darstellen.

Bildergrößen verringern

Eigentlich eine Selbstverständlichkeit: Zu große Bilder oder Bilder, die zwar groß geladen, aber dann per Bildgrößenangabe nur klein dargestellt werden, können einen Flaschenhals darstellen. Somit sollte man Bilder wirklich nur in der Größe laden, die auch absolut notwendig ist. Bilder sollten zudem über z.B. Photoshop in die kleinste mögliche Webversion komprimiert werden.

Für WordPress gibt es auch Plugins, die unnötige Informationen aus Bildern entfernen. http://wordpress.org/extend/plugins/wp-smushit/

Bilder erst später laden

Mit Lazy Load kann das Laden von Bildern verzögern, bis sie im Viewport erscheinen. Also erst beim Scrollen zum jeweiligen Bild wird dieses geladen.

Javascripts am Ende laden

Gerade Javascript-Dateien oder -Bibliotheken sind manchmal Schwergewichte und sollten, wenn möglich erst zum Schluss geladen werden. Zumindest sollten sie asynchron oder parallel (per async oder defer) geladen werden, so dass andere Inhalte bereits dargestellt werden, solange sie noch nicht zur Verfügung stehen.

Weitere Infos zu async und defer

Dateien kombinieren und Code abspecken

Je weniger Code geladen werden muss, desto schneller ist die Webseite. Entfernen Sie allzuviele Kommentare im Code und vermeiden Sie das Laden von Elementen, die evtl. durch CSS ausgeblendet wurden. Inline CSS sollte komplett vermieden werden. Alles, was problemlos per CSS gelöst werden kann, sollte auch mit CSS gelöst werden.

Ebenso ist es von Vorteil eingebundene Scriptfiles zu vereinen. Man muss nicht für jede Funktion eine eigene Javascript Datei nutzen, die extra geladen werden muss. Die Kombinierung aller Scripts (auch CSS) in ein einziges File ist von Vorteil.

CSS Sprites verwenden

Das Laden von vielen kleinen Bildern dauert länger, als das Laden eines großen Bildes. Nutzt man CSS Sprites, kann man kleine Grafiken (wie Icons) in einer großen Grafik kombinieren und zeigt dann per CSS nur den Bereich des Bildes, der gerade angezeigt werden soll. Dadurch werden weniger Requests an den Server nötig.

Weitere Infos zu CSS Sprites

Plugins in Content Management Systemen vermeiden

CMS’s wie WordPress werden häufig mit Plugins vollgestopft um jede Menge Features einzubauen. Oft aber auch für Features, die man problemlos direkt mit eigenen Funktionen im Template lösen könnte. Je weniger Plugins, desto sicherer und performanter ein System.

Wenn ein Server ein URL ohne ein Slash am Ende lädt, muss der Browser erst herausfinden, ob es sich bei diesem Link um eine Datei oder ein Verzeichnis handelt. Das kostet wertvolle Zeit. Von daher ist es besser, man fügt suchmaschinenfreundlichen URLs ein Slash hinzu.

Weitere Infos zu Slashes in Links

Favicons nutzen

Jeder Browser versucht ein Favicon zu laden und bekommt ein internes 404 Ergebnis, wenn kein Favicon vorhanden ist. Von daher sollte man auch immer ein Favicon laden.

Cookiegrößen in Grenzen halten

Arbeitet man mit Cookies und stopft diese gerne mit Infos voll, muss einem klar sein, dass das Ladezeiten negativ beeinflusst. Von daher sollte man es hierbei nicht übertreiben.

Fazit: Es gibt etliche Möglichkeiten, die Pagespeed zu optimieren. Es sind nicht immer alle nötig. Aber aus dieser Liste an Maßnahmen lässt sich für nahezu jede Webseite die passende Optimierungsmöglichkeit zusammenstellen. Testen kann man die Pagespeed übrigens mit YSlow oder Google PageSpeed.

Letzte Version vom 5. November 2019 von Netzgänger
Jetzt WordPress Newsletter in dein Postfach

Melde dich jetzt für meinen Newsletter an und du erhältst regelmäßig Tipps und Tricks zu WordPress in dein Postfach. Natürlich kannst du ihn jederzeit abbestellen.


33 Kommentare

  1. Vielen Dank. Mit diesem Post wurde alle meine Fragen beantwortet. Beste Grüße aus Regensburg 🙂

  2. Hallo,

    danke für den informativen Artikel! Er hat mir noch ein paar weitere Anregungen für Optimierung gegeben, die ich nun umsetzten werde!

  3. Clemens sagt:

    Super Zusammenfassung, danke! Kleiner Tipp, da der Artikel ja schon etwas älter ist: Umstellung auf PHP 7.2, Caching und Optimierung der mobilen Ladezeiten nicht vergessen! Hab ich jedenfalls hier gelesen (Link entfernt)

  4. Clemens sagt:

    Top Übersicht, danke dir! In einem anderen Artikel zum Thema habe ich noch über die empfohlene Eliminierung von Weiterleitungsschleifen gelesen: (Link entfernt) Da jede zusätzliche Abfrage Zeit kostet. Kannst du das auch bestätigen?

    LG

    • Weiterleitungen machen den Aufruf einer Site langsamer, das ist korrekt. Hat man eine 301 Weiterleitung eingerichtet, sollte das bei moderatem Traffic nicht sonderlich ins Gewicht fallen. Je mehr Aufrufe und je mehr Weiterleitungen, wird es aber gegebenenfalls kritisch. Google mag das auch überhaupt nicht. Es gibt aber auch eigentlich keinen Grund, wieso man exzessiv weiterleiten sollte. Hier liegt wenn dann ein Konfigurationsfehler vor.

  5. Stefen73 sagt:

    Danke für die Infos, der Beitrag ist klasse. Wir konnten einiges umsetzen. Und siehe da, unsere Seite ist um ca. 50% schneller geworden. Aber Aufwand ist es schon. Ich muss mal sehen ob da noch mehr zu machen geht.

    Auf jeden Fall Danke!!

  6. Torben sagt:

    Super Tipps! Danke dir.

    Welches ist eigentlich das beste WP Cache plugin?
    Ich nutze zurzeit WP fastest Cache.

    LG

Kommentar schreiben

Mit Absenden deines Kommentars erklärst du dich mit der Verarbeitung deiner hier angegebenen Daten einverstanden (Datenschutzerklärung). Diese werden nur zur Verwaltung der Kommentare verwendet und keinem anderen Zweck zugefügt. Du kannst jederzeit per E-Mail an info@netz-gaenger.de der Speicherung deiner Daten widersprechen.

* Notwendige Angaben

Netzgänger Webdesign | Rohrersmühlstraße 22 in Schwabach | Bayern
Kontakt: info@netz-gaenger.de
↑ oben
Inhalt