So gleichen Sie schnelle Ladegeschwindigkeiten von Webseiten mit umfangreichen Inhalten

Veröffentlicht: 2021-07-19

Schnelle Seitenladezeiten und reichhaltiger, interaktiver Inhalt sind beide der Schlüssel zum Erfolg einer Website, aber ein Gleichgewicht zwischen beiden zu finden, kann eine Herausforderung darstellen.

Es ist kein großes Geheimnis, dass Seitenladezeiten für den Erfolg einer Website extrem wichtig sind. Die Suchalgorithmen von Google begünstigen schnelle Ladezeiten und es gibt auch viele Untersuchungen, die zeigen, dass eine kleine Erhöhung der Seitenladezeit sich negativ auf die Conversions auswirken kann. Hallam Digital Marketing Manager Tom Whiley hat letztes Jahr einen ausgezeichneten Blog-Beitrag darüber geschrieben, wie Sie Ihre Seitenladegeschwindigkeit verbessern können. Während unsere Hosting-Partner WP Engine eine großartige Infografik zur Seitenladegeschwindigkeit erstellt haben.

Websites müssen auch reich an Inhalten, Bildern und Interaktivität sein , um Conversions zu fördern. Dies führt unweigerlich zu größeren Seiten, was die Seitenladezeit natürlich verlangsamt.

Der Konflikt zwischen dem Bedürfnis nach Geschwindigkeit und der Nachfrage nach reichhaltigen Inhalten kann Designprojekte zum Erliegen bringen. Daher ist es entscheidend, eine Balance zu finden, die beide Anforderungen erfüllt.

In diesem Blog werde ich einen Ansatz mit Ihnen teilen, der Ihnen hilft, diese beiden widersprüchlichen Herausforderungen in Einklang zu bringen.

Die Geschwindigkeit einer Seite ihrem Zweck zuordnen

Es ist nicht möglich, Ladezeiten vorherzusagen, bis eine Website zu einem einigermaßen ausgereiften Stadium entwickelt wurde. Daher ist es am besten, einen iterativen Ansatz zur Messung und Verbesserung der Geschwindigkeit zu wählen.

Der wichtigste Ausgangspunkt besteht darin, die SEO-Landingpages der Website und ihre Rich-Content-Seiten zu identifizieren. Sie können sich dann darauf konzentrieren, die Seitengröße und die Ladegeschwindigkeit der SEO-Seiten so weit wie möglich zu reduzieren.

Ebenso kann den Rich Landing Pages etwas mehr Platz für die Benutzerinteraktion eingeräumt werden.

Hier ist ein grober Prozess, der angewendet werden kann:

  1. Identifizieren Sie die wichtigsten Zielseiten, auf die wir bei reduzierten Ladegeschwindigkeiten abzielen.
  2. Entwickeln Sie nach Best Practices für niedrige Ladezeiten.
  3. Entscheiden Sie sich für Funktionen rund um Best Practices für niedrige Ladezeiten.
  4. Entwickeln Sie die Seite(n).
  5. Messen und suchen Sie nach Möglichkeiten, um Ladezeit zu sparen.
  6. Wiederholen Sie 4-5 nach Bedarf.

Dies deckt nur den ersten Teil der Geschichte ab. Die wichtigsten SEO-Seiten müssen dann kontinuierlich auf Seitenladezeiten überwacht werden, um sicherzustellen, dass sie weiterhin wie erwartet funktionieren, insbesondere wenn ein Content-Management-System verwendet wird, das es jedem ermöglicht, die Seiten zu bearbeiten.

Nach dem Start der Website gibt es also zwei einfache Schritte, die befolgt werden können:

  1. Richten Sie eine monatliche Überprüfung der wichtigsten Zielseiten ein, um sicherzustellen, dass sie weiterhin funktionieren.
  2. Verwenden Sie ein Tool zur Überwachung der Seitengeschwindigkeit, das ausgelöst wird, sobald die Leistung der Seite unter einem vereinbarten Niveau liegt.

Designüberlegungen zur Optimierung der Lastgeschwindigkeiten

Das Design der Website spielt eine wichtige Rolle bei der Bestimmung, wie weit die Seitenladezeiten optimiert werden können. Wenn es um Webseiten geht, ist die Größe wirklich wichtig. Ziel ist es, die Seitenladezeit im Idealfall unter 500.000, aber sicherlich höchstens unter 1 MB zu halten.

Hier sind einige Schritte, um die Ladezeiten zu minimieren:

  1. Minimieren Sie die Verwendung von Bildern auf wichtigen Zielseiten so weit wie möglich. Es ist zu einfach, Bilder zu verwenden, um eine Seite reichhaltig erscheinen zu lassen, wenn die subtile Verwendung von Ikonografie und Design den gleichen Effekt haben kann.
  2. Wenn Bildmaterial verwendet wird, sollte es optimiert werden, während sichergestellt wird, dass es keine inakzeptablen Qualitätsverluste gibt.
  3. Nutzen Sie schlanke Landingpages, die für die organische Suche optimiert sind, und behalten Sie Rich Content auf tieferen Seiten, die nicht für die organische Suche bestimmt sind.
  4. Vermeiden Sie viele einzigartige, komplexe Layouts über mehrere Vorlagen hinweg. Je einfacher das HTML-Markup, desto kleiner werden die Dateien.
  5. Vermeiden Sie komplexe interaktive Elemente, die auf umfangreiche Javascript-Bibliotheken angewiesen sind. Es mag cool aussehen, wenn sich etwas über den Bildschirm bewegt, aber ist das wirklich notwendig?

Technische Überlegungen bei der Implementierung

Und schließlich können wir auf einige der eher technischen Aspekte der Seitenladegeschwindigkeit eingehen, die bei der Hosting-Wahl berücksichtigt werden müssen:

  1. Entfernen Sie nach Möglichkeit die Abhängigkeit von Skripten von Drittanbietern. Diese verursachen Probleme, da Sie nicht nur darauf angewiesen sind, dass diese Skripte geladen werden, bevor die Seite geladen wird, sondern manchmal auch unter hoher Last und langsamer als üblich geladen wird. Dies kann zu „klumpigen“ Ladezeiten führen.
  2. Verwenden Sie Lazy-Loading-Techniken, um sicherzustellen, dass Bilder geladen werden, die nicht über dem Falz erscheinen, wenn der Benutzer in die Ansicht scrollt.
  3. Nutzen Sie responsive Bilder besser. Es gab einige Fortschritte bei der Verarbeitung von responsiven Bildern durch Browser, was bedeutet, dass wir kein einziges großes Bild bereitstellen müssen, das auf allen Ansichtsports funktioniert und ein besseres Bild für bestimmte Auflösungen bieten kann.
  4. Stellen Sie sicher, dass eingebettete Videos eingebettet werden, nachdem die Seite geladen wurde, und nicht beim Laden der Seite. Das bedeutet, dass Benutzer ein Vorschaubild für ein Video sehen und dann das eigentliche Video sehen, nachdem sie auf den Link geklickt haben.
  5. Vermeiden Sie große htaccess-Dateien für 301-Weiterleitungen und kombinieren Sie Regeln in Sammelkategorie-Weiterleitungen, anstatt einzelne Seite-zu-Seite-Weiterleitungen.
  6. Verwenden Sie ein CDN für Bilder. Dies muss überprüft werden, da CDNs die Leistung beeinträchtigen können, wenn die Benutzerbasis der Site besonders lokalisiert ist.
  7. CSS- und Javascript-Dateien minimieren. In den meisten Fällen sollten Sie dies bereits tun, es können jedoch weitere Möglichkeiten bestehen, einige der Dateien auf Schlüsselseiten zu reduzieren. Dies ist ein zentraler Bestandteil bei der Entscheidung über die Installation neuer Plugins.
  8. Stellen Sie die Unterstützung für ältere Browser ein. Bei älteren Browsern müssen bestimmte CSS- und JS-Dateien erstellt und bedingt in die Site geladen werden. Wenn wir diese vollständig entfernen können, ist dies eine Anfrage weniger.
  9. Minimieren Sie die Anzahl der auf Ihrer Website verwendeten Plugins. Wir erben regelmäßig Websites, die unter Plugin-Blähung leiden. Es ist kein neues Problem bei der Arbeit mit einem CMS, aber immer noch ein großes.
  10. Entfernen Sie jegliche Abhängigkeit von nicht wesentlichen Hosting-Anforderungen, wie z. B. Image-Hosting für E-Mail-Signaturen
  11. Führen Sie Abfragen zur Datenbankoptimierung aus. Wenn Ihre Website schon eine Weile existiert, gibt es eine Reihe von Datenbanktechniken, mit denen Sie die Ausführungszeit von Abfragen optimieren können.

Zusammenfassend lässt sich sagen, dass die Erstellung einer hochoptimierten Website ein Gleichgewicht zwischen Spezifikation, Design und Implementierung ist. Entscheidend ist für mich, die hochoptimierten SEO-Seiten nach Möglichkeit von anderen Seiten abzugrenzen und diese so weit wie möglich zu optimieren.


Wenn Sie Hilfe bei Ihrer Webentwicklung benötigen, zögern Sie nicht, uns zu kontaktieren.