Aktualisiert am 18. Mai 2021
  • Sven 

WordPress schneller machen: Ladezeit verbessern in 2021

WordPress schneller machen: So verbesserst du die Ladezeit deiner Website.

Jetzt den Beitrag teilen!

WordPress schneller machen: Ladezeit verbessern in 2021

Du brauchst den gottverdammten Ferrari der Webseiten, um bei Google ganz vorn mitmischen zu können.

Die Ladezeit ist zwar nur ein Ranking-Faktor, der neuen Core Web Vitals. Dafür ein wichtiger. Es ist sogar einer der wenigen, offiziell von Google bestätigten, Ranking-Faktoren.

Mehr zu dem Thema gibt es in meinem Artikel SEO.

Kein Mensch hat Lust ewig auf den Seitenaufbau zu warten. Und die Nutzererfahrung (User Experience) ist für Google eines der wichtigsten Anliegen.

Die Netzabdeckung in Deutschland gehört zu den schlechtesten, gemessen am Technischen-Fortschritt.

Deshalb tu deinen Nutzern den Gefallen und sieh zu, dass deine Seiten zu den schnellsten gehören.

Wenn du eine große Website mit einigen Tausend Beiträgen hast, wird für dich auch das Crawling-Budget zum Thema. Jede Website hat eine bestimmte Zeit zur Verfügung. Sind deine Seiten sehr langsam, werden weniger Seiten gecrawlt. Das interessiert aber wirklich nur die großen Player.

Eines trifft aber auch kleine Webseiten.

Langsame Ladezeit = weniger Umsatz

Es gibt eine Studie, in der gezeigt wird, dass die Conversion-Rate mit jeder Sekunde Ladezeit um 7% abnimmt. Hört sich nicht viel an, summiert sich aber.

Wenn du mit der Optimierung beginnst, dann sind die ersten Schritte noch einfach. Die bringen auch den größten Nutzen. Tricky wird die ganze Sache erst ab 80% bei PageSpeed Insights.

Ich mache dir nichts vor. Dein Fortschritt verhält sich umgekehrt exponentiell.

Soll heißen: Je weiter du kommst, desto größer wird dein Aufwand, bei gleichzeitig sinkenden Ergebnissen.

Am Anfang machst du schon einen riesigen Sprung, wenn du nur ein gescheites Caching-Plugin verwendest. Gegen Ende wird der Aufwand echt übel.

Du fast dann z.B. einzelne Tracking-Snippets mit Google Tag Manager zusammen, um nur noch einen Snippet laden zu müssen. Oder Hostest deine benutzten Fonts selbst, um noch einen kleinen Bruchteil einer Sekunde rausholen zu können.

Der Weg dahin ist weit, aber er lohnt sich.

Mit einer Turbo-Website bist du für Google interessant. Zumindest, wenn du nicht nur Mist schreibst.

Fangen wir an.

Wie kannst du also die Ladezeit deiner Webseiten verbessern?

Inhaltsverzeichnis

Die Ist-Analyse

Am Anfang von allem steht wie immer die Bestandsaufnahme.

Auf einige Dinge hast du keinen Einfluss.

Beispielsweise ob dein Besucher einen modernen Browser nutzt. Ob er genügend Arbeitsspeicher und freien Cache zur Verfügung stellt oder wie schnell seine Internet-Bandbreite ist.

Auf alles andere kannst du aber sehr wohl Einfluss nehmen.

Als erstes solltest du dir Folgende Fragen stellen.

  • Wie ist es aktuell?
  • Welche Baustellen hast du?
  • Was musst du machen, um am Ende die Spitze zu erreichen?

Für eine Aussagekräftige Ist-Analyse musst du deine Webseiten messen. Ich schreibe mit Absicht Webseiten, weil jede Webseite für sich optimiert sein muss.

Leider gibt es hierzu keine Abkürzung.

Ladezeit messen

Es gibt einige Tools um die Ladezeit deiner Webseiten zu messen. Wichtig ist hier vor allem mehrfache Messungen zu machen und für einen Anhaltspunkt dann den Durchschnitt zu nehmen.

Ich mache dafür immer zwischen 5-10 Messungen und empfehle dir das auch zu tun.

Du wirst feststellen, dass sich die angezeigte Ladezeit deutlich voneinander unterscheiden kann. Selbst wenn du direkt hintereinander misst.

Um die Ladezeit zu messen gibt es viele Tools auf dem Markt. Die bekanntesten stelle ich dir weiter unten vor.

Diese sind vollkommen ausreichend, um ein gutes Ergebnis zu erzielen.

Im Einzelnen werden, je nach Tool, folgende Parameter gemessen.

Time to First Byte (TTFB):

Definiert die verstrichene Zeit zwischen Aufruf der Webseite und dem ersten geladenen Byte.

 

First Contentful Paint (FCP):

An diesem Punkt wird im Browser, zum ersten Mal, etwas angezeigt.

 

First Meaningful Paint (FMP):

Ab hier denkt der Nutzer, dass die Website geladen ist. Bilder und Content von weiter unten sind zu diesem Zeitpunkt aber noch nicht geladen.

 

Largest Contentful Paint (LCP):

Beschreibt, wenn der Hauptinhalt und damit der größte, sichtbare Bereich geladen wurde.

 

Time to Interactive (TTI):

Die Webseite ist fertig gerendert und damit bereit zur Nutzereingabe.

 

Total Blocking Time (TBT):

Alles, was zwischen First Contentful Paint und Time to Interactive geladen wird und mehr als 50ms blockiert wird, zählt zur Total Blocking Time.

 

Cumulative Layout Shift (CLS):

Dieser Wert wird durch die Layout-Verschiebung beim Laden errechnet und sollte nicht über 0,1 liegen. Er wird z.B. durch das zu späte laden von CSS-Dateien beeinflusst.

 

Speed Index:

Dieser Index zeigt wie schnell ein möglichst großer Teil der Webseite geladen wird. Eine Webseite, die einen großen Teil frühzeitig lädt, wird dabei gut bewertet. Eine Seite die zwar direkt kleinere Datenmengen lädt, aber die große Masse erst relativ spät lädt, hat einen schlechten Index.

Tools für die Messung der Ladezeit

Hier bekommst du eine Liste der besten Tools um die Ladezeit deiner Webseiten zu Messen. Außerdem erfährst du alles, was du wissen musst, damit deine Seiten richtig schnell laden.

Meine Favoriten sind hier PageSpeed Insights, Pingdom und GTmetrix.

Es gibt natürlich noch eine Vielzahl anderer Tools, die du testen kannst. Nutze einfach das Tool, dass für dich die beste Lösung ist.

Du brauchst einen schnellen Webhoster

Der Hoster ist der Grundpfeiler für die Ladegeschwindigkeit deiner Website.

Es gibt eine Vielzahl von Anbietern auf dem Markt. Wer hier aber nur darauf aus ist möglichst viel Geld zu sparen, der Zahlt am Ende drauf.

Billige Massenhoster gibt es schon für ein paar Euro im Jahr. Wer hier Hostet, findet sich aber mit sehr vielen anderen Nutzern auf einem Server wieder.

Da streiten sich dann alle um die viel zu geringen Server-Resourcen. Das Resultat ist, dass sie sich gegenseitig ausbremsen und jeder Besucheransturm von einem Nutzer, auch gleichzeitig zum Problem für alle anderen wird.

In Zeiten von Core Web Vitals kannst du einen Massenhoster mit einem Todesstoß gleichsetzen.

Ich rate dir hier ganz klar ab, wegen weniger Euro im Monat bei einem Massenhoster zu hosten.

Das ist in etwa so, als wenn du dein neues Haus auf Sand baust. Ohne stabilem Fundament wirst du keine langfristige Freude haben.

Gute und schnelle Hoster sind in meinen Augen z.B.:

Nutze HTTP/2

HTTP steht für Hypertext Transfer Protocol. Beim veralteten HTTP/1.1 wurden noch alle Requests brav nacheinander ausgeführt.

Das führte natürlich zu dementsprechenden Verzögerungen und der Idee, alle JavaScript- und CSS-Dateien untereinander zusammenzufassen.

Dadurch wurden die Serverabfragen wieder reduziert, aber die Dateien waren oft sehr groß.

Das hat sich durch den neuen Standard geändert. Mit HTTP/2 ist es erstmals möglich mehrere Requests gleichzeitig auszuführen.

Der Vorteil ist, dass das zusammenfassen der JavaScript- und CSS-Daten wegfallen kann.

Ich habe dennoch die Erfahrung gemacht, dass das laden schneller geht, wenn zumindest einige ähnliche Dateien zusammengefasst werden.

Solltest du nicht wissen ob dein Hoster HTTP/2 unterstützt, kannst du das unter anderem bei HTTP2.pro prüfen.

Nutze ein schnelles Theme

Dein verwendetes WordPress-Theme kann ebenfalls maßgeblichen Einfluss auf die Ladezeit deiner Website haben.

Gerade universelle Themes, die einen breiten Nutzerbereich abdecken und zudem viele Demoinhalte beinhalten, sind oft sehr langsam.

Diese Themes sind vollgestopft mit Möglichkeiten zur Veränderung, die aber oft nur im geringen Umfang genutzt werden. Die JavaScript- und CSS-Dateien werden dennoch geladen und verlangsamen den Aufbau deiner Webseiten.

Am besten, du suchst dir hier wirklich ein Theme, dass nur die Optionen für dich bereithält, die du auch wirklich brauchst.

Das ist bei der Menge an Möglichkeiten aber leichter gesagt als getan.

Deshalb empfehle ich dir hier ein paar WordPress-Themes, mit denen ich gute Erfahrungen gemacht habe.

  • Neve (schlank und gut)
  • GeneratePress (sehr schlank aber etwas veraltet)
  • Astra (viele Demoinhalte für schnellen Fortschritt, trotzdem sehr schnell)
  • Hello Elementor (komplett leer und nur für Nutzer von Elementor Pro sinnvoll)
  • Impreza (sehr schnell trotz großem Umfang, aber kostenpflichtig)

Mit sauberem Code WordPress schneller machen

Sauber geschriebener Code ist das A und O für eine schnelle Webseite.

Darunter zählt z.B. Klassen zu erstellen, um häufig wiederkehrenden Code zu nutzen. Viele nutzen hier eine ID nach der nächsten um gleiche Code-Snippets einzubinden. Das bläht den Code aber unnötig auf.

Deinen Code kannst du mit Validator überprüfen. Damit lassen sich Schwachstellen schnell erkennen.

Natürlich wirst du etwas Know-how brauchen um diese Fehler auch beheben zu können.

Beseitige Fehler

Google liebt schnelle Webseiten. Hier erfährst du wie deine Webseiten richtig schnell werden, damit du zum Freund von Google wirst.

Ein wichtiger Tipp ist die Beseitigung von Fehlern.

Bilder, HTML-, CSS- oder JS-Dateien die nicht gefunden und geladen werden können, führen zu längeren Ladezeiten. Grund hierfür ist die Zeit, die vom Server für die Suche aufgewendet werden muss.

Stell dir das so vor:

Der Server versucht verzweifelt eine Datei zu finden, die aber am verlinkten Speicherort überhaupt nicht hinterlegt ist. Der Server sucht und sucht und sucht…

In dieser Zeit wartet der Besucher der Webseite bis die Suche wegen Zeitüberschreitung abgebrochen wurde.

Dann erst wird begonnen die nächste Datei zu laden.

Bei einer fehlenden bzw. fehlerhaften Datei fällt das noch nicht wahnsinnig ins Gewicht. Aber bei mehreren Fehlern summiert sich die Ladezeit schnell zu einem spürbaren Ladezei-Verlust.

Von der Tatsache, dass der gesuchte Inhalt dann nicht angezeigt wird, will ich hier nicht mal sprechen.

Caching-Plugin installieren und einstellen

Ein Caching-Plugin macht wahrscheinlich den größten Unterschied für deine Ladezeit.

Daher solltest du hier als erstes tätig werden.

Immer, wenn ein Kunde eine bestimmte Seite zum zweiten Mal aufruft, wird auf zwischengespeicherte Daten zurückgegriffen.

Hier gibt es Hunderte verschiedene Plugins auf dem Markt. Kostenlose wie auch kostenpflichtige. Meine Favoriten unter den kostenlosen sind Autoptimize und Cache Enabler.

Diese habe ich eine ganze Zeit lang benutzt. Dennoch bin ich sehr froh, dass ich Geld in die Hand genommen habe um WP Rocket zu testen.

Und was soll ich sagen? Ich bin begeistert!

WP Rocket ist In 30 Minuten installiert und eingestellt.

Meine Performance bei PageSpeed Insights lag bei mir, für mobile Endgeräte ohne Caching-Plugin, bei 40-50%. Nach dem einrichten von WP Rocket. Bin ich zum ersten Mal auf 70-80% gekommen. Für Desktop-PC sogar direkt auf 98%.

Das ist ein atemberaubendes Ergebnis. Deshalb kann ich WP Rocket nur wärmstens empfehlen.

Schade war nur, dass ich so lange gebraucht habe, bis ich Geld für das Plugin ausgegeben habe. Der Grund dafür war aber einfach.

Es gibt so viele kostenlose Caching-Plugins, die auch nicht schlecht sind.

CSS-Dateien zusammenfassen und früh laden

CSS-Dateien gehören ganz nach oben in den <head> tag.

Die Seite baut sich auf. Du denkst, dass du agieren kannst, scrollst etwas nach unten und plötzlich springst du wieder hoch.

Du kennst sicher, wenn du beim Aufruf einer Seite, die ersten 3-4 Sekunden hin und her gerissen wirst.

Du rufst eine Seite auf und sie kommt auch schnell. Super denkst du und scrollst nach unten. BÄM! Schon bist du wieder oben. Du scrollst wieder nach unten. BÄM! Wieder oben. Scrollen. BÄM!

Das frustriert wie Sau.

Der Grund hierfür ist einfach. Stück für Stück werden die Stylesheets (CSS-Dateien) von Schriften, Bildern und Co. geladen.

Die Schrift ist da und erst später lädt das Stylesheet. Die Schrift verändert sich und alles rückt zusammen oder auseinander. Dasselbe bei Bildern und Co.

Tu dir selbst und der Nutzererfahrung deiner Kunden einen Gefallen und lade die CSS-Dateien so früh wie möglich.

Damit hat alles was danach geladen wird bereits seinen Style und wird nicht mehr verändert.

Auch Google möchte mit dem Cumulative Layout Shift (CLS) verhindern, dass es nach dem Anfang des Seitenaufbaus, große Änderungen und Verwerfungen, gibt.

JS-Dateien zusammenfassen und spät laden

JavaScript-Dateien solltest du zusammenfassen und so spät wie möglich laden. Dadurch kannst du Server-Abfragen einsparen, weil nur noch eine Datei geladen werden muss.

Am besten packst du diese in den Footer.

Grund hierfür ist die recht hohe Dateigröße. Zudem müssen JavaScript-Dateien aus funktioneller Sicht meistens nicht früh geladen werden.

Ausnahmen kann es hier natürlich geben.

Viele Caching-Plugins nehmen dir diese Arbeit ab.

Versuche am besten auch externe JS-Dateien selbst zu hosten. Das spart zusätzlich Server-Abfragen und damit Ladezeit.

Nutze am besten Asynchrones JavaScript

Wenn es um JS-Dateien geht, hast du die Wahl zwischen synchronen- und asynchronen JavaScript.

Die synchrone Variante muss komplett geladen sein bevor die nächste Datei geladen werden kann. Mit anderen Worten, sie blockieren den weiteren Ladevorgang.

Asynchrone JS-Dateien behindern das weitere Laden nicht. Wenn das asynchrone JavaScript den Ladevorgang begonnen hat, kann direkt die nächste Datei geladen werden.

Wenn du also Ahnung von der Materie hast und weist wie du es umsetzt, dann solltest du asynchrones JavaScript bevorzugen.

Das gilt vor allem wenn du JS-Dateien hast, die sich aus funktioneller Sicht im Head-Bereich befinden müssen.

Quellcode minimieren

Was heißt es, den Quellcode zu minimieren?

Unter dem minimieren des Quellcodes versteht man das Löschen aller Leerzeichen und Absätze, die nur der Übersicht dienen. Außerdem werden meistens auch lange Namen von Variablen gekürzt und Kommentare gelöscht.

Da das von Hand ein viel zu großer Aufwand wäre, werden hierfür auch wieder Plugins verwendet.

Bei einigen kostenlosen und natürlich auch bei meinem Favorit WP Rocket lässt sich diese Option einstellen.

Browser-Cache aktivieren

Den Browser-Cache zu aktivieren ist ein weiterer wichtiger Schritt, um die Ladezeit deiner Website zu verringern.

Hier werden Daten direkt im Browser der Person gespeichert, die auf deiner Seite surft. Durch hin- und herspringen auf einzelnen Webseiten wird so auf Daten zurückgegriffen, die bereits vom Browser zwischengespeichert worden.

Hier musst du nur darauf achten, die Zeit der zu speichernden Daten günstig zu wählen.

Ein zu häufiges aktualisieren verlangsamt deine Ladezeit.

Durch zu seltenes aktualisieren steht deinem Leser aber unter Umständen neuer Content nicht zur Verfügung.

Für mich haben sich folgende Werte als nützlich erwiesen. Das sieht der ein oder andere aber unter Umständen anders.

Füge das Snippet in deine .htaccess ein. Nutze dafür den Platz vor # BEGIN WordPress oder nach # END WordPress, weil dieser nicht überschrieben wird.

				
					# Begin Browser Caching
<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault      					        "access plus 1 month"
ExpiresByType text/cache-manifest       		"access plus 1 hour"
ExpiresByType text/html	        			    "access plus 1 hour"
ExpiresByType text/xml	        			    "access plus 1 hour"
ExpiresByType application/xml       			"access plus 1 hour"
ExpiresByType application/json	        		"access plus 1 hour"
ExpiresByType application/rss+xml       		"access plus 1 hour"
ExpiresByType application/atom+xml      		"access plus 1 hour"
ExpiresByType image/x-icon				        "access plus 4 months"
ExpiresByType image/gif                         "access plus 4 months"
ExpiresByType image/png				            "access plus 4 months"
ExpiresByType image/jpg                         "access plus 4 months"
ExpiresByType image/jpeg				        "access plus 4 months"
ExpiresByType image/webp				        "access plus 4 months"
ExpiresByType video/ogg                         "access plus 4 months"
ExpiresByType audio/ogg     		            "access plus 4 months"
ExpiresByType video/mp4                         "access plus 4 months"
ExpiresByType video/webm				        "access plus 4 months"
ExpiresByType text/x-component			        "access plus 1 month"
ExpiresByType text/x-javascript			        "access plus 1 month"	
ExpiresByType font/ttf				            "access plus 1 year"	
ExpiresByType font/otf				            "access plus 1 year"
ExpiresByType font/woff				            "access plus 1 year"
ExpiresByType font/woff2				        "access plus 1 year"
ExpiresByType image/svg+xml			            "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject	    "access plus 1 month"
ExpiresByType application/x-shockwave-flash	    "access plus 1 month"
ExpiresByType application/pdf			        "access plus 1 month"	
ExpiresByType text/css				            "access plus 1 year"
ExpiresByType application/javascript	    	"access plus 1 year"
</IfModule>
# End Browser Caching
				
			

GZIP-Komprimierung aktivieren

Mit einer GZIP-Komprimierung kannst du sogar über 70% der Größe deiner HTML-, CSS- und JavaScript-Dateien einsparen.

Wenn das kein Argument ist.

Du kannst bei HTTP Compression Test schauen, ob du bereits eine GZIP-Komprimierung nutzt. Hier siehst du auch, wie viel du dadurch einsparst.

Compression Test BlogFuchs

Füge das Snippet in deine .htaccess ein. Nutze dafür den Platz vor # BEGIN WordPress oder nach # END WordPress, weil dieser nicht überschrieben wird.

				
					# Begin Komprimierung
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/vtt
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/x-component
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/js
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-shockwave-flash
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE application/x-httpd-fastphp
AddOutputFilterByType DEFLATE application/atom+xml
AddOutputFilterByType DEFLATE application/json
AddOutputFilterByType DEFLATE application/ld+json
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-web-app-manifest+json
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
</IfModule>
# End Komprimierung
				
			

Bild-Optimierung

So jagt deine Website durch das Web und kommt Blitzschnell beim Nutzer an. Erfahre alles was du wissen musst um deine Webseiten unglaublich schnell zu machen.

Die Bildoptimierung bzw. Bildbearbeitung ist ein sehr wichtiger Faktor für die Ladezeit deine Website.

Wichtig ist hier vor allem, dass du jedes Bild, bevor du es hochlädst, an die jeweilige Größe anpasst und komprimierst.

Ein kleines Bild im Fließtext muss nicht 1800×1200 Pixel groß sein. Hier reichen 300×200 Pixel vollkommen aus.

Ich würde bei jedem Bild erste die Größe anpassen, dann komprimieren und erst zuletzt in die Mediathek von WordPress hochladen.

Mehr zu diesem Thema findest du in meinem Artikel Bildbearbeitung.

Mit Plugins kannst du die Dateigröße dann noch zusätzlich verringern.

Bilder mit Plugins Optimieren

Wahrscheinlich hast du schon viele Bilder auf deiner Website. In dem Fall wird es natürlich aufwendig alle Bilder von Hand zu optimieren. Hier kann dir ein Plugin helfen.

Diese Plugins sind kostenlos und komprimieren deine Bilddateien vollkommen selbständig. Je nach Einstellung kann das beim hochladen passieren oder wann auch immer du das willst.

Ich kann dir Compress JPEG & PNG images und Imagify empfehlen. Mit Imagify kannst du deine Bilder zusätzlich noch in das WebP-Format konvertieren.

WebP ist ein Format, dass von Google entwickelt wurde. Dadurch sparst du noch einmal ca. 30% der Dateigröße ein.

Leider können nicht alle Browser dieses Format darstellen. Deshalb macht es Sinn, dass du zusätzlich eine Alternative in JPG oder PNG zur Verfügung stellst.

Papierkorb in den Medien erstellen

Dir ist sicher schon aufgefallen, dass in den Medien von WordPress kein Papierkorb vorhanden ist. Wenn du also Bilddateien löschst, sind sie weg.

Solltest du hinterher feststellen, dass du sie doch brauchst, musst du die Dateien entweder von einem Backup wiederholen oder hast halt Pech gehabt.

Damit ich Dateien erst in den Papierkorb verschieben kann, bevor ich sie tatsächlich lösche, habe ich meine WordPress-Installation etwas geändert.

Füge dafür diesen Code-Snippet in deine wp-confic.php ein. Der Teil mit den Sternen ist nur eine Beschreibung des Codes. Den kannst du auch weglassen, wenn du magst. Wird dann aber unübersichtlicher.

				
					/**
 * Papierkorb für Medien
 */
define('MEDIA_TRASH', true);
				
			

Nutze Lazy Load

Lazy Load wird verwendet, damit Bilder, Texte und Scripte, erst dann geladen werden, wenn sie auch wirklich gebraucht werden.

Mit anderen Worten bedeutet das: Die Bilder werden erst kurz bevor du sie siehst geladen.

Dadurch verkürzt sich die Ladezeit der Webseite enorm. Je nach Anzahl und Größe der Datei. Aber es spart auch Datenvolumen bei der mobilen Suche. Nämlich immer dann, wenn der Nutzer nicht bis ganz nach unten scrollt.

Lazy Load kannst du durch zahlreiche Plugins umsetzen. Ein gutes und zudem kostenloses Plugin ist Autoptimize.

Mehr Lazy-Load-Plugins findest du hier.

Umleitungen auf das notwendigste beschränken

Die 301-Redirect (Umleitung) solltest du sparsam einsetzen. Jede Umleitung kostet Ladezeit.

Natürlich macht es durchaus Sinn bestimmte Seiten umzuleiten. Zum Beispiel wenn du Artikel zusammenfassen möchtest.

Du solltest aber auf jeden Fall vermeiden, von einer Umleitung zur nächsten und wieder zur nächsten zu leiten. Wenn du eine 301-Redirect einstellst, dann sollte sie direkt zum Zielort führen.

Einstellen kannst du Umleitungen einfach über SEO-Plugins wie Yoast SEO oder Rank Math SEO.

Wenn du keines dieser Plugins nutzt, gibt es noch die Möglichkeit es direkt in die .htaccess zu schreiben. Am besten nutzt du hier einen Generator wie den 301 Redirect Generator von Netgrade.

So vermeidest du Fehler. Mache aber trotzdem vorher ein Backup!

CDN nutzen

Nutze ein CDN (Content Delivery Network). Durch ein CDN werden deine Daten auf vielen unterschiedlichen Servern gespeichert. Sie können bei Bedarf von deinen Lesern heruntergeladen werden.

Gerade bei einer weltweit agierenden Website ist ein CDN sinnvoll.

So muss ein Leser aus den USA nicht auf einen Server in Deutschland zugreifen und nutzt stattdessen den nächstgelegenen Server vor Ort.

Bei solchen Entfernungen können da schnell einige Sekunden zusammenkommen, die du an deiner Ladezeit einsparen kannst.

Ein CDN ist aber sehr teuer.

Daher lohnt es nur, wenn du weltweit erreicht werden musst. Eine Webseite die sich nur auf Deutschland bezieht, braucht kein CDN.

Es gibt zwar auch kostenlose Anbieter, in wie weit diese dir aber eine Ladezeit-Ersparnis bringen musst du testen.

AMP verwenden

Im Sinne von Mobile First ist ein AMP (Accelerated Mobile Pages) wahrscheinlich eine gute Möglichkeit, mobiloptimierte Webseiten fast ohne Zeitverzögerung zu laden.

Wer also seinen Kunden eine Website zur Verfügung stellt, die hauptsächlich mobil genutzt wird, der sollte über AMP nachdenken.

Umsetzen lässt sich das z.B. mit dem Plugin AMP

Da ich selbst aber noch keine Erfahrung mit einem AMP habe, kann ich hierzu leider nicht mehr beisteuern. Aber zumindest hast du davon gehört.

Weitere Informationen findest du bei Ryte Magazine.

Datenbank aufräumen

Du solltest deine Datenbank von Zeit zu Zeit aufzuräumen. Stück für Stück sammeln sich allerhand unnötig Daten an, die deine Ladezeit negativ beeinflussen können.

Die Arbeit kannst du von Hand machen oder du nutzt dafür ein Plugin wie WP-Sweep.

Ein weiteres Plugin ist Advanced Database Cleaner Pro, das kostet eine einmalige Gebühr, ist dafür aber umfangreicher. Damit lassen sich beispielsweise auch verwaiste Überreste uralter Plugins aufspüren und entfernen.

Wenn du das von Hand machen willst, dann solltest du dich etwas auskennen. Hier kannst du jede Menge Schaden anrichten.

Revisionen der Blogbeiträge und Seiten begrenzen

Immer wenn du deine Blogbeiträge, Seiten oder Einträge aktualisierst, wird in der Datenbank eine Revision angelegt.

Das macht auch durchaus Sinn.

Beispielsweise wenn du einen Fehler einbaust und im Nachhinein nochmal die alte Version herstellen willst.

Allerdings wird dich die Version, von vor 5 Jahren, wahrscheinlich nicht mehr interessieren. Trotzdem brauch auch dieser Eintrag seinen Speicherplatz.

Revisionen werden automatisch und ohne Einschränkung angelegt.

Wenn du, wie ich, oft zwischenspeicherst und hin und her springst, dann summieren sich die Revisionen zu einem ernsthaften Performance-Problem. Deine Datenbank wird mit nutzlosen Einträgen zugemüllt.

Ich habe mich entschieden meine Revisionen auf 10 pro Beitrag zu beschränken. Alle älteren werden direkt gelöscht.

Füge dafür diesen Code-Snippet in deine wp-confic.php ein. Der Teil mit den Sternen ist nur eine Beschreibung des Codes. Den kannst du auch weglassen, wenn du magst. Wird dann aber unübersichtlicher.

				
					/**
 * Revisionsbegrenzung
 * Setzt die automatisch zu speichernden Revisionen auf die angegebene Anzahl
 * Ältere Revisionen werden automatisch gelöscht
 */
define('WP_POST_REVISIONS', 10);
				
			

Der Code ändert leider nur die zukünftigen Revisionen. Alle älteren bleiben unberührt. Die musst du deshalb von Hand löschen.

Das ist zwar je nach Größe deiner Website ziemlich viel Arbeit, aber die lohnt sich.

Deaktiviere bzw. lösche unnötige Plugins

Hast du Plugins die du nicht brauchst oder nur selten nutzt? Du solltest regelmäßig deine Plugin-Liste durchsehen und ausmisten.

Viele haben wenig- oder keinen Nutzen für dich.

Oder sie machen dasselbe wie auch schon ein anderes Plugin, dass du ohnehin nutzt.

Hier macht es auch Sinn, auf die Qualität zu achten. Da jeder ein Plugin entwickeln kann, sind natürlich auch viele dabei, die es nicht so genau nehmen.

Es gibt Plugins die schlecht programmiert sind. Diese laden unnötige CSS- oder JS-Dateien. Einige sogar mehrfach.

Prüfe also genau, ob der zusätzliche Nutzen deiner Plugins die Nachteile rechtfertigt.

Unnötige Plugins löschen

Lösche alle unnötigen Plugins! Je weniger du hast, desto besser.

Jedes Plugin kostet dich Ladezeit, weil CSS- und/oder JavaScript-Dateien geladen werden.

Einige brauchen auch einen permanenten Abgleich mit deinem Server und lähmen deine Website zusätzlich durch zu viele oder sogar unnötige Datenbank-Abfragen.

Außerdem haben viele Plugins denselben nutzen, die bereits verwendete mitbringen. Vielleicht kannst du hier auch ein Plugin installieren, das die Arbeit von mehreren anderen übernimmt.

Selten genutzte Plugins deaktivieren

Alle Plugins, die du zwar brauchst aber nur sporadisch nutzt solltest du deaktivieren.

Das ist zwar nicht so gut als hättest du das Plugin überhaupt nicht.

Besser als wenn du es aktiviert lässt, ist es aber allemal.

Nutze PHP 8

PHP ist eine Skriptsprache, die zur Darstellung dynamischer Webseiten verwendet wird. Verwende hier immer den neuesten Standard. Aktuell ist das PHP 8.

Wenn dein Hoster diese Version anbietet, dann solltest du sie nutzen.

Bonus: So kannst du deine Ladezeit noch weiter verkürzen

Jetzt hast du die gängigsten Möglichkeiten ausgeschöpft. Dennoch gibt es noch mehr, dass du machen kannst um deine Ladezeit weiter zu verkürzen.

Der Aufwand wird hier im Verhältnis zum Nutzen höher, aber wenn du an die Spitze willst, dann musst du das in Kauf nehmen.

Vermeide unnötige Requests

Jede Anfrage an den Server braucht Zeit. Findet dein Server die gesuchte Ressource nicht, verschwendet das viel Zeit. Mehr noch, als beim Laden einer gefundenen Ressource.

Deshalb ist es wichtig, dass die verlinkten Pfade korrekt sind oder auf sinnvolle Alternativen umgeleitet werden.

Vermeide unbedingt, dass der Server Dateien sucht, die es überhaupt nicht gibt.

Beschränke externen Service auf ein Minimum

Wenn deine Webseite geladen wird, ist es umso besser je mehr nur von deinem Server geladen wird.

Jeder externe Service, wie Google Fonts, Facebook usw. führt dazu, dass Daten von anderen Servern geladen werden müssen. Das führt zu Wartezeiten die sich erheblich auf deine Ladezeit auswirken können.

Außerdem musst du hier auch immer auf die DSGVO achten. Die meisten Dienste musst du in deiner Datenschutzerklärung angeben.

Reduziere alles so weit wie möglich

Jedes Byte an Daten kostet Ladezeit. Versuche auf alles, was nicht wichtig ist, zu verzichten.

Es gibt dazu ein sehr gutes Zitat, dass hier perfekt passt:

„Minimalismus ist der Schlüssel zu wahrer Eleganz.“

Hier hast du eine kleine Liste, wo du Einsparungen vornehmen kannst.

  • HTML-Text
  • CSS-Dateien
  • JavaScript-Dateien
  • Bilder
  • Plugins
  • Themes
  • Umleitungen
  • Wenn möglich Klassen statt ID´s
  • Unnötige Revisionen

Fazit

Die Core Web Vitals starten im Mai 2021 und damit verschieben sich die Ranking-Faktoren. So steigerst du dein Ranking mit der Optimierung deiner Ladezeit.

Wie du siehst, hast du viele Möglichkeiten um die Ladezeit deiner Website zu beschleunigen.

Einige sind schneller umsetzbar. Andere erfordern mehr Aufwand.

Je weniger deine Website optimiert ist, desto schneller siehst du Fortschritte.

Die hier genannten Maßnahmen zur Optimierung deiner Ladezeit, sind in meinen Augen der beste Weg, um deine Website richtig schnell zu machen.

Du solltest auf jeden Fall zuerst auf die Optimierung für mobile Endgeräte wie Tablets und Handys achten. Mobile First ist kein Mythos, sondern für Google ein wichtiger Ranking-Faktor!

Feedback

Hast du noch Fragen oder fehlt Information?

Dann schreibe mir jetzt einen Kommentar!

Fandest du den Beitrag hilfreich? Dann teile ihn!
Share-Buttons findest du am Anfang und Ende des Beitrags.

Für mehr hilfreiche Tipps und Tricks.
Vergiss nicht mir zu folgen!
Die Follow-Icons findest du im Footer.

Jetzt den Beitrag teilen!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.