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

Wenn eine Website zu langsam ist, haben Entwickler mehrere Möglichkeiten, ihre Performance zu steigern.

Lernziele

Nach Lektüre dieses Artikels können Sie Folgendes:

  • Verstehen, wie mit der Optimierung der Website-Performance begonnen wird
  • Einige der Faktoren verstehen, die die Geschwindigkeit einer Website beeinträchtigen

Link zum Artikel kopieren

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

Website-Geschwindigkeit

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

Most webpages will require browsers to make multiple HTTP requests for various assets on the page, including images, scripts, and CSS files. In fact many webpages will require dozens of these requests. Each request results in a round trip to and from the server hosting the resource, which can add to the overall load time for a webpage. Additionally, with resources loaded from several different providers, a problem with one of the hosts could impact the webpage's ability to load quickly, or at all.

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

The browser cache is a temporary storage location where browsers save copies of static files so that they can load recently visited webpages much more quickly, instead of needing to request the same content over and over. Developers can instruct browsers to cache elements of a webpage that will not change often. Instructions for browser caching go in the headers of HTTP responses from the hosting server. This greatly reduces the amount of data that the server needs to transfer to the browser, shortening load times for users who frequently visit certain pages.

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.