WordPress Performance Optimierung
Tipps, Tricks & Tools
Die Website-Performance hat sich über die letzten Jahre zu einem der wichtigsten Erfolgsfaktoren im Online Business entwickelt. In unserer schnelllebigen Zeit haben Besucher einfach immer weniger Geduld, zu warten, bis sich eine Webseite aufgebaut hat. Trifft diese Ungeduld auf Lade- und somit Wartezeiten, führt das regelmäßig zu einer verringerten Conversionrate, zu Kaufabbrüchen oder einem allgemein schlechteren Nutzererlebnis und negativen SEO-Signalen.
Deshalb gehört die Performance Optimierung einer WordPress-Website bzw. einer Website im Allgemeinen auf die ToDo-Liste aller Websitenbetreiber. In diesem Artikel findest du Tipps und Empfehlungen, wie du einen Performance Test durchführen kannst oder wie du die Ladezeiten deiner Website und deine WordPress Performance ganz einfach selbst optimierst.
Inhaltsverzeichnis:
- Warum eine gute WordPress Performance wichtig ist
- Kostenlose Tools für einen Website Performance-Test
- WordPress Performance-Optimierung auf dem Server
- Content-Optimierung
- Bilder-Optimierung
- Reduzieren von Dateigrößen und Anfragen an den Server
- WordPress Performance-Optimierung im Adminbereich
- Extra Plugin-Tipp & Performance-Formel
Wichtiger Hinweis:
Bevor du die Performance Optimierung auf deiner Website durchführst, solltest du unbedingt ein komplettes Backup deiner Seite erstellen. Allen WordPress Usern empfehlen wir für diese Aufgabe das Plugin UpdraftPlus.
1. Warum eine gute WordPress-Performance wichtig ist
Direkter Ranking Faktor bei Google
Die Website Geschwindigkeit (Site Speed) ist ein direkter Ranking Faktor bei Google. Das bedeutet, dass der Google Algorithmus die Reaktionszeit, die eine Website benötigt, um eine Anfrage zu bearbeiten, auswertet und diesen Wert für die Berechnung der Website Positionierung in den Suchergebnissen berücksichtigt. Seit Juli 2018 ist die Website Geschwindigkeit auch ein Rankingfaktor für die mobile Suche.
Positive User Signals
Schnelle Ladezeiten führen in der Regel zu einer besseren User Experience und damit zu zufriedenen Usern. Die zufriedenen User senden positive User Signals indem sie länger auf der Webseite verweilen, andere Unterseiten der gleichen Web-Präsenz aufrufen und nicht wieder zu der Suchergebnisliste zurückkehren. Neben der technischen Umsetzung sind die User Signals für Google die wichtigsten Faktoren, um das Ranking einer Website zu bestimmen.
Besseres Crawling
Je schneller die Ladezeit einer Website, desto höher ist die Wahrscheinlichkeit, dass sie öfters und genauer gecrawlt wird. Das ist wichtig, um eine möglichst genaue Indexierung deiner Seite zu gewährleisten. Schließlich sollte das Ziel eines jeden Website-Betreibers sein, dass seine Seite richtig indexiert wird und die neuen Inhalte möglichst schnell den Google-Anwendern zur Verfügung stehen.
2. Kostenlose Tools für einen WordPress Performance-Test
GTmetrix
Eins der bekanntesten Tools, um die Performance einer Website zu analysieren, ist GTmetrix.com. Das Web-Tool überzeugt durch eine angenehme Oberfläche und liefert zu jedem Checkpunkt weiterführende Erläuterungen sowie Optimierungsempfehlungen. Indem man mit der Maus über die kleinen Pfeile neben den Kennzahlen fährt, erhält man als Orientierung den Durchschnittswert aller getesteten Websites. Das Tool verwendet zwar 7 verschiedene Server Standorte, es ist jedoch leider nicht möglich, diese zu verändern. Gerade für Webseiten mit einer deutschen Zielgruppe sind die Ladezeiten nicht wirklich aussagekräftig, da kein Server-Standort in Deutschland zur Verfügung steht. Für eine Vorher/Nachher-Aufnahme oder einen Vergleich mit einem Wettbewerber eignet sich die Kennzahl „Fully Loaded Time“ sehr wohl auch für deutschsprachige Websites.
Da die Chancen groß sind, dass auch du die Performance deiner WordPress-Website mit GTmetrix analysierst, zeigen wir dir in diesem Artikel welche GTmetrix Kennzahlen du mit der jeweiligen Optimierungsempfehlung verbessern kannst. Wir werden deshalb bei einigen Optimierungsvorschlägen Bezug auf die Checkpunkte von GTmetrix nehmen.
Pingdom
Ein weiteres sehr beliebtes Web-Tool, um den Website Speed zu testen, ist Pingdom. Ähnlich wie bei GTmetrix listet es alle Ressourcen in einen Waterfall Chart auf, jedoch mit zusätzlichen Filtermöglichkeiten. Ein großer Vorteil dieses Tools ist die Auswahl an verschiedenen Server Standorten. So erhält man für die deutschen Websites bei der Auswahl „Europe – Germany – Frankfurt“ Ladezeiten, die näher an der Realität liegen.
Im Gegensatz zu GTmetrix unterstützt Pingdom leider nicht das HTTP/2 Protokoll.
WebPageTest
Das Tool WebPageTest ist nicht wirklich benutzerfreundlich, dafür bietet es einige zusätzliche Funktionen für den Website Performance Test an. Darunter fallen Content Blocking, Vergleich erster Aufruf / wiederholter Aufruf, HTTP/2 Testing usw. Das Web-Tool punktet auch bei der Server-Auswahl: Die Tester können zwischen 50 verschiedenen Standorten wählen.
Google PageSpeed Insights
Wie stark der PageSpeed Score von GTmetrix angepasst ist, merkt man, wenn man seine URL bei dem Tool Google PageSpeed Insights eingibt. Nicht selten wird dem Tester hier ein komplett anderer Score angezeigt. Dieser weicht nach den letzten Updates zum Teil deutlich von GTmetrix und Pingdom ab und führt in der Regel zu einem schlechteren Ergebnis. Aber man sollte ohnehin nicht dem Score zu viel Aufmerksamkeit schenken, unabhängig davon um welches Tool es sich handelt und sich viel mehr auf die Optimierungsempfehlungen konzentrieren.
Leider unterstützt Google PageSpeed weder HTTP/2 noch bietet es eine Information, mit welchem Server-Standort der Test durchgeführt wurde.
3. WordPress Performance-Optimierung auf dem Server
Der Server, auf dem die Website Ressourcen liegen, spielt eine entscheidende Rolle, wenn es darum geht, einen guten Score bei GTmetrix und anderen Test-Tools zu erreichen, der schnelle Ladezeiten der eigenen Website widerspiegelt.
HTTP/2
Mit dem HTTP/2 Protokoll können im Vergleich zum HTTP1.1 mehrere Anfragen gleichzeitig vom Server bearbeitet werden. Im Zuge deiner Optimierungsmaßnahmen kannst du mit diesem Protokoll sogar darauf verzichten, die Javascript- und CSS-Dateien zusammenzufassen. Warum es trotzdem Sinn machen kann, auch bei einen HTTP/2 Protokoll die Dateien zusammenzufassen, erfährst du weiter unten im Beitrag.
Ein weiterer Vorteil des HTTP/2-Protokolls ist, dass Dateien bereits vorgeladen werden, bevor sie vom User angefordert wurden. Die Folge davon ist eine schnellere Reaktionsfähigkeit des Servers.
Time To First Byte (TTFB)
Time To First Byte beschreibt die Zeit, die vergeht, bis das erste Byte vom Server zum Client (Browser) übertragen wurde. Bei manchen Billig-Hostern kann diese Zeit bereits über 2 Sekunden betragen. Das bedeutet, egal welche Bemühungen du bei der Performance Optimierung vornimmst, die Ladezeit deiner Website wird nie schneller als 2 Sekunden sein. Diesen Flaschenhals solltest du unbedingt durch die Wahl des richtigen Hosting Anbieters vermeiden.
Mit dem Tool bytecheck kannst du testen, wie lange es dauert bis das erste Byte deiner Website im Browser ankommt.
PHP Version 7 und höher
Mit der PHP Version 7 und höher lassen sich im Vergleich zu der vorherigen Version (5.6) doppelt so viele Anfragen pro Sekunde bearbeiten.
Desweiteren wird die PHP Version 5.6 seit Dezember 2018 nicht mehr aktiv unterstützt, PHP 7.1 ist seit Juni 2020 auch am EOL angelangt. Somit solltest du nicht nur aus Performance Gründen stets die aktuelle PHP-Version verwenden. Ende 2020 erscheint PHP 8.0 und bringt mit dem neuen JIT-Compiler wieder mehr Performance unter die Haube.
Falls dein WordPress Theme nicht mit der neuen Version kompatibel ist, solltest du den Theme Entwickler kontaktieren oder sogar ein Redesign deiner Website mit einem neuen Theme in Betracht ziehen.
Caching aktivieren
Generell kann man zwischen Server und Browser Caching unterscheiden.
Server Caching
Wenn du auf der Suche nach einem neuen Laptop bist, sind zwei der entscheidenden Kaufkriterien der Arbeitsspeicher (RAM) und die Festplatten-Kapazität. Vereinfacht gesagt entspricht der Cache auf dem Server dem Arbeitsspeicher, während der Platz auf dem Server, wo z. B. die WordPress Dateien liegen, die Festplatte repräsentiert.
Solltest du eine WordPress-Website betreiben, kannst du die Caching Funktion sowie auch viele der in diesem Artikel vorgestellten Optimierungsmaßnahmen bequem und einfach mit Hilfe von WordPress Plugins umsetzen. Das führende WordPress Caching Plugin ist WP Rocket. Auf unserem Blog findest du einen Artikel, der die verschiedenen Einstellungsoptionen des tollen Plugins beschreibt.
Es gibt aber auch kostenlose Alternativen, wie z. B. WP Super Cache oder WP Fastest Cache.
Leverage Browser Caching / Expires Header
Auch im Browser werden die einzelnen Seiten einer Website im Cache abgelegt. Jedes Mal wenn ein User eine Seite durch die Eingabe der URL auffordert, fragt der Browser beim Server nach, ob sich diese spezielle Ressource seit dem letzten Besuch des Users geändert hat. Falls das nicht der Fall ist, wird dem User die im Cache gespeicherte Seite angezeigt. Das Ergebnis ist eine schnellere Ladezeit und eine positive User Experience.
Noch schnellere Ladezeiten erreichst du, wenn dein Browser die initiale Abfrage an den Server gar nicht erst senden muss. Hier kommt die Optimierungsmaßnahme „Expires Header“ ins Spiel. Damit sagst du deinem Browser, wie lange er die gespeicherte Version einer Webseite, ohne einen vorherigen Abgleich mit dem Server, ausliefern kann. Da sich manche Ressourcen (z. B. CSS-Dateien) häufiger ändern als andere (z. B. Bilder), gehört es zum Best Practice das Ablaufdatum pro Datei-Typ festzulegen.
Hier siehst du ein Beispiel-Code für Expires Headers, der bei einer WordPress-Website in die .htaccess Datei eingetragen wird. Solltest du diesen Code ebenfalls eintragen wollen, erstelle unbedingt vorher ein Backup deiner .htaccess Datei.
Optimierungspotentiale laut GTmetrix:
- Leverage Browser Caching (PageSpeed)
- Add Expires Header (YSlow)
GZIP Komprimierung
Bei der Gzip Komprimierung werden die Dateien, die vom Server zum Browser übertragen werden, komprimiert und dadurch die Dateigröße reduziert. Die Folge ist eine kürzere Übertragungsdauer der Inhalte, was wiederum zu einer schnelleren Ladezeit der Website führt.
Der erforderliche Quellcode für die Gzip Komprimierung kann entweder manuell in die .htaccess-Datei eingetragen oder mit einem Plugin umgesetzt werden. Die dafür notwendigen Einstellungen bietet das bereits erwähnte WP Fastest Cache oder das ebenfalls kostenlose W3 Total Cache Plugin an. WP Rocket bietet keine Gzip-Einstellung an, da der erforderliche Code automatisch nach der Aktivierung in der .htaccess Datei eingetragen wird.
Für alle nicht WP Rocket User stellt GTmetrix ebenfalls den passenden Code für Gzip Komprimierung zur Verfügung.
Es ist darauf zu achten, dass die Gzip Komprimierung auch auf dem Server vorgenommen werden muss, indem man das Apache Modul mod_deflate aktiviert. Falls du diese Einstellung auf dem Server nicht vornehmen kannst, solltest du deinen Hosting Anbieter kontaktieren.
Mit dem Tool Varvy kannst du überprüfen, ob die Gzip Komprimierung auf deiner Website richtig umgesetzt wurde.
Optimierungspotentiale laut GTmetrix:
- Enable gzip compression (PageSpeed)
- Compress components with gzip (YSlow)
Content Delivery Network (CDN) verwenden
Bei einem Content Delivery Network wird deine Website in einem globalen Server-Netzwerk zwischengespeichert. Dadurch lassen sich die Antwortzeiten des Servers verkürzen, da die Daten nun von einem Server aus dem Netzwerk des Anbieters heruntergeladen werden, welcher dem User am nächsten steht.
Da der Einsatz eines Content Delivery Netzwerks mit zusätzlichen Kosten verbunden ist, ist die Verwendung nur sinnvoll, wenn dein Online Angebot internationale Kunden anspricht, die auf der ganzen Welt verteilt sind.
Optimierungspotentiale laut GTmetrix:
- Use a Content Delivery Network (CDN) (YSlow)
301-Weiterleitungen vermeiden
Jede Umleitung kostet Zeit. Das kennen wir schon aus dem Straßenverkehr. Auf einer Website ist es leider nicht anders. Deswegen solltest du 301-Weiterleitungen so selten wie möglich einsetzen. Das steht allerdings im Widerspruch zu der Suchmaschinenoptimierung einer Website. Denn immer wenn du eine URL änderst, solltest du eine 301 Weiterleitung einrichten, um 404-Seiten bzw. Duplicate Content zu vermeiden. Um die Anforderungen sowohl aus der SEO- als auch aus der Performance-Sicht zu erfüllen, solltest du immer wenn du deine Inhalte anpasst, die dazugehörige URL beibehalten oder nur in Ausnahmefällen anpassen.
Genauso wichtig ist die Festlegung einer URL-Variante (mit oder ohne www) sowie die richtige Umleitung auf die https-Version der Website. Wenn deine Website z. B. schon auf https umgestellt wurde, solltest du auch in deiner E-Mail Signatur, deinen Social Media Kanälen etc. die https-Variante deiner Website angeben, um deinen Besuchern eine unnötige Weiterleitung zu ersparen.
Folgendes solltest du unbedingt vermeiden:
http://www.deine-domain.de (User Eingabe) -> http://deine-domain.de (1. Weiterleitung) -> https://deine-domain.de (2. Weiterleitung)
Optimierungspotentiale laut GTmetrix:
- Avoid URL redirects (YSlow)
- Minimize redirects (PageSpeed)
- Avoid landing page redirects (PageSpeed)
Der Beitrag Warum schlechtes Hosting deinem Business schaden kann, zeigt noch weitere wichtige Punkte, die du bei der Auswahl deines Hosting Anbieters beachten solltest, um eine hervorragende Basis für die Performance deiner Website zu schaffen.
4. Content-Optimierung
So wenig WordPress Plugins wie möglich verwenden
Bevor man ein WordPress Plugin nach dem anderen installiert, sollte man sich die Frage stellen, ob die gewünschte Funktion unbedingt erforderlich ist und das Plugin den Geschwindigkeitsverlust rechtfertigt. Evtl. kann auch ein ähnliches Design-Ergebnis mit weniger Plugins oder mit ein paar Zeilen Code in der functions.php bzw. style.css Datei umgesetzt werden.
Neben dem Geschwindigkeitsverlust erhöhen zu viele Plugins sowohl das Sicherheitsrisiko als auch den Wartungsaufwand. Es besteht auch die Gefahr, dass durch Plugins Skripte hinzugefügt werden, die bereits im Theme oder in den installierten Plugins enthalten sind. Prominente Beispiel-Dateien, die gerne häufiger auf einer Website vorkommen, sind die gleichen Google Fonts oder die Icons von FontAwesome. Leider gehen viele Plugin-Entwickler den einfachen Weg und binden die Library ohne eine vorherige Prüfung, ob diese Library bereits zur Verfügung steht, ein. Dadurch kann es vorkommen, dass die gleichen Ressourcen von unterschiedlichen URLs geladen werden.
Optimierungspotentiale laut GTmetrix:
- Serve resources from a consistent URL (PageSpeed)
Die schnellsten WordPress Themes
Die Wahl des richtigen WordPress Themes kann ebenfalls Auswirkungen auf die Performance deiner Website haben. Viele Website Betreiber machen leider den Fehler, sich für ein sogenanntes „Multi Purpose“-Theme zu entscheiden. Viele solcher Themes haben einen integrierten zum Teil langsamen Page Builder und unzählige Einstellungsoptionen, die eine Website langsam machen. Die Optimierungsmaßnahmen hinsichtlich Performance sind mit einem solchen Theme wesentlich schwieriger.
Auf dem WPConsultant Blog findest du einen Artikel über die schnellsten Elementor Themes. Auch wenn du nicht den führenden Page Builder verwendest, kannst du z. B. die Themes GeneratePress oder Astra verwenden, um eine gute Basis für schnelle Ladezeiten deiner Website zu schaffen.
Tipp für alle Elementor User
Bei den meisten Addons für Elementor lassen sich die Widgets, die nicht benötigt werden, bequem durch das Anklicken einer Checkbox ausschalten. Diese Funktion bieten z. B. Element Pack, Ultimate Addons for Elementor und JetPlugins, um nur drei zu nennen. Da manche Widgets zusätzliche Javascript- und CSS-Dateien benötigen, macht es Sinn nur die Dateien zu laden, die auch unbedingt erforderlich sind.
5. Optimierung von Bildern
Die Bilder auf einer Website gehören natürlich auch zu dem Content sind aber für den größten Teil der gesamten Ladezeit einer Seite verantwortlich. Bei der Performance Optimierung solltest du deshalb den Fokus auf die Bildoptimierung legen. Alle WordPress User können auch hier auf die Hilfe von Plugins zählen. Für alle anderen gibt es auch die Möglichkeit, die Bilder manuell zu optimieren.
Bilder optimieren ohne WordPress Plugin
Bei der manuellen Bildoptimierung sind zwei Schritte erforderlich:
1. Bilder skalieren
Zuerst sollest du die Bilder auf die richtige Größe skalieren. Vielleicht fragst du dich gerade: Was ist die richtige Größe?
Bei den folgenden Bildgrößen handelt es sich nur um Orientierungswerte. Das Ergebnis sollte immer individuell überprüft und evtl. die Skalierung angepasst werden. Erstelle deshalb immer eine Kopie des Originalbildes, um notfalls zum Ausgangspunkt zurückkehren zu können.
Empfohlene Bildgrößen im Webdesign:
- Volle Breite 100%: 1440 px
- Volle Breite Boxed Layout: 1280 px
- 2-spaltiges Layout: 640 px
- 4-spaltiges Layout: 320 px
Bei bestimmten Arten von Websites (z. B. für Fotografen) könnte auch eine höhere Auflösung sinnvoll sein.
2. Bilder komprimieren
Sobald deine Bilder die richtigen Abmessungen besitzen, kannst du zum nächsten Schritt übergehen – die Komprimierung der Bilder. Dafür kannst du das kostenlose Web-Tool tinypng.com verwenden, mit dem man 20 Bilder pro Tag kostenlos komprimieren kann.
Bilder optimieren mit WordPress Plugin
Warum sollte man für die Bildoptimierung ein WordPress Plugin benutzen? Viele Plugins schaden doch der Performance und ein Plugin für die Bildoptimierung ist auf jeden Fall eins, auf das man verzichten kann. Oder etwa nicht?
Zum einen spart natürlich ein Plugin eine Menge Zeit, weil die manuelle Bildskalierung und -komprimierung wegfällt. Diese Aufgaben kann z. B. die Erweiterung Shortpixel für dich übernehmen.
Der wahre Grund, der aus Performance Sicht für die Bildoptimierung mit der Plugin-Methode spricht, ist folgender: Wenn ein Bild hochgeladen wird, erstellt WordPress automatisch 3 skalierte Varianten des Originalbildes: Vorschaubild, Mittel und Groß. Bei manchen Themes wie z. B. dem OceanWP Theme, werden sogar bis zu 8 weitere Versionen eines Bildes erstellt. Diese Varianten werden zwar nie größer sein als dein Originalbild, sind aber leider nicht optimiert. Hier kommt das Plugin ins Spiel. Mit Hilfe von Shortpixel kannst du alle Versionen deines Bildes optimieren lassen.
Das zuvor vorgestellte Web-Tool tinypng.com bietet ebenfalls ein passendes WordPress Plugin an: Compress JPEG & PNG images. Trotz weniger Einstellungsmöglichkeiten ist das Plugin eine vergleichbare Alternative zu Shortpixel.
Lazy Load
Bei lazy load werden nur die Bilder (und Videos) geladen, die im sichtbaren Bereich (above the fold) und knapp darunter liegen. Erst wenn der User nach unten scrollt werden die weiteren Bilder, die sich weiter unten auf der Seite befinden, nachgeladen. Das Ergebnis ist eine schnellere Ladezeit, weil nur die Komponenten geladen werden, die für die Darstellung im Sichtbereich benötigt werden. Diese Optimierungsmethode sollte man aber mit Vorsicht genießen.
Denn im Falle einer schlechten Internetverbindung, werden die Bilder verzögert nachgeladen, was die User Experience negativ beeinflusst. Und wozu das führen kann, haben wir am Anfang des Artikels bereits erwähnt. Ebenfalls aus SEO Sicht besteht die Gefahr, dass die Suchmaschinen die nachgeladenen Inhalte nicht richtig indexieren. Obwohl Google immer besser wird, um solche „versteckten“ Inhalte zu indexieren, solltest du auf Nummer sicher gehen und die wichtigen Keywords bei den Alt-Tags der initial geladenen Bildern verwenden.
Image Overlay für Videos
Endlich mal eine Maßnahme, die sowohl aus der Performance Sicht als auch aus der DSGVO Sicht sinnvoll ist. Denn wenn du ein Overlay Bild für YouTube Videos verwendest, wird beim Laden der Seite keine Verbindung zu den YouTube bzw. Google Servern aufgebaut. Das macht nicht nur die Datenschützer glücklich, es wirkt sich auch positiv auf die Ladezeiten aus. Erstelle einfach einen Screenshot von dem Video Vorschaubild und binde es anstelle des Videos auf deiner Seite ein. Mit dieser Maßnahme werden ca. 12 Ressourcen weniger geladen. Einziger Nachteil: Wenn du deine Besucher zu YouTube weiterleitest, könnte sich die Absprungrate auf deiner Website erhöhen.
Optimierungspotentiale laut GTmetrix:
- Optimize images (PageSpeed)
- Make fewer HTTP requests (YSlow)
6. Reduzieren von Dateigrößen und Anfragen an den Server
HTML-, JS- und CSS-Dateien minimieren
Je kleiner die Dateien sind, die vom Server zum Browser gesendet werden, desto kürzer ist die Übertragungszeit und desto schneller die Website Ladezeit. Um möglichst kurze Übertragungsraten zu erreichen, solltest du die HTML-Dokumente die Javascript-Dateien und die Stylesheets (CSS) minimieren.
Vielleicht geht dir gerade die Frage durch den Kopf: Wie unterscheidet sich die Minimierung von HTML-, JS- und CSS Dateien von der Gzip Komprimierung? Beide Optimierungsmethoden reduzieren die Dateigröße, sie machen das aber auf unterschiedliche Weise. Bei der Minimierung werden alle Kommentare, Leerzeichen, Zeilenumbrüche und andere Textzeichen, die nicht für Ausführung des Quellcodes erforderlich sind, aus den Dateien entfernt. Während bei der Komprimierung die sich wiederholenden Textbausteine durch einen kürzeren String ersetzt werden und somit die Gesamtanzahl der Textzeichen um ein Vielfaches verringert wird.
Auch bei dem Minimierungsvorgang können WordPress User mit Hilfe von Plugins Zeit sparen. Falls du keine Caching Plugins, wie WP Fastest Cache, W3 Total Cache oder WP Rocket im Einsatz hast, kannst du auch die Plugins Autopimize oder Fast Velocity Minify verwenden, um die Dateien zu minimieren. Die Dateigrößen lassen sich aber auch mit Web-Tools wie Minify manuell reduzieren. Selbst GTmetrix gibt als Optimierungsvorschlag gleich die minimierte Version der entsprechenden Datei an („See optimized version“). Nach der manuellen Minimierung der Dateien müssen diese in das entsprechende HTML-Dokument eingebunden werden.
Optimierungspotentiale laut GTmetrix:
- Minify HTML (PageSpeed)
- Minify JavaScript (PageSpeed)
- Minify CSS (PageSpeed)
- Minify JavaScript and CSS (YSlow)
JS- und CSS-Dateien zusammenfassen
Wie zuvor erwähnt, hat die Optimierungsmaßnahme die JS- und CSS-Dateien zusammenzufassen, bei der Verwendung von HTTP/2 keine hohe Priorität mehr. Es kann jedoch durchaus Sinn machen, die Dateien trotzdem zusammenzuführen. Dann nämlich, wenn die Performance Optimierung zu deinem Angebot zählt und die Performance ein wichtiges Verkaufsargument für dein Produkt ist. Das trifft zum größten Teil auf alle Web-Agenturen, Webdesinger und Hosting Anbieter zu. Da leider die Performance Tools Pingdom und Google PageSpeed nicht berücksichtigen, über welches Protokoll eine Website ausgeliefert wird, ist die Maßnahme, die Skirpte und CSS-Dateien zusammenzufassen eine reine Kosmetik-Korrektur, die jedoch hilft, das Testergebnis positiver zu gestalten.
Ein weiterer Grund der dafür spricht, die JS- und CSS-Dateien trotz HTTP/2 zusammenzufassen, ist die Tatsache, dass noch nicht alle Browser(-Versionen) das neue Protokoll unterstützen. Es müssen aber sowohl der Server als auch der Browser über einen HTTP/2-Support verfügen, um eine Website über das neue Protokoll auszuliefern. Anderenfalls wird die Website weiterhin über HTTP1.1 ausgespielt.
Pseudocronjob wp-cron.php durch echten Cronjob ersetzen
Lies hier weiter in unserem Tutorial: Mehr Performance durch Deaktivieren des WordPress Cronjobs.
7. WordPress Performance-Optimierung im Adminbereich
Viele der Optimierungsvorschläge aus diesem Beitrag tragen auch zu einer besseren Performance im WordPress Adminbereich bei. Allen voran ein starker Hoster mit den oben erwähnten Vorteilen, wie neueste PHP-Version oder optimales Caching können die Inhaltserstellung im WordPress Backend erheblich beschleunigen. Darüber hinaus lassen sich die Ladezeiten im Adminbereich mit den folgenden Punkten verkürzen.
Langsame Plugins eliminieren
Um langsame Plugins ausfindig zu machen, muss man nicht unbedingt ein weiteres Plugin installieren. Es reicht schon ein Blick auf den Waterfall Chart bei GTmetrix. Dort kannst du die verschiedenen Ressourcen der einzelnen Plugins mit der dazugehörigen Ladezeit aufaddieren. Damit erhältst du bereits einen guten Überblick, welche Plugins die Ladezeiten deiner Website verlangsamen.
Fahre einfach mit der Maus über die Dateien und schon wird dir die volle URL der Ressource mit dem Plugin Namen angezeigt.
Allerdings können diese Kennzahlen nicht 1:1 auf den Backend Bereich übertragen werden. Bestimmte Dateien eines Plugins, die nur im Adminbereich benötigt werden, sollen auch nur dort geladen werden, zumindest wenn der Plugin Entwickler seinen Job richtig gemacht hat. Deshalb empfiehlt es sich das Plugin Query Monitor zu verwenden, um die langsam ladenden Plugins im Adminbereich ausfindig zu machen.
Sobald du die langsamen Plugins identifiziert hast, kannst du sie entweder entfernen, falls du auf die Funktion verzichten kannst oder sie durch nicht so ressourcen-hungrige Alternativen ersetzen.
Datenbank regelmäßig aufräumen
Wenn du bereits WP Rocket verwendest, brauchst du kein zusätzliches Plugin, um die Datenbank deiner WordPress-Website aufzuräumen. Die nötige Einstellung findest du unter WP Rocket > Einstellungen > Datenbank. Solltest du das führende Caching Plugin nicht im Einsatz haben, empfehlen wir dir das Plugin WP-Optimize. Damit lassen sich nicht benötigte Einträge, wie Revisionsstände, gelöschte Elemente im Papierkorb etc. entfernen, was den Prozess, Daten aus der Datenbank zu holen, insgesamt beschleunigt.
Standard-Editor (Gutenberg) anstatt Page Builder
Für maximale Performance von WordPress emfpehlen wir den Standard-Editor Gutenberg als einen Page Builder zu verwenden. Gutenberg ist aktuell noch nicht so weit, sich in jeder Hinsicht mit richtigen Page Buildern messen zu können. Deshalb lässt sich mit einem guten Page Builder wie z. B. Elementor schließlich ein schöneres Design-Ergebnis in kürzerer Zeit erzielen. Im Hinblick auf die Ladezeiten ist jedoch jeder Page Builder ein Dorn im Performance-Auge und das sowohl im Frontend als auch im Backend einer Website.
Wenn schon Page Builder, dann Elementor
Möchtest du trotz Performance-Einbußen nicht auf einen Page Builder verzichten? Dann solltest du lieber Beaver Builder oder Elementor anstatt WP Bakery (früher Visual Composer) oder Divi Builder verwenden. Die beiden letzteren produzieren mehr überflüssigen Code und verlangsamen deine Webseite zusätzlich.
Standard Theme aktivieren
Wenn alle Optimierungsvorschläge versagen, kannst du ein Standard WordPress Theme aktivieren (zurzeit Twenty Nineteen). Damit lassen sich mögliche Ladezeitverzögerungen ausschließen, die durch das Theme verursacht werden. Wenn du damit das Theme als Performance-Bremse identifiziert hast, dann schlagen wir dir vor, ein schnelleres Theme wie die zuvor erwähnten Astra oder GeneratePress einzusetzen.
8. Extra Plugin-Tipp & Performance Formel
Zum Schluss haben wir noch einen Plugin-Tipp für dich: Asset CleanUp: Page Speed Booster! Mit diesem Plugin kannst du die Dateien bestimmen, welche auf einer Unterseite deiner Web-Präsenz geladen und welche abgeschaltet werden sollen. Die Anwendung des Plugins erfordert ein wenig Hintergrundwissen, welche Skripte und CSS-Dateien für die unterschiedlichen Website Elemente erforderlich sind. Als Faustregel gilt: Schalte keine JS- und CSS-Dateien ab, wenn du dir nicht sicher bist, ob die Dateien auf der jeweiligen Seite benötigt werden oder nicht.
Das Plugin hilft dir dabei, nur die Dateien zu laden, die für das Aussehen und die Funkion der Einzelseite erforderlich sind und verkürzt somit die Ladezeiten der einzelnen Unterseiten.
Optimierungspotentiale laut GTmetrix:
- Make fewer HTTP requests (YSlow)
Wir hoffen die Optimierungsempfehlungen helfen dir, deine Website schneller zu machen. Zu guter Letzt haben wir noch einen weiteren Tipp für alle, die nicht die Zeit auffinden können, alle genannten Optimierungsvorschläge umzusetzen.
Unsere persönliche Express-Formel für die Website Performance Optimierung:
Top WordPress Performance = Schnelles Hosting (am besten von HostPress :-)) + WP Rocket + Shortpixel
Mit diesem Setup deckst du ca. 90 % der möglichen Performance Optimierung ab.
Danijel Rose
Danijel Rose ist der Gründer von WebGeckos, WordPress Trainer und Berater aus Bad Tölz, südlich von München. Über seine WordPress Erfahrungen bloggt er auf WPConsultant.de. Er hat sich vor allem auf hochwertige Firmenwebsites, Mitgliederseiten und WordPress Multisite spezialisiert.
Mehr aktuelle Beiträge rund um WordPress & Co.:
Hi,
Gute Aufstellung, top!
Ich finde, das Thema TTFB wird unterschätzt. Ich hatte zum Beispiel massive ( > 1,5 Sekunden) Performanceunterschiede zwischen dynamischer und statischer PHP-FPM-Konfiguration.
Gruß
Rüdiger
Danke für deinen Kommentar, Rüdiger.
Natürlich ist der TTFB von sehr großer Bedeutung, da hast du Recht.
Hier spielt natürlich auch die Serveranbindung, die Hardware und die Cachingkonfiguration eine wesentliche Rolle.
Zwischen statischer und dynamischer PHP-FPM-Konfiguration konnten wir im Test keinen allzu großen Unterschied feststellen, da das Starten von PHP im Allgemeinen nur wenige ms braucht.
Das kann aber natürlich in Abhängigkeit der individuellen Seitenstruktur sowie der anderen erwähnten Komponenten variieren.
Stimmt habe ich auch bemerkt.
[…] unserem Blog findest du auch einen Artikel darüber, wie du die Performance deiner WordPress Seite durch weitere Maßnahmen optimieren […]
[…] dem HostPress Blog findest du einen umfassenden Artikel darüber, wie du die Performance deiner WordPress Seite optimieren kannst. Mit den Maßnahmen, die in dem verlinkten Artikel erklärt werden, kannst du deine […]
Super Beitrag! Gerade weil die Performance ein Rankingfaktor ist, sollte extrem Wert darauf gelegt werden! Super, dass auch auf viele SEO-Aspekte eingegangen worden ist. Weiter so!
Danke, Credits to WPConsultant.de
Danke, hat super funktioniert, bei GT-METRIX bin ich schon bei 97/92 vorher wars nicht mal die Hälfte.
Ein dringend benötigter Artikel. Nachdem sich der Google-Algorithmus geändert hat, zeigt dieses Jahr und die Einführung von Web-Core-Vitalen, dass Google sich auf die Nutzererfahrung konzentriert. Die Seitengeschwindigkeit beeinflusst nicht nur die Benutzererfahrung, sondern wirkt sich auch auf Ihre Conversion-Rate aus. Es ist gut zu sehen, dass viele Aspekte der Suchmaschinenoptimierung in diesem Thema behandelt werden.
Hey Alicia, das stimmt wohl. Google arbeitet natürlich immer daran, das Nutzererlebnis optimal zu gestalten. Daher werden alle Aspekte der Performance miteinbezogen. Seien es Inhalte, UX oder eben Performance.
Natürlich gibt es auch noch weitere Gründe neben SEO, das Thema nicht zu vernachlässigen.
Wir planen gerade einen neuen Inhalt zu dem Thema, wo wir auch auf die Web Vitals eingehen werden. Falls dich das interessiert, kannst du dich ja für unseren Newsletter anmelden 🙂
„Standard Editor (Gutenberg) anstatt Page Builder“. Sollte so sein aber….. Gutenberg 🙂 Toller Artikel. Danke.
Toller Beitrag. Ich konnte das dieses Beitrags meinen Seobility Score auf die magischen 100% pushen und die letzten Feinheiten korrigieren und anpassen. Vielen Dank für die wertvollen Tipps, wenn auch nicht alle davon wirklich super sind. 😀 Zum Beispiel ist Elementor der mit Abstand schlechteste und mieserabelste Editor, den man je entwickelt hat. Denn man muss sich erst lange reinfuchsen, um wirklich was auf die Beine stellen zu können, und wenn man ihn nicht mehr brauch, zerstört er die komplette Website. Da lobe ich mir den Fusion Builder von Avada. 1000mal besseres handling, keine mutwillige Zerstörung beim Deinstall und SEO-Optimierte Ausgaben.
Danke für dein Feedback, Daniel. Letztlich gibt es wie immer Pros und Kontras 😉
Viele Entwickler schwören inzwischen auf Elementor, wenn es auch Mankos geben mag. Schließlich funktioniert für einen selbst auch das am Besten, wo man sich bereits eingefunden hat.
LG Johannes
Super Zusammenfassung. Besonders haben mir deine Tool-Empfehlungen gefallen. Liebe Grüße aus Berlin
[…] WordPress Performance Optimierung – Tipps, Tricks & Tools unter Time To First Byte (TTFB). Also wie schnell antwortet dein Server. […]
Sehr cooler Beitrag und danke für die Empfehlungen!
Keine Ursache, viel Erfolg Albrecht 😉
Sehr guter Beitrag! Danke!
Schön, dass dir der Beitrag gefällt.
Da wir uns jetzt alle auf mobil ausrichten müssen, sind diese Optimierungsvorschläge Gold wert. Der PageSpeed Mobil Score ist schwer zu knacken, aber mit dieser Hilfestellung kommt alles in den grünen Bereich.
Vielen Dank für diesen präzisen und verständlichen Artikel.
Danke für das Feedback, freut uns, dass es geholfen hat! 🙂