​

Die Optimierung der Website Geschwindigkeit ist eine komplexe Angelegenheit die entgegen häufig verbreiteter Meinung nicht in der Installation einiger weniger Plugins erledigt ist. Der nachfolgende Guide stellt daher die verschiedenen Möglichkeiten dar, die für die Optimierung des Pagespeeds herangezogen werden können.

1. Warum Website Geschwindigkeit optimieren? 

Zunächst einmal stellt sich die Frage, warum man sich überhaupt der Optimierung der Website Geschwindigkeit widmen sollte. Das hat verschiedene Gründe. Zunächst einmal wirkt sich eine schnelle Website positiv auf die User Experience, also die Nutzererfahrung der Webseitenbesucher nieder. Je schneller der Pagespeed ist, desto einfacher können Nutzer mit einer Webseite interagieren.

Dies schlägt sich auch auf den nächsten Punkt, nämlich den Bereich SEO nieder.  Eine schnelle Website wird von Google nämlich auch als Rankingfaktor gewertet. Das kommt nicht von ungefähr: Denn da sich eine schnelle Website positiv auf die Nutzererfahrung der Webseitenbesucher niederschlägt, verbringen diese mehr Zeit auf der Webseite, was Google als Kriterium für die Platzierung der Webseite miteinbezieht.

Zuletzt ist es so, dass sich ein schneller Pagespeed auch auf die Anzahl der tatsächlichen Webseitenbesucher niederschlägt. Das rührt daher, dass mit zunehmender Ladedauer prozentual weniger Leute abwarten bis die Webseite lädt.  Die Leute suchen sich in der Zwischenzeit ein anderes Google Ergebnis, bei dem die Webseite schneller lädt, um ihre Suchintention zu befriedigen. 

Im Umkehrschluss ist es also so, dass man mehr tatsächliche Webseitenbesucher bekommt, wenn die Seite schnell lädt und die Nutzer eben nicht bereits vor dem Aufruf der Webseite abspringen.

2. Grunddilemma: Hochwertige Media (Bilder und Videos) vs Ladezeit 

Im Mittelpunkt der Diskussion wie der Pagespeed am besten optimiert werden kann steht dabei das Dilemma, dass einerseits hochwertige Media Dateien (also Bilder und Videos) auf der Webseite präsentiert werden sollen, gleichzeitig aber die Seitenladezeit nicht zu lang sein soll. 

Am meisten wirkt sich das auf Videoproduktionsfirmen aus, die typischerweise sehr hochwertige Videos auf ihrer Webseite haben, welche allerdings gleichzeitig auch eine hohe Dateigröße aufweisen. Dies wirkt sich erheblich auf die Seitenladedauer aus. Es gilt also je nach Zielsetzung der Webseite diese beiden Punkte zu vereinbaren:

Hochwertigen Content bereitzustellen, aber gleichzeitig die bestmöglichste Ladezeit aufzuweisen. Nachfolgend werden dahingehend verschiedene Bereiche präsentiert mit denen die Website Geschwindigkeit verbessert werden kann. 

Die vorgestellten Bereiche und Methoden sind dabei auf die Praxis ausgelegt und stellen vor allem diejenigen Methoden da mit denen in der Praxis auch tatsächlich eine spürbare Verbesserung der Website Geschwindigkeit erreicht werden kann.

3. Webseitenhosting und Serverstandort 

Als erster Punkt ist das Webseitenhosting und der Serverstandort anzuführen. Verschiedene Hostinganbieter haben unterschiedlich schnelle Server, was von Grund auf die Kapazitäten einer Website dahingehend beschränkt wie schnell die Seitenladezeit maximal sein kann.  

Es empfiehlt sich hier jedenfalls einen Webseitenhoster auszusuchen, der seinen Serverstandort in Deutschland hat. Ohne hier zu tief in die technischen Hintergründe einsteigen zu wollen, liegt das daran, dass der Serverstandort den Weg der gesendeten Datenpakete beeinflusst. Sofern der Serverstandort also beispielsweise in Brasilien ist, ist der geografische Weg, den diese Datenpakete zurücklegen müssen, wesentlich größer, als wenn der Serverstandort in Frankfurt wäre. Dahingehend ist es ratsam, sich ein Hosting zu suchen, bei dem der Serverstandort auch  tatsächlich in Deutschland ist.

4. Compressing

Beim compressing handelt es sich um die Verkleinerung bestehender Mediadateien. Das betrifft vor allem die Reduzierung der Dateigröße von Bildern und Videos.

4.1 Videos

Zur Reduzierung der Dateigröße von Videos gibt es eine Reihe kostenloser Tools, die durch einfaches Googeln entdeckt werden können. Wer also nach “Video compressing online” sucht wird schnell fündig. 

4.2 Bilder 

Die Komprimierung von Bildern nimmt bei der Optimierung des Pagespeeds eine wesentliche Rolle ein, da vor allem Bilder mit großen Dateigrößen für langsame Ladezeiten verantwortlich sind. Hier liegt meistens auch viel Potenzial, das eingespart werden kann.  

Je nachdem um welches Format es sich bei den Bildern handelt (PNG oder jpg), kann hier ebenfalls auf online kostenlos verfügbare Tools zurückgreifen werden, die die Komprimierung von Bildern innerhalb weniger Sekunden ermöglichen. In der Regel kann dadurch  zwischen 40 bis 70% der Dateigröße eines Bildes eingespart werden. Das ist eine ganze Menge und macht sich spürbar auf den Pagespeed bemerkbar. Allein durch die ordentliche Komprimierung von Bildern kann häufig zwischen ein bis zwei Sekunden Ladezeit herausgeholt werden. In Hinblick auf die Auswahl der Bildkomprimierungstools gibt es kein falsch oder richtig. Die Mehrheit der im Internet befindlichen Tools unterscheidet sich nicht wesentlich in Hinblick auf die tatsächlichen Einsparungen, man kann hier also nicht viel falsch machen. 

Wie man sich bereits denken kann, ist die Komprimierung aller auf einer Website befindlichen Bilder und deren anschließendes Wiedereinsetzen in der Webseite ein aufwendiger Prozess. Aus diesem Grund ist es ratsam, dass man sich vor der Erstellung einer Webseite bereits mit den Basics zur Bildkomprimierung auseinandersetzt, um nachher nicht in die Bredouille zu kommen, diesen unglaublichen Aufwand zu haben.

5. Schlankes Theme nutzen

Ein essentieller Faktor für die Website Geschwindigkeit ist das Theme eine Webseite. Hier sollte man sich vor einer Auswahl genug mit den am Markt verfügbaren Optionen und der Zielsetzung der Webseite auseinandersetzen, um keine Auswahl zu treffen, die man später bereut. Als Faustregel lässt sich anführen: Je mehr Funktionen und Designaspekte das Theme umfasst, desto mehr Seitenladezeit wird auch benötigt. Grundsätzlich ist es daher immer empfehlenswert, dass ein möglichst schlankes Theme genutzt wird. Mit den schnellsten Themes ist dann grundsätzlich eine Seitenladezeit von 0,7 Sekunden möglich.

6. Caching 

6.1 Caching Plugins 

Es gibt verschiedene ebenfalls kostenlose Caching Plugins für WordPress. Zuvorderst sei hier das wohl am weitesten verbreitete Plugin WP fastest Cache genannt.  Alle Caching Plugins erfüllen im wesentlichen dieselben Funktionen. Neben der eigentlichen Optimierung der Caching-Einstellungen wird dabei auch die Reduzierung von Code ermöglicht (html, CSS, javascript).  Als Einsteiger ist es sinnvoll sich zunächst einmal mit dem Grundmechanismen von browser-caching auseinanderzusetzen, um zu verstehen was Caching Plugins eigentlich machen und wie diese funktionieren. 

Sobald man sich etwas sicherer fühlt, kann man dann auch die Advanced Caching Funktionen nutzen. Dabei wird es einem dann ermöglicht, dass man verschiedene granulierte Cache-Einstellungen vornimmt. 

In Hinblick auf die Caching Plugins gilt es allerdings zu sagen, dass diese nicht in jedem Fall zu einer Verbesserung der Seitengeschwindigkeit führen. Nutzt man beispielsweise bereits ein CDN, hat einen schnellen Server oder auch sonst bereits eine sehr schnelle Ladezeit kann es sein, dass Caching Plugins zu keinem Effekt führen oder die Seitenladezeit sogar leicht verschlechtern. 

6.2 .htaccess

Eine weitere Möglichkeit verschiedene Caching Anweisungen zu geben besteht unmittelbar in der .htaccess Datei einer Webseite. Dabei sollte man aber genau wissen was man tut, weil in der htaccess-Datei weitreichende Funktionalitäten einer Webseite geregelt werden können, deren Fehleinstellungen sich unmittelbar auf die Funktionstüchtigkeit einer Webseite niederschlagen, und im schlimmsten Fall dazu führen können, dass die Webseite nicht mehr fehlerfrei aufrufbar ist.

7. CSS minimieren 

Bei CSS handelt es sich um eine Programmiersprache, die vereinfacht gesagt Gestaltungsmöglichkeiten für HTML-Code zulässt. Das Problem von CSS ist, dass jede Art von CSS-Code Seitenladezeit beansprucht. Je mehr man also auf manuelle Gestaltungsmöglichkeiten zurück greift, desto mehr wird der Pagespeed negativ beansprucht. In der Praxis ist es empfehlenswert, dass flächendeckend auf CSS-Code verzichtet wird und man versucht alle erwünschten designtechnischen Gestaltungen bereits innerhalb des Themes umzusetzen um keinen zusätzlichen Code mehr einfügen zu müssen. 

Sofern man dagegen CSS-Code auf der Webseite hat und diesen auch nicht entfernen kann oder will ist es jedenfalls sinnvoll diesen nach Möglichkeit zu minimieren. Hierfür gibt es Plugins die diese Aufgabe bewältigen, beispielsweise wird diese Funktion auch auch von verschiedenen Cache Plugins umfasst. 

Daneben ist es natürlich auch möglich (bei vorhandenen css Kenntnissen) den Code manuell zu reduzieren.  Eine weiteres in der Praxis sehr häufig vorkommendes Problem ist in diesem Zusammenhang, dass die Funktion der CSS Reduzierung oder Minimierung durch Plugins häufig nicht funktioniert. Das bedeutet, dass die Website Geschwindigkeit in tatsächlicher Hinsicht nicht schneller wird, sondern eher langsamer. Das liegt dann daran, dass bereits bestimmte Einstellungen im ausgewählten Theme vorgenommen wurden bei denen bereits eine Reduzierung oder Minimierung des HTML CSS und Javascript Code berücksichtigt wird. Eine zusätzliche externe Reduzierung funktioniert technisch also häufig nicht fehlerfrei. Hier muss im Einzelfall einfach mal getestet werden. 

8. Html minimieren 

Unter dem HTML-Code versteht man die Programmiersprache, in der Webseiten dargestellt werden. Im Gegensatz zum CSS wird beim HTML vorrangig die Darstellung einer Website behandelt. Beim CSS geht es dagegen vor allem um die Gestaltung. Technisch gesehen nimmt der CSS Code Bezug auf einzelne HTML-Code Stücke und modifiziert diese entsprechend. 

Im Rahmen der Optimierung der Ladezeit gilt ähnliches wie bereits beim CSS-Code. Auch hier ist es natürlich einmal möglich, dass der HTML-Code manuell reduziert wird. Hierfür sind aber wiederum vertiefte Kenntnisse erforderlich, um die Darstellung der Webseite nicht kaputt zu machen. Daneben besteht natürlich ebenfalls wieder die Möglichkeit auf externe Plugins wie beispielsweise Cache Plugins zurückzugreifen (die wie oben angemerkt ebenfalls diese Funktion umfassen). Auch hier funktioniert eine Minimierung des HTML-Codes aber in der Regel nicht zuverlässig.

9. Javascript

9.1 Javascript minimieren

Bei JavaScript handelt es sich um eine Programmiersprache, die im Gegensatz zu HTML und CSS eine gewisse zusätzliche Funktionalität ermöglicht. In der Praxis ermöglicht der Einsatz von Javascript vor allem die Änderung von Inhalten und die Auswertung von Benutzerinteraktionen. Auch hier gilt das bereits zu CSS und HTML Gesagte entsprechend.

Allerdings gibt es in Hinblick auf Javascript zwei wesentliche Unterschiede, die zusätzlich zu den bereits bei CSS und HTML genannten Möglichkeiten einen Unterschied aufweisen. Zunächst ist es so, dass JavaScript nicht per se auf der Webseite vorzufinden ist, sondern z.B. durch die Installation funktionserweiternder Plugins oder Skripte hinzugefügt wird. Das ist beispielsweise dann der Fall wenn man ein Tracking Script wie Google Analytics oder Google Tag Manager auf seiner Seite installiert. 

Je mehr solcher JavaScript-Dateien und Plugins man auf der Webseite hat, desto langsamer wird die Seitenladegeschwindigkeit. In der Praxis ist es sehr häufig so, dass Webseiten eine Anzahl an nicht notwendigen JavaScript Skripten aufweisen, die sich in ihrer Funktion einerseits überschneiden und durch bessere Plugins, die all diese Funktionen vereinen, austauschen lassen. Darüber hinaus sind viele Funktionen überhaupt nicht sinnvoll. Um die Website Geschwindigkeit zu verbessern, kann man hier bereits mit einer Deaktivierung, vollständigen Entfernung oder Austausch der Skripte entgegenwirken. 

Man kann beispielsweise verschiedene Trackingskripte über den Google Tag Manager vereinen, sodass auf die einzelne Installation verschiedener Trackingskripte verzichtet werden kann, weil alles über den Google Tag Manager abgedeckt werden kann. 

9.2 Javascript asynchron

Des Weiteren ist es so, dass JavaScripte asynchron geschalten werden können. Das bedeutet, dass diese nicht bereits beim erstmaligen Laden der Webseite (technisch gesehen zum Zeitpunkt des DOM Aufbaus) getriggert werden,  sondern erst zu einem späteren Zeitpunkt aktiviert werden. Dadurch muss der Webseitenbesucher nicht so lange warten, bis der Content erstmalig auf der Seite zu sehen ist und er mit der Seite interagieren kann.

10. Plugins

Einer der bei verbreitetsten Fälle ist der, das Webseiten eine Vielzahl von Plugins installiert haben, die unnötige Funktionserweiterungen mit sich bringen und den Pagespeed massiv beeinträchtigen.  Das rührt vermutlich daher dass viele Webseitenbesitzer von der Vielzahl an kostenlos installierbaren Plugins begeistert sind und meinen, dass mehr Plugins auch tatsächlich einen Mehrwert für die Webseite mit sich bringen.

Die Wahrheit könnte jedoch nicht ferner von der Realität liegen: Die Mehrheit dieser Plugins sind in ihrer Funktion schlichtweg gesagt unnötig und schädigen die Webseite mehr, als dass sie dieser helfen. Hier gilt es dann die Plugins durch schlankere Plugins zu ersetzen, die weniger Seitenladezeit aufweisen und alle wesentlichen Funktionen bereits in sich vereinbaren.  Selbstverständlich muss man dazu wissen, welche Plugins notwendig und sinnvoll sind und auch alle wesentlichen Funktionen abdecken.

11. Lazy Load 

Vor allem im mobile Bereich sind sogenannte Lazy Load Plugins sinnvoll. Diese haben im Kern die Funktion, dass einzelne Bereiche einer Webseite erst zu einem späteren Zeitpunkt geladen werden und dadurch keine Seitenladekapazität verschlingen. Der klassische Anwendungsfall sind insofern Lazy Load Plugins, bei denen die Darstellung bestimmter Webseitenbereiche erst beim Runterscrollen des Webseitenbesuchers erfolgen.

Durch diese Art von versetztem Laden kann einiges an Website Geschwindigkeit herausgeholt werden. Das ist für den mobilen Bereich übrigens umso wichtiger, da mobile Besucher weniger geduldig sind als Desktop Besucher und schneller eine Antwort auf ihre Frage oder Ihr Problem erwarten. Allerdings müssen auch Lazyload Plugins bei jeder Webseite einzeln getestet werden.

Denn auch hier kommt es nicht selten vor, dass entweder bestimmte Seitenbereiche nicht korrekt dargestellt werden oder die Seitenladezeit sogar zunimmt. Auch das hängt wieder von dem ausgewählten Theme und anderen installierten Plugins ab. Vor allem aber hängt es von den ausgewählten Cache Einstellungen ab, die beispielsweise durch Caching Plugins oder ein Content-Delivery-Network (zum CDN sogleich) beeinflusst werden.

12. CDN 

Unter CDN wird das sogenannte content-delivery-network verstanden. Hierbei handelt es sich um ein Netzwerk an Servern, die in verschiedenen Ländern und an verschiedenen Standorten platziert sind. Das ermöglicht es dem eingangs erwähnten Problem des Serverstandorts entgegenzuwirken und Menschen aus verschiedenen Teilen der Welt mit dem Server zu bedienen, der ihnen am nächsten liegt.

Hat eine Webseite also beispielsweise Besucher aus den USA, Kanada und Deutschland kann je nach Standort des Nutzers jeweils der Server angesteuert werden, der geografisch am nächsten beim Nutzer ist. Daneben ermöglicht es dieses Netzwerk an Servern, dass bei einer hohen Anzahl an Besuchen die notwendige  Bandbreite besser unter den vorhandenen Servern aufgeteilt wird. Hat man beispielsweise nur den Standard-Server eines Hosting-Diensts kann es bei einer sehr hohen Besucheranzahl schnell passieren, dass ein “Bottleneck” entsteht, was sich dann negativ auf die Seitengeschwindigkeit auswirkt.  

Es gibt verschiedene Anbieter von Content Delivery Networks, die alle ihre Vor und Nachteile aufweisen. Teilweise ist ein CDN auch bereits im Hosting-Paket kostenlos oder kostenpflichtig inbegriffen. Empfehlenswert ist in jedem Fall ein CDN, für das man proportional zu tatsächlich genutzten Bandbreite bezahlt.

Auch beim CDN ist es allerdings so, dass dieses nicht immer eine schnellere Ladezeit hervorruft und sich von Webseite zu Webseite starke Unterschiede ergeben können. Hat man beispielsweise bereits die maximale Schnelligkeit des Servers erreicht oder wird das Caching bereits vollends optimiert, kann ein CDN sogar im Einzelfall zu einer Verlangsamung der Seite führen. Daher ist es hier umso wichtiger, dass nicht auf eine pauschale Antwort gehofft wird sondern der Einsatz des CDN von Anwendungsfall zu Anwendungsfall konkret getestet wird.

13. Videos hosten lassen

Eine weitere Möglichkeit mit Videos nicht die Seitenladezeit unnötig stark zu strapazieren, ist das Zurückgreifen auf Hosting Dienste, die es ermöglichen Videos extern zu hosten. Hierbei kann beispielsweise YouTube, Vimeo oder Wistia angeführt werden. Die Auswahl des Hosting-Diensts richtet sich dabei nach dem  Geldbeutel sowie den technischen Anforderungen und Wünschen des Webseitenbetreibers. Empfehlenswert für kleinere Webseiten ist in jedem Fall Vimeo, da hier bereits gegen eine kleine monatliche Gebühr von ca 7 € ein Hosting mit Uploads bis zu 5 Gigabyte pro Woche durchgeführt werden können. Des Weiteren ermöglicht Vimeo weitreichender Einstellungen bezüglich privacy Einbettung und Darstellung von Videodetails. 

14. Bildformat WebP

Auch das Format eines Bildes kann optimiert werden, sodass die Dateigröße der Bilder möglichst gering wird und die Website Geschwindigkeit dadurch im Ergebnis verbessert wird. Hier gibt es ein ziemlich junges Format, dass sich WebP nennt und mit dem sich einiges An Bildgröße einsparen lässt. Allerdings ist es so, dass dieses Format nicht einwandfrei auf allen Webseiten genutzt werden kann. Hier gilt es dann selbst zu testen, ob das Format eingesetzt werden kann.  

15. Smush 

Bei Smush handelt es sich um ein WordPress Tool, bei dem die gesamte Mediathek global  compressed wird. Das bedeutet, dass alle in der Mediathek vorhandenen Bilder im Hinblick auf ihr  Anzeigenformat und ihre Dateigröße optimiert werden, wodurch einige Kilobyte pro Bild eingespart werden können. Die Optimierungen, die hier zutage kommen, wirken sich jedoch eher im Kilobyte-Bereich aus.

16. Redirects reduzieren

Sofern es auf deiner Webseite Redirects gibt, die nicht absichtlich gesetzt wurden, ist es sinnvoll diese Redirects zu entfernen. Zusätzliche Redirect einer Seite führen nämlich dazu, dass der Browser länger zum Laden der entsprechenden Seite benötigt.

17. AMP nutzen

Sofern auf der Webseite nur Textinhalte dargestellt werden, wie das beispielsweise bei Online-Zeitungen häufig der Fall ist, kann daneben auf die AMP-Funktion von Google zurückgegriffen werden. Diese kann ganz einfach durch ein Plugin installiert werden. Dabei handelt es sich um eine für Texte optimierte Darstellungsform, die zu Ladezeiten von teilweise weniger als 0,5 Sekunden führen. Sofern du also nur Texte darstellst, kann es sich anbieten, dass du dich einmal mit AMP auseinadersetzt -  vor allem für den mobilen Bereich.