Tipps zur Verbesserung der Website-Geschwindigkeit | Wie Websites schneller werden

Wie können Entwickler erreichen, dass ihre Websites schneller geladen werden?

Die Geschwindigkeit einer Website wirkt sich enorm auf die Nutzererfahrung, die SEO und die Konversionsraten aus. Um Traffic zu einer Website zu leiten und Besucher daran zu binden, ist es unerlässlich, die Performance der Website zu verbessern. Hier gehen wir einige Schritte durch, die Entwickler unternehmen können, um eine Website schneller zu machen:

Die Website-Performance testen

Mit Website-Geschwindigkeitstests lässt sich die Performance einer Website bewerten. Regelmäßiges Testen einer Website kann Entwicklern helfen, Verschlechterungen oder Verbesserungen der Performance nachzuverfolgen. Außerdem helfen Geschwindigkeitstests dabei, Bereiche aufzuspüren, die die Website-Performance verlangsamen, und Verbesserungsmöglichkeiten zu finden.

Es gibt zahlreiche gute Website-Geschwindigkeitstests zur Messung der Performance. Viele davon sind kostenlos. WebPageTest.org (ein Cloudflare-Partner) bietet mehrere kostenlose Tests und erstellt detaillierte Aufschlüsselungen über die Ladegeschwindigkeit einzelner Elemente einer Seite. WebPageTest.org ermöglicht es Entwicklern auch, Websites für verschiedene Geräte und Netzwerk-Verbindungsgeschwindigkeiten zu testen.

Google bietet außerdem PageSpeed Insights für detaillierte Performancetests an. Auch Google Chrome DevTools kann Entwicklern bei der Bewertung der Performance ihrer Website helfen. Die Netzwerk-Registerkarte zeigt alle HTTP-Anfragen, die Größe der angeforderten Assets und die Dauer bis zur Erfüllung der Anfragen.

Ein CDN (Content Delivery Network) verwenden

CDNs erhöhen die Geschwindigkeit von Websites, indem sie Inhalte an mehreren Standorten auf der ganzen Welt zwischenspeichern. CDN-Caching-Server befinden sich in der Regel näher am Endbenutzer als der Host- oder Ursprungsserver. Anfragen nach Inhalten gehen an einen CDN-Server, anstatt den ganzen Weg zum Hosting-Server zurücklegen zu müssen, der Tausende von Kilometern und mehrere autonome Netzwerke vom Benutzer entfernt sein kann. Bei Verwendung eines CDN kann die Seitenladedauer deutlich reduziert werden.

Bildoptimierung

Bilder machen einen großen Prozentsatz des Internet-Traffics aus, und das Laden von Bildern auf einer Website dauert oft am längsten, da Bilddateien in der Regel größer sind als HTML- und CSS-Dateien. Zum Glück kann die Bildladezeit durch Bildoptimierung reduziert werden. Zur Bildoptimierung gehören in der Regel die Reduzierung der Auflösung, die Komprimierung der Dateien und die Verringerung ihrer Abmessungen, und viele Bildoptimierer und Bildkompressoren stehen online kostenlos zur Verfügung.

CSS- und JavaScript-Dateien verkleinern (Minifikation)

Code zu verkleinern bedeutet, dass alles entfernt wird, was ein Computer nicht benötigt, um den Code zu verstehen und auszuführen, einschließlich Codekommentare, Leerzeichen und unnötige Semikolons. Dieser Prozess wird auch als „Minifikation“ bezeichnet. Dadurch werden CSS- und JavaScript-Dateien etwas kleiner, damit sie schneller im Browser geladen werden und weniger Bandbreite beanspruchen. Für sich allein genommen führt Minifikation nur zu minimalen Geschwindigkeitsverbesserungen. Wenn sie jedoch zusammen mit diesen anderen Tipps umgesetzt wird, resultiert daraus eine bessere Website-Performance.

Anzahl der HTTP-Anfragen möglichst reduzieren

Für die meisten Webseiten müssen Browser mehrere HTTP-Anfragen für verschiedene Assets auf der Seite stellen, einschließlich Bilder, Skripte und CSS-Dateien. Tatsächlich sind für viele Webseiten Dutzende dieser Anfragen erforderlich. Jede Anfrage geht zu dem Server, auf dem die Ressource gehostet wird, und wieder zurück, was die Gesamtladezeit für eine Webseite erhöhen kann. Außerdem könnte bei Ressourcen, die von mehreren verschiedenen Providern geladen werden, ein Problem mit einem der Hosts dazu führen, dass die Webseite nicht mehr schnell oder überhaupt nicht mehr geladen wird.

Wegen dieser potenziellen Probleme sollte die Gesamtzahl der Assets, die jede Seite laden muss, auf ein Minimum beschränkt werden. Außerdem kann man durch einen Geschwindigkeitstest herausfinden, welche HTTP-Anfragen die meiste Zeit in Anspruch nehmen. Wenn zum Beispiel Bilder bewirken, dass eine Seite nur langsam geladen wird, können Entwickler nach einer schnelleren Bildhosting-Lösung (z. B. einem CDN) suchen.

Browser-HTTP-Caching nutzen

Der Browser-Cache ist ein temporärer Speicherort, an dem Browser Kopien von statischen Dateien speichern, so dass sie kürzlich besuchte Webseiten viel schneller laden können, anstatt immer wieder den gleichen Inhalt anfordern zu müssen. Entwickler können Browser anweisen, Elemente einer Webseite, die sich nicht oft ändern werden, im Cache zu speichern. Anweisungen zum Browser-Caching werden vom Hosting-Server in die Header der HTTP-Antworten geschrieben. Dadurch wird die Datenmenge, die der Server an den Browser übertragen muss, stark reduziert, und die Ladezeiten für Benutzer, die bestimmte Seiten häufig besuchen, verkürzen sich.

Möglichst wenig externe Skripte einbinden

Alle skriptgesteuerten Webseitenelemente, die von anderswoher geladen werden – z. B. externe Kommentarsysteme, CTA-Schaltflächen oder Popups zur Lead-Generierung – müssen jedes Mal geladen werden, wenn eine Seite geladen wird. Abhängig von der Größe des Skripts können diese Elemente eine Webseite verlangsamen oder dazu führen, dass die Webseite nicht auf einmal geladen wird (das wird als „Content Jumping“ oder „Layout Shifting“ bezeichnet und kann besonders für Mobilnutzer frustrierend sein).

Möglichst keine Weiterleitungen verwenden

Eine Weiterleitung liegt vor, wenn Besucher einer Webseite auf eine andere Seite weitergeleitet werden. Weiterleitungen verlängern die Seitenladedauer um einige Sekundenbruchteile oder manchmal sogar um ganze Sekunden. Beim Aufbau einer performanceoptimierten Website zählt jede Sekunde. Weiterleitungen sind manchmal unvermeidlich, sollten aber nicht verwendet werden, wenn sie nicht notwendig sind.