Start
/
Website-Hilfe
/
SEO
/
Google PageSpeed Insights-Leitfaden – 21 Möglichkeiten, Ihren Score zu verbessern

Google PageSpeed Insights-Leitfaden – 21 Möglichkeiten, Ihren Score zu verbessern

In der dynamischen, schnelllebigen und sich ständig verändernden Welt des Internets wetteifern Millionen von Websites um die Aufmerksamkeit der Besucher. Dieser harte Wettbewerb hat einen starken Schwerpunkt auf Geschwindigkeitsoptimierung und Benutzererfahrung gelegt, die entscheidende Faktoren sind, die über Erfolg oder Misserfolg Ihrer Website entscheiden können.

Hier können Sie Google PageSpeed Insights (PSI) sinnvoll einsetzen. In diesem Leitfaden erfahren Sie, was PageSpeed Insights ist und wie es Ihnen dabei helfen kann, Ihre Website auf den Ergebnisseiten von Suchmaschinen an die Spitze zu bringen.

Google PageSpeed Insights (PSI) ist ein Online-Testtool, das detaillierte Berichte über die Leistung Ihrer Website auf Mobil- und Desktop-Geräten liefert.

Durch Eingabe Ihrer Website-URL bewertet PSI die Leistung Ihrer Website und schlüsselt die Ergebnisse in mehrere Schlüsselkennzahlen auf.

Diese Ergebnisse können Ihnen helfen zu verstehen, was Ihre Website verlangsamt und was Sie tun können, um Ihre Website zu verbessern.

Was ist die Bedeutung von Google PageSpeed Insights Score?

In der wettbewerbsorientierten digitalen Landschaft kann Ihnen eine schnellere Website einen Vorteil gegenüber langsameren Konkurrenten verschaffen. Eine schnelle, stabile, gut gestaltete und einfach zu navigierende Website führt zu höheren Conversions und Verkäufen.

Google PageSpeed Insights überprüft Ihre Website anhand mehrerer wichtiger Metriken und weist jedem Punkte zu , um leicht zu verstehen, wie Ihre Website abschneidet. Ein höherer PageSpeed Insights Score kann Ihnen helfen, mehr Besucher anzuziehen und Ihre Website in der SERP (Search Engine Results Page) vorne zu positionieren. Wenn Sie das Tool regelmäßig verwenden, können Sie die Leistung Ihrer Website überwachen und sich auf bestimmte Bereiche konzentrieren, die verfeinert werden müssen, um mit Ihren Konkurrenten mithalten zu können.

Nichtsdestotrotz sollten Sie nicht besessen davon sein, 100/100 Messwerte für alle Metriken zu erhalten . Selbst die beliebtesten Websites können keine perfekte Punktzahl erreichen. Das Erhöhen Ihrer Punktzahl sollte nicht auf Kosten der Benutzererfahrung gehen.

Sie sollten sich bemühen, eine so hohe Punktzahl wie möglich zu erreichen, aber solange Ihre Website bei allen Metriken „im grünen Bereich“ liegt, sollten Sie sich beruhigt zurücklehnen. Dies gilt insbesondere, wenn Sie bereits die 90%-Schwelle überschritten haben. Der Versuch, die Punktzahl über 90 zu erhöhen, hat oft keinen praktischen Nutzen, und es lohnt sich möglicherweise nicht, Zeit und Ressourcen zu investieren.

Google PageSpeed Insights vs. Google Lighthouse

Sowohl PageSpeed Insights als auch Lighthouse sind von Google entwickelte Tools, die die Leistung Ihrer Website messen. Sie wenden jedoch unterschiedliche Bewertungsmethoden an:

  • Google PageSpeed Insights verfolgt einen allgemeineren Ansatz – es leitet Daten aus den Erfahrungen von Echtzeit-Besuchern Ihrer Website ab. Darüber hinaus bewertet PSI Ihre Website in einer kontrollierten Umgebung, die Ergebnisse liefert, die Entwickler nützlich finden werden. Daher zeichnet PageSpeed Insights ein umfassenderes Bild der Leistung Ihrer Website.
  • Lighthouse konzentriert sich auf die Bewertung Ihrer Website auf eine simulierte Verbindung mit den gleichen voreingestellten Bedingungen – das gleiche Netzwerk und vordefinierte Geräte. Es bietet mehr technische Daten, was besonders für Entwickler nützlich ist, die Webseiten debuggen müssen.

Wie wirkt sich mein Google PageSpeed Insights Score auf SEO aus?

Bei der Berechnung Ihres SEO-Scores betreibt Google Ihre Website nicht über PageSpeed Insights. Daher hat der PSI-Score keinen direkten Einfluss auf Ihr Ranking.

Davon abgesehen misst PageSpeed Insights Metriken, die wichtige Ranking-Faktoren für Ihren SEO-Score sind. So können Sie mit PSI die Geschwindigkeit, Zugänglichkeit und Benutzererfahrung Ihrer Website verbessern, was unweigerlich Ihren SEO-Score erhöhen wird.

Wie benutzt man das Google PageSpeed Insights Tool?

Die Verwendung von Google PageSpeed Insights ist ziemlich einfach. Sie müssen nur Ihre Seiten-URL in die Adressleiste auf dem Bildschirm eingeben. Das Tool wird Ihre Website bewerten und die Ergebnisse visualisieren. Nachfolgend finden Sie die Schritt-für-Schritt-Anleitung.

  1. Öffnen Sie die PageSpeed Insights-Seite.
  2. Geben Sie die URL Ihrer Website in die Adressleiste ein und klicken Sie auf Analysieren.
    Wie beginnt man mit der Analyse einer Website mit Google PageSpeed Insights
  3. PageSpeed Insights wird Ihre Website für ein paar Minuten crawlen und ihre Leistungskennzahlen visualisieren. Überprüfen Sie die Geschwindigkeitstestergebnisse für Mobil und Computer-Geräte.
    Sie können zwischen Diese URL (zeigt Ergebnisse für die spezifische Seite, die Sie eingereicht haben) und Ursprung (zeigt Ergebnisse für die gesamte Domain/Website) wechseln.

    Mobile und Computer-Ergebnisse für eine Webseite in Google PageSpeed Insights
  4. Klicken Sie auf Ansicht erweitern, um eine detaillierte Ansicht der Core Web Vitals Metriken zu erhalten.
    Erweiterte Ansicht der Core Web Vitals in Google PageSpeed Insights
  5. Gehen Sie nach unten zu den Lighthouse-Ergebnissen und klicken Sie auf eines davon, um die ausstehenden Probleme anzuzeigen.
    Lighthouse-Ergebnisse in Google PageSpeed Insights

    PageSpeed Insights listet Probleme im Zusammenhang mit der ausgewählten Metrik auf.

    Aufschlüsselung der SEO-bezogenen Probleme im Lighthouse-Bereich von Google PageSpeed InsightsAufschlüsselung der SEO-bezogenen Probleme im Lighthouse-Bereich von Google PageSpeed Insights
  6. Scrollen Sie nach unten zum Abschnitt Empfehlungen, um Vorschläge für allgemeine Verbesserungen und Schätzungen zu sehen, wie viel Ladezeit jeder einzelne sparen würde, wenn er angewendet würde.
    Überprüfen Sie auch den Abschnitt Diagnose, der erweiterte Verbesserungen vorschlägt.

    Empfehlungen und Diagnose Abschnitte in Google PageSpeed Insights
  7. Klicken Sie auf den Pfeil neben jedem Problem, um den detaillierten Bericht anzuzeigen.
    Detaillierte Ansicht eines Problems aus dem Abschnitt „Empfehlungen“ in Google PageSpeed Insights

PageSpeed Insights Scores und Berichte verstehen

Google PageSpeed Insights Scores und Berichte bieten eine umfassende Analyse der Leistung Ihrer Webseite, unter Berücksichtigung verschiedener Metriken und Benchmarks.

Nachdem es Ihre Webseite überprüft hat, vergibt PSI eine Punktzahl zwischen 0 und 100 basierend auf der Leistung. Diese Punktzahl wird wie folgt kategorisiert:

  • 0 bis 49 (schlecht) – Zeigt an, dass die Seitengeschwindigkeit ernsthaft verbessert werden muss.
  • 50 bis 89 (Durchschnitt) – Die Seitenleistung ist anständig, könnte aber verbessert werden.
  • 90 bis 100 (gut) – Die Webseite ist gut optimiert.

Je höher die Punktzahl, desto besser funktioniert Ihre Webseite und desto besser ist die Benutzererfahrung.

Core Web Vitals-Bewertung (Felddaten)

Felddaten bieten eine Momentaufnahme der Leistung Ihrer Webseite mit realen Daten, die von tatsächlichen Benutzern über den Chrome User Experience Report (CrUX) gesammelt wurden. Dazu gehören First Contentful Paint (FCP), Largest Contentful Paint (LCP), First Input Delay (FID) und Cumulative Layout Shift (CLS).

  • First Contentful Paint (FCP) – Misst die Zeit von dem Moment an, in dem die Seite geladen wird, bis ein Teil des Seiteninhalts auf dem Bildschirm gerendert wird.
  • Largest Contentful Paint (LCP) – Misst die Zeit, die das Hauptelement der visuellen Seite auf dem Bildschirm lädt. Es ist ein guter Geschwindigkeitsleistungsindikator.
  • First Input Delay (FID) – Zeigt an, wie interaktiv Ihre Website ist. Insbesondere misst es die Zeit, die Ihre Website braucht, um auf die erste Benutzerinteraktion zu reagieren, wie das Klicken auf eine Schaltfläche oder einen Link.
  • Cumulative Layout Shift (CLS) – Repräsentiert die visuelle Stabilität Ihrer Webseiten. Es misst, wie oft ein Besucher unerwartete Layout-Veränderungen erlebt, wenn die Seite geladen wird.
  • Time to First Byte (TTFB) – Diese Metrik misst die Zeit, die es braucht, bis das erste Byte einer Website-Antwort auf Benutzeranfragen eintrifft. TTFB ist ein Indikator für die Reaktionsfähigkeit und Geschwindigkeit eines Webservers.
  • Interaction to Next Paint (INP) – Eine neue Metrik, die First Input Delay (FID) im März 2024 ersetzen wird. Sie bewertet die allgemeine Reaktionsfähigkeit einer Webseite auf Benutzerinteraktionen wie Klicks, Tippen und Tastatureingaben während des Besuchs. Das Endergebnis stellt die längste Interaktion dar, die während eines einzelnen Besuchs gemessen wurde.

Diese Ergebnisse veranschaulichen die echte Erfahrung der Besucher mit Ihrer Website. PageSpeed Insights geht davon aus, dass Ihre Website den Core Web Vitals-Test für mobile oder Desktop-Geräte besteht, wenn Sie die 75%-Punkteschwelle überschreiten.

Labordaten

Labordaten bieten Einblicke in die Leistung Ihrer Webseite, basierend auf Tests in einer kontrollierten Umgebung . Die Ergebnisse werden von Google Lighthouse generiert, das eine Verbindung in einem vordefinierten Netzwerk und ausgewählten Desktop- und Mobilgeräten simuliert.

Es ist nützlich für das Debuggen von Leistungsproblemen und bietet Metriken wie Geschwindigkeitsindex, Zeit bis Interaktiv und Gesamtsperrzeit.

Empfehlungen, Diagnose und bestandene Prüfungen

Empfehlungen sind Empfehlungen von Google PageSpeed Insights zu allgemeinen Verbesserungen der Seitenladegeschwindigkeit. Auf der anderen Seite bietet der Abschnitt Diagnose zusätzliche Informationen darüber, wie eine Seite den besten Web-Entwicklungspraktiken entspricht.

Bestandene Prüfungen sind die Faktoren, in denen sich Ihre Webseite bereits auszeichnet, und zeigen die Aspekte Ihrer Website an, die gut optimiert sind.

21 Schritte zur Verbesserung des Google PageSpeed Insights Score

Schritt 1. Reduzieren Sie die Server-Antwortzeiten (TTFB)

Indem Sie die Server-Antwortzeit oder Time to First Byte (TTFB) reduzieren, können Sie die Leistung Ihrer Website verbessern und Ihren Google PageSpeed Insights Score erhöhen.
TTFB ist die Zeit, die der Browser eines Benutzers braucht, um das erste Datenbyte von Ihrem Webserver zu empfangen, nachdem eine Anfrage gestellt wurde. Eine hohe TTFB kann zu einer Verzögerung beim Webseiten-Rendering führen, was eine spürbare Verzögerung für den Benutzer verursacht. Google empfiehlt eine TTFB von unter 200 Millisekunden.

Nachfolgend finden Sie die wichtigsten Strategien, um die Antwortzeit des Servers zu verkürzen.

  • Wählen Sie ein zuverlässiges Hosting – Der wichtigste Faktor bei der Reduzierung der Server-Reaktionszeit ist die Wahl eines zuverlässigen Hosts mit leistungsstarken Hardware- und Software-Lösungen. SiteGround verfügt über erstklassige Server und verschiedene Lösungen zur Geschwindigkeitsverbesserung, die die optimale Leistung und schnelle Ladegeschwindigkeit Ihrer Website sicherstellen.
  • Server-Caching aktivieren – Server-Caching speichert eine Version Ihrer Website auf dem Server, wodurch die Zeit zum Generieren einer Seite reduziert wird.
  • Optimieren Sie Ihre Datenbank – Eine schlecht optimierte Datenbank kann zu langsamen Serverantwortzeiten führen. Löschen Sie regelmäßig alte oder unnötige Daten und ziehen Sie in Betracht, eine Indexierungslösung zu verwenden, um Datenbankabfragen zu beschleunigen.
    WordPress-Benutzer können die Verwendung von Plugins in Betracht ziehen, die eine geplante Datenbankwartung durchführen, wie Speed Optimizer. Um diese Funktion zu aktivieren, melden Sie sich in Ihrem Dashboard an und gehen Sie zu Speed Optimizer > Umgebung> Planmässige Instandhaltung der Datenbanken. Klicken Sie auf die entsprechende Schaltfläche Bearbeiten, um die Wartungsoptionen auszuwählen, die das Plugin durchführen wird.

    Optimieren Sie Ihre Datenbank mit dem Speed Optimizer Plugin
  • Verwenden Sie ein Content Delivery Network (CDN) – CDNs können den Inhalt Ihrer Website auf Servern auf der ganzen Welt zwischenspeichern. Dies bedeutet, dass die Anfrage eines Benutzers nicht so weit reisen muss, was TTFB reduziert.
  • Optimieren Sie Ihren Anwendungscode – Stellen Sie sicher, dass der Backend-Code Ihrer Website sauber und effizient ist und keine unnötigen Aufgaben enthält, die die Reaktionszeit verlangsamen könnten.

Welche konkreten Maßnahmen können Sie ergreifen, um diese Schritte umzusetzen? Finden Sie es in den folgenden Schritten heraus.

Schritt 2. Reduzieren Sie CSS und JavaScript

Große und sperrige CSS- und JavaScript-Dateien können Ihre Website erheblich verlangsamen und Ihren Google PageSpeed Insights Score senken. Die Reduzierung der Größe dieser Dateien kann Ihre Website beschleunigen, indem die Datenmenge, die heruntergeladen, geparst und ausgeführt werden muss, verringert wird. Im Folgenden finden Sie einige der effektivsten Möglichkeiten, dies zu erreichen.

  • Verkleinerung – Dies ist der Prozess, alle unnötigen Zeichen aus dem Quellcode zu entfernen, ohne seine Funktionalität zu ändern. Für WordPress-Websites sollten Sie die Funktionen CSS-Dateien minifizieren und JavaScript-Dateien minifizieren des Speed Optimizer Plugins in Betracht ziehen.
  • Eliminieren Sie ungenutzten Code – Während sich Ihre Website weiterentwickelt, kann es Teile von CSS- und JavaScript-Code geben, die nicht mehr benötigt werden.
  • Verwenden Sie kompakte Code-Strukturen – Die Verwendung von CSS-Kurzform-Eigenschaften und die Optimierung Ihrer JavaScript-Code-Struktur kann die Größe Ihrer Dateien drastisch reduzieren. Vermeiden Sie es, langen, sich wiederholenden Code zu schreiben, wo eine kompaktere Alternative zur Verfügung steht.

Lernen Sie in den folgenden Abschnitten praktische Methoden, um die JavaScript- und CSS-Dateien zu reduzieren.

Schritt 3. Beseitigen Sie Render-Blocking-Ressourcen

Renderblockierende Ressourcen sind Dateien, die verhindern, dass eine Webseite angezeigt wird, bis sie geladen wurden. Dazu gehören in der Regel CSS- und JavaScript-Dateien. Das Eliminieren oder Minimieren dieser Ressourcen kann die Ladezeiten und die Gesamtleistung Ihrer Website erheblich verbessern.

Sie können die Render-Blocking-Ressourcen aus den PageSpeed Insights-Berichten identifizieren. Bestimmen Sie dann, welche nicht unbedingt erforderlich sind und entfernen Sie sie von der Seite. Beachten Sie jedoch, dass die manuelle Durchführung erfordert, dass Sie in der Programmierung geübt sind.

Wenn Ihre Website in WordPress erstellt wurde, können Sie ein WordPress-Plugin verwenden, um solche Ressourcen zu verschieben. Wir empfehlen das Speed Optimizer Plugin, das dies mit einem einzigen Klick erledigen kann. Öffnen Sie Ihr WordPress-Dashboard, navigieren Sie zu Speed Optimizer> Frontend> JavaScript, und schalten Sie die Option Render-blockierendes JavaScript aufschieben ein.

Renderblocking-Skripte mit Speed Optimizer verschieben

Sobald Sie mit der Beseitigung der Render-Blocking-Ressourcen fertig sind, fahren Sie mit dem nächsten Schritt fort, der Verkleinerung von JavaScript.

Schritt 4. JavaScript minimieren

JavaScript zu minimieren ist der Prozess , unnötige Zeichen aus Ihren JavaScript-Dateien zu entfernen, wie Leerzeichen, Zeilenumbrüche und Kommentare. Als Ergebnis verkürzen Sie die Zeit, die es braucht, um diese Skripte herunterzuladen und auszuführen, und verbessern die Gesamtleistung Ihrer Website.

Es auf eigene Faust zu tun, wird einen erheblichen Teil Ihrer Zeit in Anspruch nehmen. Speed Optimizer wird sich jedoch als äußerst nützlich erweisen, wenn Sie ein WordPress-Benutzer sind. Wenn Sie es bereits installiert haben, gehen Sie zu Ihrem Dashboard und wählen Sie Speed Optimizer > Frontend > JavaScript. Schalten Sie die Option JavaScript-Dateien minifizieren ein, und das Plugin wird die JavaScript-Dateien automatisch verkleinern.

JavaScript-Dateien mit dem Speed Optimizer Plugin verkleinern

Nachdem Sie mit der Verkleinerung der JavaScript-Dateien fertig sind, fahren Sie mit der Verkleinerung des CSS-Codes fort.

Schritt 5. CSS minimieren

CSS (Cascading Style Sheets) wird für das Styling und Layout Ihrer Webseiten verwendet. Ähnlich wie JavaScript können CSS-Dateien auch Leerzeichen und unnötige Zeichen enthalten, wodurch sie größer als benötigt werden. Infolgedessen brauchen Browser mehr Zeit, um sie zu lesen, was sich auf die Ladegeschwindigkeit der Webseite auswirkt.

Indem Sie die CSS-Stylesheets verkleinern, komprimieren Sie den Code und verbessern die Leistung Ihrer Webseite. WordPress-Benutzer können das Plugin Speed Optimizer verwenden, um CSS mit einem einzigen Klick zu minimieren.

Melden Sie sich in Ihrem Dashboard an und navigieren Sie zu Speed Optimizer> Frontend> CSS. Aktivieren Sie die Option CSS-Dateien minifizieren, um alle CSS-Dateien Ihrer Website zu verkleinern.

CSS-Dateien mit dem Speed Optimizer Plugin minimieren

Abgesehen von der Verkleinerung des CSS-Codes möchten Sie vielleicht auch ungenutzten CSS-Code entfernen. Erfahren Sie, wie im nächsten Schritt.

Schritt 6. Ungenutztes CSS entfernen

Ungenutztes CSS bezieht sich auf die Stilregeln, die in Ihren CSS-Dateien enthalten sind, die nicht verwendet werden, um Ihre Webseiten zu gestalten oder anzuzeigen. Sie könnten Überreste von früheren Designs, Stilen oder WordPress-Themes sein, die auf Komponenten angewendet wurden, die nicht mehr auf Ihrer Website vorhanden sind.

Diese überflüssigen Stilregeln erzeugen unnötiges Aufblähen, was dazu führt, dass Ihre CSS-Dateien größer als nötig sind. Dies bedeutet mehr Daten für den Benutzer zum Herunterladen und mehr für den Browser zum Parsen, was zu langsameren Ladezeiten und einem niedrigeren Google PageSpeed Insights Score führt.

Das Entfernen dieses ungenutzten CSS ist entscheidend für die Optimierung der Leistung Ihrer Website. Sie können die DevTools von Google Chrome oder andere Online-Tools verwenden, um herauszufinden, welche CSS-Regeln nicht von Ihrer Website verwendet werden.

Sobald Sie ungenutztes CSS identifiziert haben, besteht der nächste Schritt darin, diese unnötigen Regeln zu entfernen. Wenn Sie sich nicht sicher sind, ob eine Regel in Zukunft verwendet werden könnte, isolieren Sie sie in einer separaten CSS-Datei, anstatt sie zu löschen.

Nachdem Sie Änderungen vorgenommen haben, testen Sie Ihre Website gründlich, um sicherzustellen, dass das Entfernen nicht verwendeter CSS die Funktionalität oder das Erscheinungsbild Ihrer Website nicht beeinträchtigt hat.

Nachdem Sie den Code Ihrer Website optimiert haben, sollten Sie auch die Implementierung von Geschwindigkeitsoptimierungstechniken in Betracht ziehen. Fahren Sie mit den nächsten Schritten fort.

Schritt 7. Aktivieren Sie die GZip-Komprimierung

Die GZip-Komprimierung ist eine wichtige Technik zur Leistungsoptimierung, die Ihren Google PageSpeed Insights Score erheblich verbessern kann.

Wenn ein Benutzer Ihre Website besucht, wird eine Anfrage an Ihren Server gestellt, um die erforderlichen Dateien zu liefern. Je größer diese Dateien sind, desto länger brauchen sie, um vom Server zum Browser zu gelangen. GZip komprimiert diese Dateien in eine ZIP-Datei, wodurch sie kleiner und damit schneller zu liefern sind. Der Browser des Besuchers lädt die Dateien herunter und dekomprimiert sie und verwendet sie, um die Website zu rendern.

Es gibt mehrere Möglichkeiten, die GZip-Komprimierung für Ihre Website zu aktivieren.

  • GZip auf Ihrem Server aktivieren – Dieser Vorgang hängt von Ihrem Server ab. Für Apache-Server können Sie die .htaccess-Datei verwenden, um die GZip-Komprimierung zu aktivieren. Für Nginx-Server müssen Sie die entsprechenden Anweisungen in Ihrer Nginx-Konfigurationsdatei hinzufügen.
    Wenn Ihre Website mit SiteGround gehostet wird, verwendet sie bereits die GZip-Komprimierung. SiteGround hat standardmäßig die GZip und Brotli Komprimierung auf allen Servern aktiviert.
  • Verwenden Sie ein Plugin – Mehrere Plugins können die GZip-Komprimierung aktivieren, wenn Ihre Website mit WordPress erstellt wurde.

Eine andere Möglichkeit, die Leistung Ihrer Website zu verbessern, ist die Aktivierung des Browser-Caching. Der nächste Schritt behandelt die gebräuchlichsten Methoden, also lesen Sie weiter.

Schritt 8. Browser-Caching aktivieren

Browser-Caching ist eine Technik, die die Ladezeiten Ihrer Website für wiederkehrende Besucher drastisch verkürzen kann , was zu einem verbesserten Google PageSpeed Insights Score führt.

Wenn ein Benutzer eine Webseite zum ersten Mal besucht, speichert der Browser viele Seitenelemente zwischen, einschließlich Stylesheets, JavaScript-Dateien, Bilder und das HTML-Dokument. Beim Caching werden diese Dateien lokal auf dem Gerät des Benutzers gespeichert. Wenn der Benutzer die Seite erneut besucht, muss der Browser nicht die gesamte Seite neu laden, sondern kann die meisten Dateien aus dem Cache abrufen, wodurch die Ladezeit erheblich verkürzt wird.

So können Sie Browser-Caching aktivieren:

  • Nutzen Sie Browser-Caching mit .htaccess – Wenn Ihre Website auf einem Apache-Server ist, können Sie Browser-Caching aktivieren, indem Sie Anweisungen zu Ihrer .htaccess-Datei hinzufügen. Sie müssen Caching-Anweisungen für verschiedene Dateitypen angeben, je nachdem, wie oft sie aktualisiert werden. Für detaillierte Anweisungen, lesen Sie diese Anleitung, wie Sie Browser-Caching für Bilder, CSS und JS nutzen können.
  • Cache-Control-Header verwenden – Der Cache-Control HTTP-Header enthält Anweisungen für das Caching in Anfragen und Antworten. Die Direktiven geben an, wer die Antwort unter welchen Bedingungen zwischenspeichern kann und für wie lange.
  • Verwenden Sie ein Caching-Plugin – Für WordPress können mehrere Plugins Browser-Caching mit ein paar Klicks aktivieren. Wir empfehlen Speed Optimizer, der verschiedene Caching- und Geschwindigkeitsverbesserungsoptionen bietet. Um das Browser-Caching zu aktivieren, gehen Sie zu Ihrem Dashboard, öffnen Speed Optimizer> Caching und schalten die Option Datei-basiertes Caching ein.
    Dateibasiertes Caching über das Speed Optimizer Plugin aktivieren

Abgesehen vom Browser-Caching sollten Sie auch die Caching-Fähigkeiten Ihres Servers nutzen. Gehen Sie zum nächsten Schritt für weitere Informationen.

Schritt 9. Server-Caching aktivieren

Server-Caching ist eine der effektivsten Techniken, um Ihren Google PageSpeed Insights Score zu steigern. Es speichert eine zwischengespeicherte Kopie Ihrer Website auf dem Server und liefert sie an den Endbenutzer. Dadurch entfällt die Notwendigkeit, dass der Server jedes Mal, wenn ein Besucher darauf landet, dieselbe Seite dynamisch erstellen muss, wodurch die Serverlast erheblich reduziert wird.

Als SiteGround-Benutzer können Sie die Geschwindigkeit Ihrer Website mit SuperCacher steigern, einer internen Lösung mit drei Caching-Schichten – statisch, dynamisch und Memcached. Finden Sie heraus, wie es in diesem SuperCacher – Tutorial funktioniert.

Die Verwendung eines Content Delivery Network (CDN) ist eine weitere Möglichkeit, die Geschwindigkeit Ihrer Website zu erhöhen. Lesen Sie den nächsten Schritt, um herauszufinden, wie Sie es implementieren.

Schritt 10. Verwenden Sie das Content Delivery Network (CDN)

Eine Möglichkeit, die Erfahrung für alle Benutzer auf der ganzen Welt konsistent zu machen, ist die Verwendung eines Content Delivery Network (CDN). Ein CDN erstellt Kopien Ihrer Website auf seinem Netzwerk von Servern, und Besucher werden die Website von der nächstgelegenen laden. Dies wird eine stabile Leistung und Ladezeit unabhängig vom Standort Ihrer Besucher sicherstellen.

SiteGround-Benutzer können vom SiteGround CDN als Teil ihres Hosting-Plans profitieren. Um mehr über den Dienst zu erfahren, lesen Sie diese Anleitung auf SiteGround CDN.

Als nächstes optimieren Sie Ihre Website-Bilder, um die Ladegeschwindigkeit zu verbessern. Folgen Sie den Anweisungen im nächsten Schritt.

Schritt 11. Optimieren Sie Ihre Bilder

Bilder machen oft einen signifikanten Prozentsatz der Gesamtgröße einer Webseite aus. Die effiziente Kodierung und Optimierung Ihrer Bilder kann zu erheblichen Verbesserungen der Ladezeiten und der gesamten Website-Performance führen. Dies wiederum kann sich positiv auf Ihren Google PageSpeed Insights Score auswirken.

Die Bildoptimierung beinhaltet die Auswahl des richtigen Formats, der richtigen Komprimierungsstufe und der richtigen Auflösung, während ein akzeptables Qualitätsniveau beibehalten wird. Hier sind einige Strategien, um Ihre Bilder effizient zu optimieren:

  • Wählen Sie das richtige Bildformat – Verschiedene Bilddateiformate haben unterschiedliche Stärken. JPEG ist eine gute Wahl für Fotos oder komplexe Bilder mit vielen Farben, während PNG am besten für Bilder ist, die Transparenz erfordern.
  • Verwenden Sie Bildformate der nächsten Generation – Neuere Formate, wie WebP, bieten eine überlegene Komprimierung und mehr Funktionen im Vergleich zu älteren Formaten. Bilder, die in diesen Formaten gespeichert sind, sind klein, während ihre Qualität erhalten bleibt.
    Wenn Ihr Hosting-Server WebP unterstützt, verwenden Sie Bilder in diesem Format, um die Geschwindigkeit und Leistung Ihrer Website zu verbessern. SiteGround hat WebP seit langem auf allen Servern implementiert.
    Wenn Ihre Website in WordPress erstellt ist, sollten Sie ein Plugin verwenden, um alle vorhandenen Bilder in Ihrer Medienbibliothek in WebP zu konvertieren. Speed Optimizer ist eines dieser Plugins. Darüber hinaus hat es einen Fallback-Mechanismus, der es Ihrer Website ermöglicht, die alten Bilddateien anstelle von WebP anzuzeigen, falls die Browser der Besucher nicht mit WebP kompatibel sind.
    Um die Bilder zu konvertieren, öffnen Sie Ihr Dashboard, navigieren Sie zu Speed Optimizer > Medien und schalten Sie WebP-Bilder verwenden ein.

    Konvertieren Sie vorhandene Bilder in WebP mit dem Speed Optimizer Plugin


  • Komprimierung anwenden – Je kleiner die Bilddateien sind, desto schneller lädt Ihre Website. Viele Bildbearbeitungswerkzeuge, Plugins und Online-Dienste bieten Optionen zum Komprimieren von Bildern, um ihre Dateigröße zu reduzieren. Achten Sie jedoch darauf, die Komprimierung mit der Bildqualität auszugleichen.
    Speed Optimizer kann sich in dieser Hinsicht auch als nützlich für WordPress-Benutzer erweisen. Es kann alle vorhandenen Bilder optimieren und bietet verschiedene Komprimierungseinstellungen. Von Ihrem Dashboard, navigieren Sie zu Speed Optimizer > Medien, und klicken Sie auf die Schaltfläche Bearbeiten neben Bildkomprimierung. Im folgenden Popup-Fenster können Sie die Einstellungen für die neu komprimierten Bilder auswählen.

    Komprimieren Sie Ihre Bilder mit dem Speed Optimizer Plugin
  • Auflösung optimieren – Stellen Sie sicher, dass Ihre Bilder nicht größer sind, als sie sein müssen. Das Bereitstellen eines Bildes mit einer höheren Auflösung als notwendig führt zu größeren Dateigrößen und langsameren Ladezeiten.
  • Responsive Bilder verwenden – Implementieren Sie responsive Bilder mit den HTML-Attributen srcset und sizes. Dies ermöglicht es Ihnen, die richtige Bildgröße basierend auf dem Gerät des Benutzers und der Größe des Ansichtsfensters bereitzustellen, wodurch unnötige Datenübertragungen reduziert werden.
  • Nutzen Sie Browser-Caching und ein CDN – Browser-Caching und Content Delivery Networks (CDNs) können auch dazu beitragen, die Ladezeiten von Bildern zu verbessern. Caching ermöglicht es wiederkehrenden Besuchern, Bilder lokal zu laden, anstatt sie erneut herunterzuladen, während ein CDN Bilder von dem Server bereitstellen kann, der dem Benutzer am nächsten ist.

Die Bildoptimierung ist entscheidend, aber Sie können die Leistung Ihrer Website weiter verbessern, indem Sie Offscreen-Bilder verschieben. Lesen Sie den folgenden Schritt, um zu erfahren, wie.

Schritt 12. Offscreen-Bilder verschieben

Wenn Sie eine Website öffnen, passt oft nicht die gesamte Seite auf den Bildschirm, und Sie müssen nach unten scrollen, um den gesamten Inhalt und die Bilder zu sehen. Diese nicht sichtbaren Bilder werden Offscreen-Bilder genannt. Browser laden sie herunter, bevor Sie nach unten scrollen, was die Seitenvisualisierung verlangsamt.

Um die Ladegeschwindigkeit zu verbessern, können Sie die Offscreen-Bilder verschieben. Eine sehr nützliche Lösung ist Lazy Loading. Durch die Verwendung werden Browser das Laden des „above the fold“-Inhalts priorisieren und die Offscreen-Bilder visualisieren, sobald sie in Sicht sind.

Speed Optimizer kann Ihnen wieder helfen, wenn Sie ein WordPress-Benutzer sind. Gehen Sie zu Speed Optimizer > Medien > Medien-Optimierung, und schalten Sie Lazy Load von Medien ein.

Verschieben Sie Offscreen-Bilder, indem Sie Lazy Load im Speed Optimizer Plugin aktivieren

Zweifellos dauert das Laden von Bildern länger, und wenn Sie sich um sie kümmern, verbessert sich die Leistung Ihrer Website drastisch. Aber es gibt noch andere Vermögenswerte, auf die Sie achten müssen. Das Laden von Webfonts kann sich auch auf die Benutzererfahrung auswirken. Der folgende Abschnitt befasst sich mit Maßnahmen zur Verbesserung dieses Aspekts.

Schritt 13. Stellen Sie sicher, dass der Text während des Ladens von Web-Schriftarten sichtbar bleibt

Benutzerdefinierte Webfonts sind im modernen Webdesign immer beliebter geworden. Webfonts können jedoch die Seitenleistung beeinträchtigen, insbesondere die wahrgenommene Ladegeschwindigkeit Ihres Textinhalts. Standardmäßig verstecken Browser Text, der eine Webschriftart verwendet, bis die Schriftart vollständig geladen ist, ein Verhalten, das als “Flash of Invisible Text” (FOIT) bekannt ist. Dies kann zu einer schlechten Benutzererfahrung führen, die sich auf Ihren Google PageSpeed Insights Score auswirkt.

Um eine nahtlose Benutzererfahrung zu bieten, stellen Sie sicher, dass der Text während des Ladens von Webfonts sichtbar bleibt. Auf diese Weise zeigt der Browser Text sofort in einer Fallback-Schriftart an und tauscht sie nach dem Laden mit der Webschriftart aus. Dieses Verhalten, bekannt als “Flash of Unstyled Text” (FOUT), ist im Allgemeinen ein benutzerfreundlicherer Ansatz.

So stellen Sie sicher, dass der Text während des Ladens von Webfonts sichtbar bleibt:

  • CSS-Eigenschaft font-display verwenden – Diese Eigenschaft steuert, wie eine Schriftart angezeigt wird, je nachdem, ob und wann sie heruntergeladen und einsatzbereit ist. Der Wert font-display: swap; stellt sicher, dass der Text während des Ladens von Webfonts sichtbar bleibt, indem eine Systemschrift verwendet wird, bis die benutzerdefinierte Schriftart fertig ist.
    Unten sehen Sie ein Beispiel für einen CSS-Code, der font-display: swap; Deskriptor enthält.

    @font-face {
      font-family: ExampleFont;
      src: url(/path/to/fonts/examplefont.woff) format('woff'),
           url(/path/to/fonts/examplefont.eot) format('eot');
      font-weight: 400;
      font-style: normal;
      font-display: swap;
    }
  • Schriftarten lokal hosten – Das Hosten von Schriftarten auf Ihrem Server anstelle eines Drittanbieter-Servers kann die Ladezeiten verkürzen.
  • Begrenzen Sie die Anzahl der Schriftfamilien – Während die Vielfalt der Schriftarten Ihr Design verbessern kann, verleihen sie Ihrer Seite zusätzliches Gewicht. Versuchen Sie, die Anzahl der Schriftfamilien, Schriftstärken und Stile, die Sie verwenden, auf die notwendigen zu beschränken.
  • Laden Sie wichtige Web-Schriftarten vorab herunter – Preloading bewirkt, dass der Browser die Webfonts beim Laden der Seite herunterlädt, bevor das gesamte CSS geparst wurde. WordPress-Websites können das Speed Optimizer-Plugin für das Vorladen von Webfonts verwenden.
    Um diese Funktion zu aktivieren, öffnen Sie Ihr Dashboard, gehen Sie zu Speed Optimizer > Frontend > General und aktivieren Sie Optimierung von Webfonts. Sie können auch auswählen, welche Webfonts aus der Schriftarten Vorladen Option vorgeladen werden sollen, wenn Sie mehrere verwalten.

    Laden Sie wichtige Webfonts mit dem Speed Optimizer Plugin vor

Bisher haben wir die allgemeinsten und kritischsten Maßnahmen behandelt. Sie können jedoch spezifischere Strategien implementieren, um Ihre Website weiter zu verbessern. Beginnen wir mit Anweisungen zum Verhindern übermäßiger Weiterleitungen.

Schritt 14. Vermeiden Sie übermäßige Weiterleitungen

Oft müssen Sie Umleitungen verwenden, wenn Sie Seiten verschieben oder löschen. Ihr Zweck ist es, Benutzer und Suchmaschinen zu einer anderen URL zu leiten als die, die sie ursprünglich angefordert haben. Übermäßige oder unnötige Weiterleitungen können jedoch zu langsameren Seitenladezeiten führen, was sich negativ auf die Benutzererfahrung und Ihren Google PageSpeed Insights Score auswirkt.

Jede Weiterleitung löst einen zusätzlichen HTTP-Anforderungs-Antwort-Zyklus aus, was die Gesamtzeit für das Laden einer Seite erhöht. Dies ist besonders problematisch für mobile Benutzer, die oft auf weniger zuverlässige Netzwerkverbindungen angewiesen sind.

So vermeiden Sie übermäßige Weiterleitungen und optimieren die Leistung Ihrer Website:

  • Umleitung Ketten minimieren – Eine Umleitungskette tritt auf, wenn es mehr als eine Umleitung zwischen der ursprünglichen URL und der endgültigen Zielseite gibt. Es ist wichtig, alle Links so zu aktualisieren, dass sie auf die endgültige Ziel-URL zeigen, um diese Ketten zu minimieren.
  • Verwenden Sie direkte Links – Wenn möglich, stellen Sie sicher, dass Sie direkte Links in Ihrer Navigation, Sitemap und Dokumentstruktur verwenden.
  • Überprüfen Sie regelmäßig Ihre Weiterleitungen – Es ist eine gute Praxis, Ihre Website regelmäßig auf unnötige Weiterleitungen zu überprüfen.
  • Verwenden Sie Umleitungen für mobile Websites mit Bedacht – Wenn Sie separate Desktop- und mobile Websites haben, stellen Sie sicher, dass Sie mobile Benutzer korrekt umleiten. Vermeiden Sie fehlerhafte Weiterleitungen, wie das Weiterleiten eines Benutzers auf eine irrelevante Seite oder die Verwendung einer Weiterleitung, wenn ein direkter Link angemessener wäre.

Nachdem Sie ausstehende Umleitung Probleme behoben haben, können Sie die Verkettung kritischer Anfragen untersuchen. Weitere Informationen finden Sie im nächsten Abschnitt.

Schritt 15. Vermeiden Sie das Verketten kritischer Anfragen

Verkettung tritt auf, wenn Ressourcen voneinander abhängig sind. Zum Beispiel erzeugt eine JavaScript- oder CSS-Datei, die in einer anderen Ressource (wie einem HTML-Dokument) angefordert wird, eine Kette. Der Browser muss warten, bis er die HTML-Antwort erhält, um die JavaScript- oder CSS-Anforderung zu erkennen, und dann erneut warten, um die JS- oder CSS-Antwort zu erhalten.

Je länger die Kette, desto länger dauert es, bis die Seite gerendert ist, was sich negativ auf Ihren Google PageSpeed Insights-Score auswirkt. Die Verwendung der folgenden Methoden kann Ihnen helfen, die Verkettung von Ressourcen zu minimieren.

  • Minimieren Sie die Anzahl der kritischen Ressourcen – Nur Ressourcen, die für das anfängliche Rendering der Seite absolut notwendig sind. Nicht-kritische JavaScript-Dateien oder CSS können asynchron oder verzögert geladen werden, bis nach dem ersten Rendern.
    Für WordPress können Sie Optimierungs-Plugins wie Speed Optimizer verwenden, die die Funktionen CSS-Dateien minifizieren, JavaScript-Dateien minifizieren und Render-blockierendes JavaScript aufschieben.
  • Optimieren Sie die Reihenfolge Ihrer Anfragen – Priorisieren Sie das Laden von sichtbaren Inhalten oder Inhalten, die über dem Fenster stehen. Dies kann sicherstellen, dass Ihre Benutzer so schnell wie möglich etwas auf dem Bildschirm sehen.
    Verwenden Sie Speed Optimizer und seine Lazy Load von Medien Option, wenn Ihre Website WordPress-basiert ist.
  • Schlüsselressourcen vorab laden – Sie können das Vorladen verwenden, um Schlüsselressourcen früher zu laden und die Länge der Anforderungskette zu reduzieren. Zum Beispiel können Sie Optimierung von Webfonts und Schriftarten Vorladen in Speed Optimizer für Ihre WordPress-Site verwenden.

Sie können die Ladegeschwindigkeit verbessern, indem Sie Schlüsselanforderungen vorab laden. Lesen Sie den folgenden Abschnitt, um zu erfahren, wie.

Schritt 16. Schlüsselressourcen vorab laden

Schlüsselanfragen sind kritische Anfragen, die die Seite mit Priorität in einer frühen Ladephase ausführt. Sie könnten alles sein – JavaScript-Dateien, CSS-Stile oder Webfonts. Das Anwenden von Preload auf Schlüsselanforderungen kann die Ladezeit Ihrer Seite erheblich verbessern.

Sie können das Vorladen von Schlüsselanforderungen mit ein paar Techniken implementieren:

  • Identifizieren Sie wichtige Ressourcen – Dies können kritische JavaScript- oder CSS-Dateien, wichtige Bilder oder Webfonts sein, die früh im Seitenladeprozess benötigt werden.
  • Verwenden Sie die Preload-Direktive – Fügen Sie ein Link-Tag in den Kopf Ihres HTML-Dokuments mit `rel=”preload”` und href auf die Ressource, die Sie vorab laden möchten. Zum Beispiel:
    <link rel="preload" href="/styles/important.css" as="style">

    Das as-Attribut ist notwendig, um den Typ des Inhalts anzugeben, der vorab geladen werden soll.

  • Webfonts vorladen – Webfonts werden oft erst spät im Ladeprozess entdeckt. Das Vorladen wichtiger Webfonts kann sie früher verfügbar machen, was die Wahrscheinlichkeit eines „Aufblitzens von unformatiertem Text“ verringert. Zum Beispiel:
    <link rel="preload" href="/fonts/myfont.woff2" as="font" type="font/woff2" crossorigin>

    Wenn Sie eine WordPress-Site verwalten, können Sie ein Plugin wie Speed Optimizer zum Vorladen von Webfonts verwenden.

  • Seien Sie selektiv – Zu viele Ressourcen im Voraus zu laden kann die Leistung beeinträchtigen, da es dazu führen kann, dass nicht kritische Ressourcen heruntergeladen werden, die mit wichtigeren Ressourcen konkurrieren. Seien Sie wählerisch, was Sie vorladen.
  • Verwenden Sie Preconnect oder Prefetch, wenn angemessen – Preconnect kann frühe Verbindungen mit wichtigen Drittparteien herstellen. Prefetch, auf der anderen Seite, kann helfen, Ressourcen zu laden, die bei der nächsten Navigation/Seitenladen verwendet werden.

Jetzt können wir uns auf die Optimierung der animierten Inhalte Ihrer Website konzentrieren. Der nächste Schritt beschreibt die vorteilhaftesten Methoden.

Schritt 17. Verwenden Sie Videoformate für animierte Inhalte

Animierte Inhalte sind eine ausgezeichnete Möglichkeit, Besucher zu engagieren und ihre Benutzererfahrung zu bereichern. Das Format, das Sie für Ihre Animationen wählen, kann sich jedoch erheblich auf die Ladegeschwindigkeit und die Gesamtleistung Ihrer Website auswirken.

Traditionell wurden Animationen oft als GIFs erstellt, aber GIFs können ziemlich groß sein, was zu langsamen Ladezeiten führt. Eine bessere Alternative ist die Verwendung von Videoformaten für animierte Inhalte. Videoformate wie MP4 oder WebM sind effizienter bei der Komprimierung und können eine höhere Qualität mit einer kleineren Dateigröße liefern.

Im Folgenden finden Sie einige Tipps für die Verwaltung animierter Inhalte.

  • GIFs in Videoformate konvertieren Tools wie FFmpeg oder Online-Konverter können Ihnen helfen, vorhandene GIFs in MP4- oder WebM-Formate zu konvertieren. Sie können dann das HTML5-Videoelement verwenden, um sie in Ihre Website einzubetten.
  • Verwenden Sie die richtigen Komprimierungseinstellungen – Wenn Sie ein Video erstellen, experimentieren Sie mit verschiedenen Qualitäts- und Komprimierungseinstellungen, um ein Gleichgewicht zwischen Dateigröße und visueller Qualität zu schaffen.
  • Autoplay und Loop – Sie können Ihre Videos wie GIFs verhalten, indem Sie die Autoplay- und Loop-Attribute im Video-Tag verwenden. Denken Sie daran, `muted` zu Autoplay-Videos inline hinzuzufügen, besonders auf mobilen Geräten.
  • Verwenden Sie eine Video-Hosting-Plattform – Erwägen Sie die Verwendung einer Video-Hosting-Plattform wie YouTube oder Vimeo. Dies kann die Last auf Ihrem Server reduzieren, eine gute Zuschauererfahrung auf verschiedenen Geräten und Internetverbindungen bieten und zusätzliche Funktionen wie Videoanalyse bieten.

Als nächstes wollen wir einige gesunde Wartungspraktiken für beliebte CMS-Anwendungen wie WordPress-Sites untersuchen.

Schritt 18. Reduzieren Sie die Verwendung von Code von Drittanbietern

Code von Drittanbietern sind Skripte, die auf anderen Websites gehostet werden, aber auf Ihrer Website geladen und ausgeführt werden. Dies können Skripte für Analysen, Werbung, Kundensupport, Schaltflächen zum Teilen in sozialen Medien und andere Funktionen sein. Sie bieten normalerweise nützliche Funktionen, können aber die Ladezeit und die Gesamtleistung Ihrer Website erheblich beeinträchtigen.

Jedes Skript von Drittanbietern erfordert eine zusätzliche HTTP-Anfrage, die die Ladezeit erhöht. Da diese Skripte auf externen Servern gehostet werden, haben Sie außerdem weniger Kontrolle über ihre Leistung.

Die folgenden Leitlinien können helfen, ihre Auswirkungen zu verringern:

  • Skripte von Drittanbietern überprüfen – Beginnen Sie damit, alle Skripte von Drittanbietern zu identifizieren, die auf Ihrer Website ausgeführt werden. Sie können die DevTools Registerkarte von Google Chrome verwenden, um dies zu tun. Bewerten Sie den Wert, den jedes Skript im Vergleich zu seinen Auswirkungen auf die Leistung bietet.
  • Begrenzen Sie die Anzahl der Skripte von Drittanbietern – Verwenden Sie nur die notwendigen Skripte von Drittanbietern. Jedes Skript, das Sie entfernen, verbessert die Ladezeit und die Gesamtleistung Ihrer Website.
  • Skripte asynchron laden – Das asynchrone Laden ermöglicht es dem Rest der Webseite, das Laden fortzusetzen, während das Skript heruntergeladen wird. Wenn Sie dies auf Skripte von Drittanbietern anwenden, können Sie verhindern, dass sie das Rendern der Seite blockieren.
  • Verwenden Sie Lazy Loading – Ziehen Sie in Betracht, Lazy Loading für Inhalte von Drittanbietern zu verwenden, die nicht sofort sichtbar sind (wie Widgets oder Einbettungen). Diese Technik verzögert das Laden von Ressourcen, bis sie benötigt werden, beispielsweise wenn ein Benutzer auf der Seite nach unten scrollt.
  • Skripte lokal hosten – Wenn der Drittanbieter es erlaubt, sollten Sie die Skripte lokal auf Ihrem eigenen Server hosten. Dies gibt Ihnen mehr Kontrolle über ihre Leistung und eliminiert eine zusätzliche DNS-Suche.

Ein weiteres Problem, das häufig auf WordPress-Websites auftritt, ist die Größe des Document Object Model (DOM). Erfahren Sie im nächsten Schritt, wie Sie damit umgehen können.

Schritt 19. Reduzieren Sie die Größe des Document Object Model (DOM)

Das Document Object Model (DOM) ist eine Darstellung Ihrer Webseite, die Browser verwenden, um die visuelle Schnittstelle zu bauen. Wenn eine Webseite ein komplexes oder großes DOM hat, bedeutet dies, dass es zahlreiche Elemente auf der Seite gibt, die der Browser verarbeiten und verwalten muss. Dies kann die Ladezeit Ihrer Seite verlangsamen, sich auf die Benutzerinteraktion auswirken und Ihren Google PageSpeed Insights Score senken.

Ein großes DOM kann daraus resultieren, dass tief verschachtelte Elemente oder einfach zu viele Elemente im Allgemeinen auf der Seite vorhanden sind. Eine hohe Anzahl von Elementen erfordert mehr Speicher und CPU-Ressourcen und verlangsamt das Seitenrendering.

Hier sind einige Strategien, um Ihre DOM-Größe zu reduzieren:

  • Seitenstruktur vereinfachen – Versuchen Sie, Ihre HTML-Struktur so weit wie möglich zu vereinfachen. Reduzieren Sie die Tiefe und Anzahl der untergeordneten Elemente und vermeiden Sie unnötige Eltern-Kind-Beziehungen.
  • Unnötige Elemente entfernen – Entfernen Sie Elemente, die nicht zur visuellen Oberfläche oder Funktionalität der Seite beitragen. Dies kann leere oder doppelte Elemente enthalten.
  • Brechen Sie große Seiten in kleinere auf – Eine große Seite mit viel Inhalt erzeugt unweigerlich ein großes DOM. Ziehen Sie in Erwägung, große Seiten in mehrere kleinere aufzuteilen.
  • Elemente auf der Seite begrenzen – Als allgemeine Regel, versuchen Sie, Ihre Webseite auf weniger als 1500 Elemente zu begrenzen. Bei Seiten mit mehr als dieser kann es oft zu Leistungsproblemen kommen.
  • Lazy Load Inhalt – Erwägen Sie Lazy Loading für Inhalte unterhalb der Falte. Dies kann die Verarbeitung unkritischer Teile Ihrer Seite verzögern und die anfängliche Größe des DOM verringern.
  • Verwenden Sie seriöse Themes – Sehr oft ist der Schuldige, der eine große DOM-Größe verursacht, ein WordPress-Theme, das viel Junk-Code enthält. Verwenden Sie bewährte Themen mit sauberem Code, um zu vermeiden, dass ein großes DOM generiert wird.

Schließlich stellen Sie sicher, dass Ihre Website die neuesten Technologien verwendet, die im Allgemeinen die Leistung und Sicherheit verbessern. Lesen Sie die letzten beiden Schritte für weitere Informationen.

Schritt 20. Implementieren Sie HTTP/2

HTTP/2, die neueste Version von HTTP, bietet Leistungsverbesserungen gegenüber seinem Vorgänger, wie Multiplexing und Header-Komprimierung. Die Implementierung von HTTP/2 kann die Punktzahl Ihrer Website erheblich verbessern.

Stellen Sie sicher, dass Ihr Webserver für die Verwendung dieses Protokolls konfiguriert ist, um eine bessere Ladezeit und Leistung zu gewährleisten. SiteGround-Server haben diese Funktion für eine lange Zeit integriert. Weitere Informationen finden Sie in diesem Handbuch über HTTP/2.

Schritt 21. Verwenden Sie die neuesten PHP-Technologien

Die meisten Websites, einschließlich populärer Content-Management-Systeme (CMS) wie WordPress, sind in PHP gebaut. PHP ist eine Programmiersprache, die ständig Updates und Überarbeitungen unterzieht, die Leistungs- und Sicherheitsverbesserungen beinhalten.

Verwenden Sie die neueste PHP-Version, um alle Leistungs- und Sicherheitsupdates zu nutzen, die Ihren PSI-Score erhöhen können. SiteGround unterstützt immer die neuesten Technologien und PHP ist da keine Ausnahme. Sie können Managed PHP aktivieren, das automatisch die neueste stabile PHP-Version setzt.

Darüber hinaus haben wir unser eigenes PHP-Server-Setup namens Ultrafast PHP entwickelt, das die Geschwindigkeit Ihrer Website um bis zu 30% erhöhen kann. Um mehr zu erfahren, lesen Sie diese Anleitung über Ultrafast PHP.

Abschluss

Google PageSpeed Insights ist ein unverzichtbares Werkzeug für jeden Website-Besitzer oder Entwickler, der die Website-Performance optimieren möchte. Durch die Bereitstellung wertvoller Metriken und umsetzbarer Empfehlungen hilft es, Verbesserungsbereiche zu identifizieren, die die Ladezeit, Benutzerfreundlichkeit und allgemeine Benutzererfahrung Ihrer Website erheblich verbessern können.

In diesem Artikel wurden mehrere Strategien vorgestellt, um Ihren PageSpeed Insights Score zu verbessern. Wir hoffen, dass Sie sie gut nutzen und die beste Version Ihrer Website machen werden.

Häufig gestellte Fragen zu Google PageSpeed Insights

Beeinflusst Google PageSpeed Insights mein Website SEO Ranking?

Nein, Google berücksichtigt den PageSpeed Insights Score nicht, wenn es das SEO-Ranking Ihrer Website formuliert. PSI misst jedoch Metriken wie Zugänglichkeit und Leistung, die den Suchmaschinenoptimierungs-Score formulieren.

Wie viel kostet Google PageSpeed Insights?

Google PageSpeed Insights ist ein absolut kostenloses Tool, und Google plant nicht, es zu einem Premium-Dienst zu machen.

Besitzt Google Google PageSpeed Insights?

Ja. Sowohl PageSpeed Insights als auch Lighthouse sind Tools, die von Google entwickelt wurden und von Google betrieben werden.

Warum gibt es einen Unterschied zwischen den Scores von PageSpeed Insights und Lighthouse?

Die Ergebnisse von PageSpeed Insights und Lighthouse verschieben sich aufgrund der unterschiedlichen Ansätze, die beide Tools zum Testen Ihrer Website verwenden. PageSpeed Insights basiert auf Echtzeitdaten, die von Benutzern gesammelt werden, die Ihre Website auf verschiedenen Netzwerken und Geräten besuchen. Lighthouse testet Ihre Website in einer kontrollierten Umgebung mit vorgegebenen Bedingungen – das gleiche Netzwerk und die gleichen simulierten Geräte.

Diesen Artikel teilen