SEO Rankingfaktor Ladegeschwindigkeit

Rankingfaktor Webseiten-Ladegeschwin­digkeit

Die digitale Präsenz ist ein entscheidender Faktor für den Erfolg eines Unternehmens und die Ladegeschwindigkeit Ihrer Internetseite spielt eine zentrale Rolle sowohl für die Suchmaschinenoptimierung als auch für die Nutzererfahrung(UX). Die Aufmerksamkeitsspanne der Nutzer wird immer geringer und Ihre Konkurrenz ist nur einen Klick entfernt. So kann die Geschwindigkeit mit der Ihre Inhalte dargestellt werden den Unterschied machen zwischen einem User der zu einem Kunden wird und einem, der frustriert aufgibt und zum Mitbewerber wechselt.

Eine schnelle Ladezeit ist für eine erstklassige Nutzererfahrung unerlässlich und kann dazu beitragen die Sichtbarkeit Ihrer Webseite in den Suchergebnissen zu verbessern. Studien haben gezeigt, dass schnellere Ladegeschwindigkeiten direkt zu besseren Konversionsraten führen
(vgl. HubSpot Blog und Trinity ). Wenn Sie auf Ihren Seiten Waren zum Kauf anbieten, können Sie durch die Optimierung der Ladezeiten Ihre Verkaufszahlen deutlich erhöhen. In diesem Beitrag bieten wir Ihnen praktische Schritte, wie Sie die Geschwindigkeit Ihrer Seite überprüfen und verbessern können.

Überprüfen der aktuellen Ladegeschwin­digkeit

Wie in unserem ersten Beitrag „Die Bestandsaufnahme“ bereits geschrieben, ist es wichtig vor der Optimierung den aktuellen Stand Ihrer Ladegeschwindigkeiten zu kennen. Hierzu gibt es verschiedene Tools, die Ihnen Einblicke liefern können:

Google PageSpeed Insight
WebPageTest

Haben Sie die Prüfung durchgeführt, analysieren Sie die Ergebnisse. Sie erhalten eine detaillierte Liste mit weiteren Informationen welche Elemente Fehler verursachen beziehungsweise die Ladezeit der Seite negativ beeinflussen. In vielen Fällen sind die einflussreichsten Faktoren:

1. die Größe von Bildern
2. die Nutzung von Javascript und CSS
3. die Serverantwortzeit
4. eine unzureichende Nutzung von Caching.

Gezielte Maßnahmen ergreifen

Sobald Schwachstellen auf Ihrer Webseite erkannt wurden ergreifen Sie spezifische Verbesserungsmaßnahmen um die Leistung zu steigern. Im folgenden finden Sie nützliche Tips und Hinweise, welche Initiativen Sie ergreifen können und welche Programme Ihnen ggf. helfen die Probleme zu lösen.

Optimierung von Bildern und Videos

Da medienschwere Inhalte oft die Hauptursache für lange Ladezeiten sind, ist dies einer der entscheidenden Anpassungen die Sie vornehmen sollten.

Komprimieren Sie Bilder – immer

Verwenden Sie Bildkomprimierungstools wie TinyPNG oder Imagify um die Dateigrößen Ihrer Bilder zu reduzieren ohne das die Qualität leidet. Für Videos empfiehlt sich die Nutzung von HandBrake.

Das passende Bildformat

Wählen Sie moderne Formate wie WebP, dieses Format ist oft kleiner als die bekannteren Formate JPEG oder PNG. WebP unterstützt die Darstellung von Transparenzen, Animationen ähnlich des GIF Formats und wird von den meisten modernen Browsern unterstützt. Die kleine Dateigröße von WebP Grafiken ist besonders vorteilhaft für die Darstellung auf mobilen Endgeräten.

responsive Images

Implementieren Sie wenn möglich responsive Bilder mit dem srcset-Attribut, um sicherzustellen, dass alle Endgeräte Ihre Bilder in der passenden Größe anzeigen. Dieses Attribut wird innerhalb des -Tags verwendet und stellt dem Browser eine Reihe von Bildquellen zur Verfügung. Webentwickler können so eine responsive Bildstrategie implementieren. Durch die Verwendung verbessern sich die Ladezeiten, besonders auf mobilen Geräten, wo die Bandbreite möglicherweise begrenzt ist, kann das Laden kleinerer Bilder den Datenverbrauch reduzieren.
Sie finden Anleitungen zur Verwendung bei MDN Web Docs und CSS-Tricks

Minimieren Sie Javascript und CSS

Wenn Sie ein CMS wie z.B. WordPress nutzen, ist die Versuchung groß für viele kleine Aufgaben oder spezielle Effekte Plugins einzubinden. Behalten Sie den Umfang der installierten Plugins stets im Blick und Fragen Sie sich – ob es eine notwendige Installation ist. Viele der Plugins laden Javascript und CSS Dateien, die in Ihrer Menge die Ladezeiten Ihrer Webseite ebenfalls beeinflussen. Wir geben Ihnen am Ende dieses Beitrags noch eine Übersicht hilfreicher WordPress Plugins, die viele der beschriebenen Schritte vereinfachen.

Minifizierung, zusammenfassen und verzögert laden

Nutzen Sie Tools wie UgliflyJS für Javascript und CSSNano für CSS, um Ihre Dateien zu minifizieren. Bei diesem Prozess werden nicht benötigte Zeichen aus Ihrem Code entfernt, ohne die Funktionalität zu beeinträchtigen.

Wenn es möglich ist, fassen Sie mehrere CSS Dateien zusammen um die Anzahl der HTTP-Anfragen zu reduzieren.

Laden Sie JavaScript-Dateien verzögert um zu verhindern, das beim Laden wichtiger Inhalt blockiert wird. Im Blog von StaticWeb finden Sie eine gute Anleitung zu diesem Thema.

Verbessern Sie die Serverantwortzeit

Die Wahl des richtigen Hosters ist mit entscheidend für den Erfolg Ihrer Webseite. Achten Sie auf Faktoren wie Serverzuverlässigkeit und Uptime-Garantien die die Verfügbarkeit Ihrer Webseite sicherstellen. Bandbreite, Speicherkapazität und Kundensupport sind ebenfalls wichtige Kriterien. Ein Upgrade auf einen leistungsstarken Server kann die Antwortzeiten Ihrer Webseite verbessern.

CDN

Verwenden Sie ein sogenanntes Content Deliverey Network um eine Kopie Ihrer Webseite an verschiedenen Standorten weltweit zu speichern. So können die Daten schneller an die Benutzer in den verschiedenen Regionen gegeben werden. Bei der Auswahl eines passenden Anbieters ist es entscheidend Ihre spezifischen Bedürfnisse zu definieren.

Optimieren Sie Ihre Datenbank

Nutzen Sie die Möglichkeit die Antwortzeiten für dynamische Inhalte zu verbessern – optimieren Sie Ihre Datenbankabfragen

Die richtige Cachingstrategie

Konfigurieren Sie Ihren Webbrowser, um HTTP-Header für das Caching zu nutzen, damit wiederkehrende Besucher Inhalte schneller laden können. Beim Serverseitigen Caching nutzen Sie Technologien wie Varnish oder Memcached, um häufig angeforderte Seiten oder Daten zu speichern und entsprechend schnell auszuliefern. Varnish wird als Caching-Proxy vor den eigentlichen Webserver geschaltet um die möglichen Zugriffsraten des System zu erhöhen.

Lazy Loading

Implementieren Sie LazyLoading für Bilder und Videos, sodass die entsprechenden Inhalte erst geladen werden, wenn Si in den sichtbaren Bereich des Browsers scrollen. Sie können dies durch das HTML Atrribute (loading=„lazy“) oder durch den Einsatz entsprechender Javascript-Bibliotheken erreichen.

Third-Party-Scripts

Analysieren Sie welche Third-Party-Scripts geladen werden und wie Sie die Performance beeinflussen. Entferne Sie alle Scripts die nicht notwendig sind aus Ihrer Installation oder laden Sie diese verzögert.

Wenn Sie diese Schritte alle sorgfältig prüfen und umsetzen, können Sie die Ladezeit Ihrer Webseite signifikant verbessern.