Tipps für Fortgeschrittene: So erhöhen Sie die Geschwindigkeit Ihrer Website
- By Viktor Petersson - Juli 10, 2019 Performance
Als Ersteller und Verbraucher von Webinhalten wissen Sie sicherlich, dass die Geschwindigkeit Ihrer Website wichtig ist. Aber wissen Sie auch, wie wichtig sie tatsächlich ist?
Fast die Hälfte der Webnutzer (47 %) sagt, dass sie erwarten, dass eine Website in zwei Sekunden oder weniger geladen wird. Andernfalls verlassen Sie die Seite eventuell direkt wieder. Und das hat dann natürlich einen Einfluss auf Ihren Gewinn. Der Onlineversandhändler Amazon fand beispielsweise heraus, dass ihn jede Verzögerung von 100 Millisekunden 1 % des Umsatzes kosteten (was 1,6 Milliarden Dollar im Laufe eines Jahres entspricht).
Im Grunde genommen könnte man Webnutzer also als einen ungeduldigen Haufen beschreiben. Wenn Sie die Nutzer auf Ihrer Website halten möchten, sodass sie Links anklicken und Ihre Produkte kaufen, muss Ihre Seite blitzschnell sein.
Was ist eine gute Website-Geschwindigkeit?
Wenn Sie die Geschwindigkeit Ihrer Website erhöhen möchten, sollten Sie damit beginnen, Ihr Ziel zu definieren. Was ist eine anzustrebende Seitengeschwindigkeit?
Die ideale Ladezeit für Seiten beträgt laut Google drei Sekunden oder weniger. Das liegt daran, dass Nutzer an Mobilgeräten 53% aller Suchen verlassen, die länger als diesen Zeitraum zum Laden brauchen.
Die überwiegende Mehrheit der Websites und Seiten ist jedoch weitaus langsamer als dieser Richtwert. Tatsächlich hat Google 900.000 mobile Landingpages auf der ganzen Welt analysiert und herausgefunden, dass 70% von ihnen sieben Sekunden brauchten, um visuelle Inhalte zu laden.
Weniger Conversions und eine erhöhte Absprungraten sind hier nur ein Teil des Problems, das entsteht. Eine schlechte Ladezeit könnte es nämlich auch für Kunden schwieriger machen, Ihre Website überhaupt zu finden. Denn Google verwendet genau diese Seitengeschwindigkeit, um das Ranking von Suchergebnissen zu bestimmen. Wenn Sie also möchten, dass Ihre Website auf der ersten Seite der Suchergebnisübersicht erscheint, müssen wir Ihre Seitengeschwindigkeit auf bis zu 3 Sekunden oder weniger erhöhen.
Die gute Nachricht ist, dass dies absolut machbar ist.
Wie Sie die Geschwindigkeit Ihrer Website erhöhen
Wir haben einige Tipps und Trick für Sie zusammengestellt, mit denen Sie Ihre Website-Geschwindigkeit erhöhen können.
1. Reduzieren Sie HTTP-Anfragen.
80% der Ladezeit einer Website wird mit dem Herunterladen der verschiedenen Komponenten der Seite verbracht. Für jedes Bild, Stylesheet und Skript ist eine HTTP-Anfrage erforderlich. Weniger Komponenten auf jeder Seite bedeuten weniger HTTP-Anfragen und eine schnellere Ladezeit.
2. Kombinieren und verkleinern Sie Dateien.
Schauen Sie sich alle Dateien Ihrer Website an. Sehr wahrscheinlich gibt es einige, die kombinierbar sind. Beginnen Sie mit Ihren HTML-, CSS- und Javascript-Dateien. Obwohl dies alles wichtige Dateien sind, benötigen sie eine große Anzahl von HTTP-Anfragen. Sie können diese Anfragen reduzieren, indem Sie Dateien verkleinern und kombinieren.
Reduzieren Sie Ihre Dateien, indem Sie unnötige Formatierungen, Code und Leerstellen löschen. Nehmen Sie zusätzliche Leerzeichen, Zeilenumbrüche und Einrückungen heraus. Dadurch werden die Dateien kleiner.
Dateien zu kombinieren bedeutet, zwei oder mehr Dateien desselben Typs zu einer zusammenzufassen. Mit Plugins funktioniert das recht einfach.
3. Laden Sie CSS- und Javascript-Dateien asynchron.
CSS und Javascript können auf zwei verschiedene Arten geladen werden: synchron oder asynchron.
Wenn Skripte synchron geladen werden, bedeutet das, dass sie nacheinander geladen werden. Asynchrones Laden (aktivierbar durch ein "async" Attribut im HTML-Skript) bedeutet dagegen, dass einige Skripte gleichzeitig geladen werden.
Wenn ein Browser eine Website lädt, bewegt er sich von oben nach unten. Wenn es zu einer synchronen Skriptdatei kommt, stoppt es das Laden der anderen Skripte, bis es mit diesem speziellen Skript fertig ist. Wenn die Skriptdatei jedoch asynchron ist, kann der Browser die anderen Skripte auf der Seite weiterhin gleichzeitig laden.
4. Verschieben Sie das Laden des Javascripts.
Wenn Sie eine Skriptdatei verschieben (aktivierbar durch ein "defer" Attribut im HTML Skript), weisen Sie den Browser an, diese bestimmte Datei erst zu laden, nachdem die anderen Elemente der Seite geladen wurden. Dieser Prozess ist besonders ratsam für größeren Dateien, wie dem Javascript, damit diese die Ladegeschwindigkeit der Seite nicht verlangsamen. Javascripts können zudem für den Browser sehr aufwendig sein, da sie heruntergeladen, analysiert und dann ausgeführt werden müssen, bevor sie den Inhalt der Seite beeinflussen.
5. Wählen Sie den richtigen Anbieter aus.
Es könnte verlockend sein, den billigsten Anbieter zum Betreiben Ihrer Website zu wählen, den Sie finden können, besonders wenn Ihr Budget knapp ist. Aber auf lange Sicht lohnt es sich nicht. Billige Anbieter betreiben oft zu viele Seiten, und ihre Server sind überfüllt. Infolgedessen erhält Ihre Website weniger Bandbreite und Ihre Seitengeschwindigkeit verlangsamt sich erheblich.
6. Beheben Sie defekte Links.
Verlinkungen, die nicht funktionieren, verärgern nicht nur die Nutzer Ihrer Website, sondern sie belasten auch Ihre Bandbreite. Sie können defekte Links einfach mit Tools wie Siteimprove beheben, die Ihre Seiten regelmäßig durchsuchen, um sicherzustellen, dass alle Ihre Links korrekt funktionieren.
7. Verringern Sie Weiterleitungen (Redirects).
Der einfachste Weg, Ihre defekten Links zu reparieren, ist oft mit Weiterleitungen. Und manchmal muss man sie einfach benutzen, wie beim Verschieben oder Löschen einer Seite.
Aber sie erzeugen auch viele zusätzliche HTTP-Anfragen, die Ihre Seitengeschwindigkeit erheblich verlangsamen können. Verwenden Sie also so wenige Weiterleitungen wir möglich.
Beginnen Sie mit einem Tool, das defekte Links automatisch erkennt: Führen Sie einen Scan Ihrer Website durch und suchen Sie nach allen 301-Weiterleitungen auf Ihrer Site. (Eine 301-Weiterleitung ist eine Verlinkung mit dem neuen URL einer Ressource (z. B. ein Link oder ein HTML-Dokument), die dauerhaft verschoben wurde.) Überprüfen Sie die Ergebnisse. Dienen alle Weiterleitungen wirklich einem Zweck? Sind sie wirklich notwendig? Achten Sie darauf, nach Weiterleitungsschleife zu suchen - dies sind Umleitungen, die zu weiteren umgeleiteten Seiten führen. Wenn Sie eine Schleife finden, können Sie alle umgeleiteten Seiten so bearbeiten, dass sie direkt zur neuesten Version dieser Seite führen.
8. Optimieren Sie Bilder.
Optimieren Sie Ihre Bilder, indem Sie die Dateigröße mit der Auflösung abgleichen. Ihre Fotos sollten so hochauflösend wie möglich sein, aber keine riesige Datei. Es gibt Tools, die dies einfach machen, wie z. B:
- ImageOptim
- ShortPixel
- TinyJPG
- TinyPNG
- Kraken
- ImageOptimizer
Google empfiehlt, dass die Gesamtgröße Ihrer Website 500 KB auf Mobilgeräten nicht überschreiten sollte. Allerdings liegt der Durchschnitt deutlich darüber (ca. 3 MB). Bilder tragen wesentlich zur Größe Ihrer Seite bei, also halten Sie die Dateigrößen so klein wie möglich.
9. Optimieren Sie Ihre Webseiten-Schriften (web fonts).
Webseiten-Schriften sind ein wichtiger Bestandteil Ihrer Marke, der Lesbarkeit und der digitalen Barrierefreiheit - aber sie können auch einen großen Einfluss auf die Geschwindigkeit Ihrer Website haben. Schriften sind Teil von CSS-Dateien, und CSS-Dateien befinden sich auf dem "Critical Rending Path", was bedeutet, dass der Browser die Seite erst dann anzeigt, wenn diese Elemente geladen sind. Um das Laden der Seite zu beschleunigen, können Sie die Anzahl der Dateien reduzieren, die sich auf diesem Pfad befinden.
Sie sollten Schriften zudem auch asynchron laden - d.h. Spezialschriften werden im Hintergrund geladen, während eine Basisschrift sofort wiedergegeben wird. Dadurch wird die Seite für Benutzer viel schneller lesbar.
Neben dem asynchronen Laden können Sie auch Ihre Schriftdateien optimieren, indem Sie diese komprimieren und weniger stilistische Schriftvariationen verwenden, um die Wiedergabezeiten zu verkürzen.
10. Speichern Sie Ihre Videos extern
Webnutzer lieben Videoinhalte, und Marketingspezialisten nutzen dieses Medium immer häufiger. Aber das Hochladen eines Videos direkt auf Ihre Website ist ein großer Fehler. Videos nehmen eine Menge Platz ein, leicht mehr als 100 MB. Ein einziges Video könnte Ihre Website verlangsamen.
Versucht ein Nutzer, einige Video gleichzeitig anzusehen, ist Ihr Server sehr schnell ausgelastet, um diese riesigen Datei an mehrere Orte zu liefern. Da Ihr Server wahrscheinlich über eine begrenzte Bandbreite verfügt, bedeutet dies, dass sich die Nutzererfahrung verschlechtern wird.
Stattdessen sollten Sie Ihre Videos extern speichern und Sie auf Ihrer Website einbinden. Einige gute Optionen für Video-Hosting-Sites über Drittanbieter sind YouTube, Vimeo und Wistia. Das externe Speichern spart Ihnen Platz und beschleunigt Ihre Ladezeiten.
Die Hauptaussage bleibt die gleiche: Eine hohe Website-Geschwindigkeit ist wichtig. Langsame Ladezeiten führen zu weniger Conversions und höheren Absprungraten. Wenn Sie die Nutzer auf Ihrer Website halten möchten, sodass sie Links anklicken und Ihre Produkte kaufen, muss Ihre Seite blitzschnell sein. Wenn Sie mehr darüber erfahren möchten, wie Sie Ihre Website beschleunigen können, lesen Sie hier mehr über Siteimprove Performance.