Website Ladezeit optimieren

Überblick der besten Methoden um die Ladezeit von Deiner Websites zu optimieren

Website Ladezeit optimieren

Heute habe ich mich unter anderem mit der Optimierung der Ladegeschwindigkeit von meinen Internetseiten beschäftigt. Dies soll dazu beitragen, dass der Nutzer schneller den Inhalt sieht, für den er die Seite letztendlich aufgerufen hat. Warten mag schließlich niemand. Zum Thema Seitenoptimierung wurden schon einige Blogartikel von anderen talentierten und intelligenten Menschen geschrieben. Aus diesem Grund ist dieser Blog-Artikel eher eine Zusammenfassung der besten Ressourcen die ich zu diesem Thema gefunden habe. Ich werde die einzelnen Methoden, um die Ladegeschwindigkeit zu erhöhen nur kurz anreißen und darauf auf die verschiedenen Websites verlinken. Ich denke, dass Du damit auch glücklicher wirst, da dort die ganzen Details und Funktionsweisen der Optimierungsmaßnahmen beschrieben werden. Zudem hat es den Vorteil, dass Ihr gezielt die Themen aufrufen könnt, die für euch noch von Relevanz sind.

 

Aktiviere HTTP Keep-Alive

HTTP ist ein zustandsloses Protokoll zum Übertragen von Daten über ein Rechnernetz. HTTP ist damit auch die Grundlage von dem Internet, wie wir es heute kenne. Eigentlich ist das Internet nämlich nichts anderes als tausende Computer die in einem Netzwerk miteinander verknüpft sind. Da HTTP zustandslos ist führt das dazu, dass jede Anfrage einer Resource an ein anderen Computer dazu führt, dass eine Verbindung geöffnet, das Datenpaket übertragen und anschließend die Verbindung wieder beendet werden muss. Dadurch können Daten erst nacheinander an den anfragenden Computer übertragen werden. Um die dadurch entstehenden Wartezeiten zu reduzieren wurde der Parameter HTTP Keep-Alive entwickelt. Dieser hält die Verbindung zwischen Client und Server über einen bestimmten Zeitraum offen. Dadurch muss die Verbindung zum Server nur einmal geöffnet werden und die Daten können schneller zu deinen Besucher übertragen werden. Ich empfehle Dir in jeden Fall diese Funktion bei deinem Server zu aktivieren.

Links:

 

gzip Kompressionsprogramm einsetzen

Das freie Kompressionsprogramm gzip ermöglicht es Daten in eine kompakte Datei zu verpacken und so deutlich die zu übertragende Datenmenge zu reduzieren. Dabei arbeitet das Kompressionsprogramm verlustfrei. gzip basiert dabei auf dem Deflate-Algorithmus (https://de.wikipedia.org/wiki/Deflate). Da gzip den Server nur sehr gering mit Last durch die Kompression belastet ist es in jeden Fall wichtig und richtig, dass Du gzip auf Deinem Server aktivierst.

Links:

 

Bilder Optimierung

Ein wichtiger Punkt ist die Optimierung der Bilder. Falls Du viele Bilder oder Videos auf Deiner Website anzeigst ist es mit 80% Sicherheit so, dass diese Daten den größten Anteil an der Datenmenge die zu übertragen ist, darstellt. Aus diesem Grund kann eine Optimierung der Bilder ein entscheidender Vorteil gegenüber Deiner Konkurrenz sein. Doch wie optimierst Du nun Deine Bilder. Einmal solltest Du darauf achten, dass Du die Bilder in der Größe so anpasst, dass Du Sie nicht mehr über CSS oder Inline-Tags anpassen musst, sondern das die Bilder in voller Auflösung dargestellt werden und Du keine viel zu großen Bilder an deinen Besucher überträgst. Auf der anderen Seite gibt es auch Kompressionsverfahren speziell für Bilder. Eines der bekanntesten ist dabei das verlustbehaftete Kompressionsverfahren JPEG. Dort kann man aber in speziellen Grafikprogramm (z.B. Adobe Photoshop) die Qualität einstellen. Alleine mit dieser Angabe lassen sich einige Bytes sparen. Unter den Links findet Ihr weitergehende Informationen, wie Du konkret Deine Bilder anpassen kannst. Vor allem für WordPress-Nutzer ist der erste Link relevant.

Links:

 

Reduzierung der einzelnen Anfragen

Ein weiterer Punkt ist das Zusammenfassen von CSS- und JavaScript-Dateien zu einer Datei. Auf vielen Internetseiten finden sich sehr viele Dateien. Die meisten davon könnten in wenigen Dateien zusammengefasst werden. Vor allem bei WordPress Seiten ist das ein großes Problem, da fast jedes Plugin ein eigenen Stylesheet und einige JavaScript Dateien zu der Website hinzufügt. Jede Datei die der Besucher von dem Server anfragt erhöht die Ladezeit. Du solltest also darauf achten, dass Du die Anzahl deiner CSS- und JavaScript-Dateien auf ein Minium reduzierst.

Links:

 

Komprimierung

Neben der Reduzierung der Anzahl an Daten ist es zudem wichtig, dass Du die Dateien so stark wie möglich in Ihrer Zeichenanzahl reduzierst. Um so weniger Zeichen deine CSS-, JavaScript- oder HTML-Dateien haben, des do besser ist es für die Ladezeit Deiner Besucher. Um dies zu tun gibt es verschiedene Komprimierungsverfahren. Für CSS gibt es SASS (http://sass-lang.com/) und LESS (http://lesscss.org/) , welche neben der Komprimierung aber sicher noch den ein oder anderen weiteren Vorteil besitzen. Du solltest Dir diese Tools in jedem Fall anschauen, wenn Du Dich mit der Frontend-Entwicklung von Internetseiten beschäftigst. Für JavaScript gibt es verschiedene sogenannte „Minifier“. Auch für HTML sind solche Tools vorhanden. In der Link-Liste zu diesem Thema habe ich euch jeweils zwei Tools verlinkt.

Links:

 

Browser Caching

Ein weiterer wichtiger Punkt ist das sogenannte „Caching“. In diesem Fall das Browser Caching. Diese Art von Caching findet auf dem Computer statt. Mit bestimmten Befehlen kann man als Serverbetreiber sagen, dass bestimmte Dateien für eine Dauer von bis zu 356 Tagen (1 Jahr) auf dem Computer des Nutzers in dem temporären Ordner des Nutzers gespeichert werden soll. Durch diese Speicherung erhöht sich die Ladegeschwindigkeit bei einem erneuten Besuch drastisch. Nachteil dabei ist, dass mögliche Änderungen vielleicht dazu führen, dass Daten die ge-cached wurden sind ausgeliefert werden und so die Nutzererfahrung durch unüberlegtes verändern von Daten in Mitleidenschaft gezogen wird.

Links:

 

Server Caching

Neben dem Browser Caching geht das gleiche natürlich auch auf dem Server. Warum solltest Du hundert mal die gleiche PHP-Funktionen laufen lassen, um immer wieder die gleiche statische Seite auszuliefern? Das macht keinen Sinn und aus diesem Grund wurde das Server Caching erfunden. Server Caching bedeutet, dass eine Website mit allen HTML, dass für die Darstellung Deiner Inhalte notwendig ist einmal erstellt und innerhalb des Servers auf einem temporären Ordner abgelegt wird. Anschließend sind die Ladezeiten für Deinen Besucher deutlich kürzer.

Links:

 

Performance Tests

Wenn Du fertig bist mit den Optimierungen solltest Du in keinem Fall verpassen Deine Website auf den Prüfstand zu stellen, ob Du nicht noch weitere Optimierungen vornehmen solltest. Anbei findest Du meine zwei favorisierten Website Performance Test Seiten.

Links:

 

Fazit

Die Optimierung Deiner Website birgt sehr viel Potenzial und ich hoffe Du hast Deine Website nun startklar für ein erfolgreiches 2017 gemacht. Für Dich kann eine optimierte bedeuten, dass Dein Besucher, das ein oder andere Byte spart und manchmal macht genau dieser Vorteil den Unterschied. Die Optimierung Deiner Website freut nämlich nicht nur Deine Besucher. Auch Dein Host, wo Du Deinen Server gemietet hast oder Dein WordPress-Blog betreibst wird es Dir danken. Dieser bezahlt nämlich nicht nur für den Server, welchen er betreibt, sondern auch für die Menge an Daten die durch seine Server über das Netz der Telekommunikationskonzern übertragen werden. Auch Suchmaschinen-Anbieter wie Google oder Microsoft werden es Dir mit einem besseren Rang in den Suchergebnissen danken.

Ich freue mich, dass Du heute einen Beitrag für das schnellere Internet von morgen mit der Optimierung Deiner Website geleistet hast.

Jetzt in den Newsletter eintragen.

Mit dem Klick auf den Button "Für den Newsletter anmelden" akzeptierst Du die Datenschutzbedingungen für den Versandt des Newsletters.

marcelengelmann

Schreib ein Kommentar

Kommentar verfassen