Best Practices und Verbesserungstipps für die Ladegeschwindigkeit von Websites

Wenn es um Online-Benutzer geht, wollen sie heute, was sie wollen, und sie wollen es jetzt. Wir alle waren in einer Situation, in der eine Online-Ressource eine zu langsame Website-Ladegeschwindigkeit hat und wir einfach weggeklickt haben. Dank Social Media, Fernsehen und allen anderen modernen Technologien sind die Menschen heute nicht gerade für ihre Geduld und Konzentration bekannt.

Geschwindigkeit ist der stille Killer von Websites. Fast die Hälfte aller Website-Benutzer erwartet, dass Ihre Website in 2 Sekunden oder weniger geladen wird. Das mag verrückt klingen, aber es ist wahr, dass selbst ein paar Sekunden langsamer Ladezeit Benutzer ohne einen zweiten Gedanken verscheuchen. Die Realität ist, dass Ihre Website richtig und schnell geladen werden muss.

Best Practices für die Ladegeschwindigkeit von Websites

Sie werden möglicherweise nicht erkennen, wie langsam Ihre Website tatsächlich ist, es sei denn, Sie testen sie selbst. Zum Glück können Sie dies kostenlos bei Google PageSpeed ​​tun. Es ist ein webbasiertes Tool, mit dem Sie Ihre Ladezeiten lokalisieren und Problembereiche finden können. Wie sieht es mit der Ladezeit Ihrer Website aus? Wenn Sie etwas Arbeit brauchen, machen Sie sich keine Sorgen. Es ist einfacher als Sie denken, die Ladezeit Ihrer Website mit nur wenigen Klicks zu verbessern. Hier sind einige zusätzliche Tipps für den Anfang.

Verwenden Sie die Gzip-Komprimierung für eine bessere Ladegeschwindigkeit der Website

Die Gzip-Komprimierung ist ein leistungsstarkes Tool, das die Antwortgröße um etwa 70 % reduziert, was beeindruckend ist. Gzip wird über Ihren Host ausgeführt. Sie müssen Ihren Webhost also fragen, ob er diese Komprimierung auf seinen Servern verwendet. Mit Gzip verkürzen Sie die Reaktionszeit, ohne die Qualität Ihrer Videos, Bilder oder anderer Elemente zu beeinträchtigen.

Sie können einen Test durchführen, um zu sehen, ob Ihre Website GZIPPED ist, und einen Zip-Kompressionstest durchführen. Die Funktionsweise von Gzipping besteht darin, die Größe der HTTP-Antwort zu reduzieren. Es ändert letztendlich das Gewicht der Seite.

Cachen Sie Ihre Dateien

Caching ist, wenn eine Version Ihrer Website in den Browsern Ihrer Benutzer gespeichert wird. Auf diese Weise wird beim erneuten Besuch Ihrer Website eine frühere Version geladen, bis die neue Version aktualisiert werden kann. Caching kann Ihre Ladezeit von über 2 Sekunden auf weniger als 1 Sekunde reduzieren. Das ist ein großer Sprung und Sie sollten sich darum kümmern. Glücklicherweise ist es einfach, Caching mit Ihrer Website einzurichten. Wenn Sie WordPress verwenden, können Sie das kostenlose W3 Total Cache-Plugin verwenden. Caching ist heute ein Muss, um die Ladeleistung Ihrer Website zusätzlich zu steigern.

Neben serverseitigem Caching sollten Sie auch Browser-Caching aktivieren. Dies ist im Wesentlichen eine Möglichkeit, Browser anzuweisen, eine Kopie statischer Dateien wie Bilder, CSS- und JS-Dateien im Browser zu speichern, damit Besucher nicht warten müssen, bis diese Dateien erneut heruntergeladen werden, wenn sie Ihre Website erneut besuchen. Sie können mehr in dieser Sammlung von Informationen darüber lesen, wie WordPress Browser-Caching nutzt.

Aktualisieren Sie Ihren Website-Host

Der richtige Host für Ihre Website kann sich auf Ihre Seitenleistung auswirken. Sie können so viele Änderungen an Ihrer Website vornehmen, wie Sie möchten. Wenn Sie jedoch keine großen Verbesserungen feststellen, ist möglicherweise Ihr Host schuld. Es ist verlockend, beim ersten Start Ihrer Website die günstigste Hosting-Option zu wählen. Dies mag zwar für eine Weile in Ordnung sein, aber Sie werden wahrscheinlich darüber hinauswachsen, wenn Sie viele Dateien hosten oder wenn Sie mehr Datenverkehr haben.

Wahrscheinlich werden billigere Pläne geteilt, und das bedeutet, dass Probleme auf den Websites Ihres Nachbarn auch Ihre eigenen betreffen. Mit einem dedizierten Server können Sie alle Probleme vermeiden, die auftreten können, wenn Sie sich auf einem gemeinsam genutzten Server befinden. Sie haben auch mehr Kundenservice-Optionen, wenn Sie Hilfe bei Ihrer Reaktionszeit benötigen.

Hosting kaufen

Überprüfen Sie Ihr Website-Theme

Die Art und Weise, wie Ihre Website gestaltet ist, spielt auch eine Rolle, wie gut und schnell Ihre Website den Besuchern angezeigt wird. Das Wechseln des Themes kann alles sein, was Sie brauchen, um ein paar wertvolle Sekunden in der Ladezeit Ihrer Website zu sparen.

Die Verwendung eines professionellen Website-Builders oder -Designs stellt sicher, dass Ihre Website nicht mit unnötigem, unordentlichem Code aufgebläht wird. Aus diesem Grund ist es wichtig, mehr als nur die Ästhetik Ihrer Website-Vorlage, Ihres Designs oder Ihres Builders zu untersuchen. Erwägen Sie außerdem, sich bei Ihrer Website oder Web-App anzumelden. Die Website-Protokollierung hilft Ihnen, Probleme zu erkennen, bevor sie auftreten, und kann verhindern, dass auf Ihrer Website Probleme auftreten. Alternativ können Sie Protokollnachrichten direkt mit einem Tool wie der Papertrail App senden.

Reduzieren Sie Ihre Java- und CSS-Dateien

Die meisten Websites verwenden heutzutage viele Javascript- und CSS-Dateien, und diese Dateien können in den Browsern Ihrer Benutzer einzeln behandelt werden. Wenn Sie zu viele Anfragen gleichzeitig haben, wird die Ladegeschwindigkeit Ihrer Website verringert. Wenn Sie alle diese Dateien minimieren können, wird die Ladezeit Ihrer Website nicht so stark belastet.

Es ist eine kluge Idee, Ihre Java- und CSS-Dateien extern laden zu lassen, anstatt jede Seite zu verkrampfen. Dann müssen die Benutzer die Dateien nur so laden, wie sie erscheinen, nicht jedes Mal, wenn jemand eine neue Seite auf Ihrer Website besucht. Verstopfen Sie die Browser Ihrer Benutzer nicht mit zu vielen Dateien.

Tragen Sie Ihre Last über das Netzwerk

Wenn Sie hohen Datenverkehr haben, müssen Sie Ihr Netzwerk ernst nehmen. Ein Content Delivery Network (CDN)-Dienst bringt die Dateien direkt zu Ihren Benutzern, indem er Server in vielen verschiedenen geografischen Gebieten verwendet. Dies bedeutet, dass zwischen den Orten weniger Zeit vergeht, sodass Ihre Website schneller geladen werden kann. Das bekannteste CDN ist Amazon CloudFront und lässt sich ganz einfach in Ihre aktuelle Website integrieren.

Testen Sie externe Hosting-Plattformen

Ähnlich wie bei CDN können Sie Ihre Dateien auf externen Hosting-Plattformen hosten, um eine Verlangsamung Ihrer Ladezeit zu vermeiden. Dies ist am häufigsten bei Videodateien der Fall. Videos sind ziemlich umfangreich und das direkte Hochladen auf Ihre Website nimmt viel Platz ein. Sie können leicht über 100 MB groß sein, daher ist es kein kluger Schachzug, Videos oder andere große Dateien auf Ihrem eigenen Server zu hosten.

Es ist eine bessere Idee, diese Dateien extern zu hosten. YouTube und Vimeo sind großartige Optionen für Videodateien. Von dort aus können Sie das Video auf Ihrer Website einbetten. Es spart Platz und verlangsamt nicht Ihre Ladezeit. Es ist auch viel einfacher!

Insbesondere die Nutzung von YouTube öffnet Ihre Inhalte einem völlig neuen Publikum. Tatsächlich gilt YouTube als eine der größten Suchmaschinen und zieht monatlich über eine Milliarde Nutzer an. Die Nutzung ist kostenlos und Sie können Videos mit einer Länge von bis zu 15 Minuten hochladen (oder länger, wenn Sie eine Anfrage senden). Sie können einfach nichts falsch machen.

Überprüfen Sie Ihre HTTP-Anfragen

Yahoo behauptet, dass 80 % der Ladezeit einer Website durch das Herunterladen all der verschiedenen Teile einer Seite verursacht werden. Wir haben zwar bereits Best Practices für Java- und CSS-Dateien besprochen, aber was ist mit allem anderen? Je mehr On-Page-Elemente geladen werden müssen, desto länger dauert es, bis die Seite vollständig angezeigt wird.

Sie können in Ihrem Browser überprüfen, wie viele dieser Anfragen ausgeführt werden. Google Chrome ist mit Entwicklertools ausgestattet, die sich auf HTTP-Anfragen konzentrieren. Um auf diese Tools zuzugreifen, klicken Sie mit der rechten Maustaste auf Ihre Seite in Google Chrome, klicken Sie auf Überprüfen und navigieren Sie dann zur Registerkarte Netzwerk.

Jetzt können Sie im Abschnitt „Zeit“ sehen, wie lange das Laden jeder Datei dauert. In der Ecke sehen Sie auch die Gesamtzahl der Anfragen. Die Reduzierung der Anfragen, die die meiste Zeit in Anspruch nehmen, ist eine einfache Möglichkeit, die Ladezeit Ihrer Website zu verkürzen. Lesen Sie im nächsten Tipp weiter, um zu erfahren, wie Sie Dateien am besten kombinieren.

HTML-Dateien kombinieren und minimieren

Wenn Sie eine Datei verkleinern, entfernen Sie unnötigen Leerraum oder Code. All diese kleinen Dinge mögen nicht wichtig erscheinen, aber das erhöht Ihre Ladezeit. Das Ziel sind möglichst schlanke HTML-Dateien.

Überprüfen Sie Ihre Website, um zu sehen, ob unnötige Seiten vorhanden sind, die Sie nicht mehr verwenden. Gibt es Orte, an denen Sie Leerzeichen oder unnötigen Code eliminieren können? Kombinieren Sie schließlich HTML-Dateien, um sicherzustellen, dass Sie die Ladezeit Ihrer Website nicht verzögern.

Externes CSS verwenden

Mit CSS fügen Sie die Stil- und Designelemente für Ihre Seite ein. Ihre Website kann entweder auf eine externe Datei zugreifen, die vor Ihrer Seite geladen wird, oder auf Inline-Styling zugreifen. Das Einfügen Ihres CSS in Ihr HTML-Dokument selbst fügt viel Code hinzu. Wie gesagt, das ist nicht gut.

Stattdessen sollten Sie ein externes CSS verwenden, das in den Kopf Ihres HTML-Codes geladen wird. Fügen Sie kein CSS in Ihr HTML ein, wenn Sie es vermeiden können. Dies bedeutet insbesondere Divs oder Überschriften. Es ist viel sauberer und schlanker, wenn Sie ein externes Stylesheet verwenden. Es ist auch viel einfacher zu bearbeiten.

Wenn Sie sich über den Status Ihres CSS nicht sicher sind, verwenden Sie CSS-Bereitstellungstools, um zu sehen, wie sich Ihre CSS-Dateien stapeln. Dadurch erfahren Sie, wo sich Ihre externe Datei befindet und ob Sie Inline-Elemente in Ihrem HTML-Code haben. Verwenden Sie nach Möglichkeit nur eine externe CSS-Datei. Sie können wahrscheinlich Dateien kombinieren, wenn Sie mehr als eine haben.

Verschieben Sie Ihr Javascript-Laden

Wenn Sie eine Datei wie JavaScript zurückstellen, stellen Sie sicher, dass der Rest Ihrer Website ordnungsgemäß geladen wird, bevor die zusätzlichen Java-Elemente geladen werden. Manchmal ist das Aufschieben von Java so einfach wie die Verwendung eines Plugins. In anderen Fällen müssen Sie manuell ein HTML-Skript hinzufügen, um der Website mitzuteilen, dass Sie Java zuletzt laden möchten.

Dieses Skript ruft nach einer externen JavaScript-Datei. Hier finden Sie ein vollständiges Tutorial zum Zurückstellen Ihres Java. Dies ist zwar kein großer Unterschied, kann jedoch dazu führen, dass Ihr Papier schneller geladen wird.

Überprüfen Sie Ihre Zeit bis zum ersten Byte

Ihre Zeit bis zum ersten Byte (TTFB) gibt an, wie lange ein Browser wartet, bevor er beginnt, sein erstes Datenbyte zu laden. Laut Google sollte Ihre TTFB unter 200 ms liegen. Dies ist jedoch ein serverseitiges Problem, sodass es für mehr Webentwickler leicht zu übersehen ist.

Wenn Benutzer Ihre Website besuchen, wird sie nicht automatisch geladen. Obwohl es wie ein sofortiger Prozess erscheinen mag, gibt es 3 Schritte, die zuerst passieren. Ihr Browser sendet eine erste HTTP-Anfrage an den Server, der die Website hostet, und von dort aus sind die Schritte DNS-Suche, Serververarbeitung und Antwort.

Auch hier zeigen Ihre Chrome-Entwicklertools, wie lange dieser Vorgang auf Ihrer Webseite dauert. Dies hängt auch stark von der Stärke der Internetverbindung ab. Eine langsame Verbindung hat eine langsamere TTFB. Überprüfen Sie Ihre TTFB, um sicherzustellen, dass sie unter 200 ms liegt. Wenn nicht, ist es an der Zeit, mit Ihrem Gastgeber über die richtige Lösung zu sprechen. Möglicherweise haben Sie nicht genügend Speicherplatz oder zu viel Verkehr.

Übergeordneter Inhalt zuerst

Manchmal haben Sie lange Seiten, deren Laden eine Weile dauert. Das ist Realität. Wenn Sie jedoch sicherstellen, dass zuerst die oben angezeigten Informationen geladen werden, können Sie einige Besucher ersparen. Verbessern Sie Ihre Benutzererfahrung, indem Sie sicherstellen, dass alle oben auf der Seite angezeigten Inhalte schnell angezeigt werden.

Dies ist ein Prozess, der als „Lazy Loading“ bezeichnet wird, und der Name ist sinnvoll. Es ist, als würde man die Seite langsam nach unten laden, aber es beginnt oben, wo Ihre Benutzer am konzentriertesten sind. Mit Lazy Loading können Ihre Benutzer die wichtigsten Inhalte sehen und die Ladegeschwindigkeit der Website erhöhen, ohne warten zu müssen, bis der Rest der Seite geladen ist. Dies ist eine großartige Idee, denn stellen Sie sich vor, auf der Seite mehr als 10 Fotos zu haben. Sie möchten nicht, dass Ihre Besucher warten, bis all diese Bilder geladen sind, um mit dem Lesen zu beginnen.

Lazy Load verwendet jQuery.sonar, um nur sichtbare Bilder zu laden. Es gibt viele Plugins, die es einfach machen, Ihren Seiten Lazy Load hinzuzufügen, aber hier ist ein vollständiges Tutorial, um dies manuell zu tun. Ihre Nutzer werden froh sein, dass sie nicht mehr auf Over-the-Fold-Inhalte warten müssen.

Überprüfen Sie Ihre Bildgrößen

Es ist ganz einfach, Bilder hochzuladen, ohne die Dateigröße zu überprüfen. Dies mag ab und zu in Ordnung sein, aber es kann Ihre Website leicht verlangsamen, wenn Sie nicht aufpassen. Wenn Sie Ihre Bilder speichern, versuchen Sie, sie mit der Option "Für Web speichern" zu speichern. Dies ist mit Tools wie Photoshop oder Fireworks verfügbar. Mit „Für Web speichern“ kann die Bildgröße reduziert werden, ohne dass die Schärfe des Bildes verloren geht.

Vermeiden Sie im Allgemeinen größere Dateigrößen. PNG beim Speichern Ihrer Bilder. Sie können Ihre Bildeigenschaften überprüfen, um zu sehen, ob sie an größere Größen grenzen. Wenn Sie bereits große Bilder auf Ihrer Website haben, verwenden Sie schließlich ein Plugin oder komprimieren Sie diese Dateien manuell, um die Ladegeschwindigkeit Ihrer Website zu verbessern.

Löschen Sie unnötige Extras für eine bessere Ladegeschwindigkeit der Website

Manchmal fügen wir unseren Websites neue Dinge hinzu und vergessen sie. Entweder gehen wir zu etwas anderem über oder brauchen keine Lösung aus der Vergangenheit mehr. Was auch immer der Grund dafür ist, überprüfen Sie Ihre Website regelmäßig, um sicherzustellen, dass Sie keinen Platz für Dinge verschwenden, die Sie nicht verwenden. Dies gilt für alles Folgende:

• Bilder;
• Plugins;
• Navigationselemente;
• Design-Elemente;
• Seiten;
• Archivierte Blogbeiträge.

Egal wie klein, diese wirken sich negativ auf die Ladegeschwindigkeit Ihrer Website aus. Darüber hinaus können sie insbesondere bei Plugins Schwachstellen in der Sicherheit Ihrer Website schaffen. Diese können leicht beschädigt werden, was Ihre Sicherheit beeinträchtigen kann. Gewöhnen Sie sich an, Ihre Website regelmäßig auf veraltete Extras zu überprüfen.

Begrenzen Sie Ihre Social-Sharing-Buttons

Social-Sharing-Buttons sind eine großartige Möglichkeit, das Engagement in sozialen Medien zu fördern. Es muss jedoch eine Grenze geben. Diese Tasten sind manchmal sehr effektiv. Sie können jedoch auch eine Büste sein. Worauf wir uns einigen können ist, dass diese Social-Sharing-Buttons mehrere externe JavaScripts verwenden und diese Ihre Website verlangsamen.

Vor allem Facebook ist daran schuld. Facebook-Skripte können die Leistung der Website mit ihren Share-Buttons verlangsamen. Überlegen Sie, ob diese Share-Buttons den Aufwand wirklich wert sind. Sie können sie weiterhin behalten, aber behalten Sie nur diejenigen, die sich als Top-Performer erwiesen haben.

Asynchrone Zustellung

Apropos Drittanbieter-Codes: Es kann viel schief gehen. Wenn der Drittanbieter einen Ausfall erleidet oder plötzlich verlangsamt wird, kann Ihre Seite beim Versuch, diese Ressource zu laden, leicht stecken bleiben, egal ob es sich um eine Schaltfläche zum Teilen in sozialen Netzwerken oder ein Netzwerkanalyseskript handelt.

Die asynchrone Zustellung ist die Lösung für diese Verlangsamung. Wenn diese Option aktiviert ist, ist Ihre eigene Website nicht betroffen, wenn Ihr Drittanbieternetzwerk ausfällt. Sie können die asynchrone Zustellung auf verschiedene Weise aktivieren, die hier alle beschrieben werden.

Installieren Sie Google PageSpeed

Google PageSpeed ​​ist ein Open-Source-Servermodul, das die Ladegeschwindigkeit Ihrer Website optimiert. Es wurde von Google entwickelt, um Ihre Website schneller zu machen und ist einfach zu bedienen. Grundsätzlich werden sowohl an Ihrem Server als auch an Ihren Website-Dateien verschiedene Änderungen vorgenommen. Sie müssen nichts manuell tun und Ihre Website wird besser funktionieren.

Es ist so nah an einer Einheitslösung, die Sie finden werden, wenn es um die Leistung Ihrer Website geht. Sie können Google PageSpeed ​​selbst in Ihrem Dateimanager installieren oder Ihren Host oder Entwickler bitten, Sie bei der Installation zu unterstützen. Sie können es einstellen und vergessen.

Hintergrundbilder kombinieren

Viele Designs verwenden mehrere Hintergrundbilder, um ein einzelnes, vollständiges Bild zu erstellen. Dies sieht zwar großartig und gleichzeitig aus, kann jedoch die Leistung Ihrer Website verlangsamen. Da die Browser Ihrer Benutzer zum Laden der Hintergrundfotos mehrere unterschiedliche Anforderungen stellen müssen, nimmt dies beim Ladevorgang Zeit in Anspruch.

Kombinieren Sie stattdessen Ihre Bilder zu einem einzigen, um die Ladegeschwindigkeit Ihrer Website zu erhöhen. Auf diese Weise müssen Ihre Benutzer nicht viele, sondern nur eine einzige Anfrage stellen. Ihre Website wird schneller, da nicht mehr mehrere Roundtrip-Anfragen für das ordnungsgemäße Laden des Hintergrunds erforderlich sind.

Stoppen Sie das Verlinken von Bildern

Hotlinking ist das Einbetten eines Fotos von einer anderen Website in Ihre eigene, ohne es auf Ihren Server hochzuladen. Dies ist mit ein wenig Code einfach, aber es ist eine schlechte Vorgehensweise, die unter anderem zu einer Verlangsamung der Website führen kann.

Hotlinking schadet nicht nur Ihrer Website, es ist technisch auch Diebstahl, wenn Sie dies ohne Erlaubnis tun. Websitebesitzer zahlen für den Platz zum Hosten dieser Dateien, und wenn Sie dieselbe Datei über einen Einbettungscode auf Ihrer eigenen Website platzieren, nehmen Sie deren Ressourcen ohne Erlaubnis.

Es gibt zwar einige Websites, auf denen Sie Bilder direkt hochladen können, um sie zu teilen, aber dies ist immer noch keine gute Idee. Wenn diese Websites langsam sind oder viel Verkehr haben, können sie die Ladegeschwindigkeit Ihrer Website verlangsamen, wenn Sie sie einbetten. Außerdem können diese Dateien jederzeit ohne Vorwarnung gelöscht werden, es sei denn, Sie zahlen für Speicherplatz.

Ja, Hotlinking kann Ihnen etwas Bandbreite sparen, aber es ist wahrscheinlicher, dass es Ihre Website auf lange Sicht verlangsamt. Hosten Sie Ihre Bilder immer auf Ihrem eigenen Server, anstatt sie zu verlinken. Im Zweifelsfall ist es besser, mehr Speicherplatz auf Ihrem eigenen Server zu kaufen, damit Sie es sich leisten können, sie hochzuladen. Sie sollten ohnehin kleine Bilddateien verwenden, daher sollte dies kein Problem sein.

Erhöhen Sie noch heute die Ladegeschwindigkeit Ihrer Website

Sind Sie bereit, Ihre Website zu neuen Höhen zu führen? Es ist an der Zeit, die Ladegeschwindigkeit Ihrer Website zu erhöhen. Wenn Sie eine langsame Ladegeschwindigkeit der Website haben, können Besucher leicht unbeabsichtigt verloren gehen. Denken Sie daran, wie frustrierend Sie es fanden, wenn das Laden einer Website zu lange dauert. Eine Verzögerung der Website-Ladezeit um eine Sekunde führt zu einem Rückgang der Conversions um 7 % und der Seitenaufrufe um 11 %. Tun Sie das Ihren Benutzern nicht an, indem Sie diese Tipps oben ernst nehmen.

Die Beschleunigung Ihrer Website ist nicht kompliziert, teuer oder verwirrend. Es ist eine der einfachsten und schnellsten Möglichkeiten, Ihre SEO zu verbessern und einen positiven Einfluss auf Ihre Benutzer zu haben. Wenn Sie möchten, dass Ihre Website besser läuft und Ihre Benutzer beeindrucken, lohnt es sich, in die obigen Tipps zu investieren.

Von der Vermeidung von Hotlinks und defekten Links bis hin zum Upgrade Ihres Webhostings haben selbst die kleinen Schritte oben eine große Wirkung. Wenn Sie überfordert sind, testen Sie einfach die Ladegeschwindigkeit Ihrer Website. Von dort aus haben Sie eine gute Vorstellung davon, wie viel Verbesserungen Sie vornehmen müssen, um sicherzustellen, dass Ihre Website auf dem maximalen Leistungsniveau läuft. Ihre Website benötigt möglicherweise nur ein paar Anpassungen, um den Google-Standards zu entsprechen. Ihre Benutzer sind es leid, zu warten, also ist es Zeit, sich an die Arbeit zu machen.

Vektor für die Ladegeschwindigkeit der Website erstellt von ibrandify