PageSpeed Insights: den Bericht deuten und eine Website verbessern

PageSpeed Insights hilft, Probleme beim Laden und bei der Interaktion einer URL zu erkennen. Nutzen Sie es, um zu entscheiden, was Sie verbessern, und um Ergebnisse zu prüfen, ohne 100/100 über die Funktion der Website zu stellen.

Labor und echte Nutzer unterscheiden

Der Bericht kombiniert einen Labortest mit Lighthouse und, wenn genügend Stichproben vorliegen, echte Daten aus dem Chrome UX Report. Prüfen Sie, ob sich die echten Daten auf die URL oder auf den gesamten Ursprung beziehen: Sie sind nicht austauschbar.

Der Labortest bildet bestimmte Bedingungen bei Gerät, Netz und Ausführung ab. Die echten Daten fassen die letzten 28 Tage zusammen. Eine heute umgesetzte Änderung kann einen neuen Test verbessern, ohne den Verlauf sofort zu ändern. Die Erklärung von Google zu PageSpeed Insights beschreibt diesen Unterschied genauer.

Core Web Vitals

Die Schwellen werden am 75. Perzentil der verfügbaren Erlebnisse gemessen. FCP, Speed Index und TBT helfen bei der Diagnose, gehören aber nicht zu den drei Core Web Vitals. Zur Deutung siehe die Referenz zu Web Vitals.

Eine gute Laborbewertung garantiert nicht alle echten Erlebnisse, und eine SEO-Bewertung bestätigt weder Indexierung noch Rankings oder Verkäufe.

Ein Praxisbeispiel in WordPress vorbereiten

Wählen Sie drei typische Seiten, zum Beispiel Startseite, Kategorie und Produkt. Speichern Sie die Berichte für Mobilgeräte und Desktop, notieren Sie Datum und Konfiguration und wiederholen Sie die Messungen, um ihre normale Schwankung zu erkennen.

Legen Sie ein wiederherstellbares Backup an und verwenden Sie für Änderungen an Theme, Plugins oder Datenbank eine Testkopie. Arbeiten Sie mit LiteSpeed Cache, prüfen Sie zuerst, ob der Seiten-Cache funktioniert. Dafür müssen Sie kein CDN anbinden.

Wenn der Hauptinhalt lange braucht

Finden Sie das LCP-Element im Bericht. Ist es ein Bild, prüfen Sie Dateigröße, Abmessungen und den Zeitpunkt des Downloads. Wenden Sie kein Lazy Loading auf das Hauptbild an, das beim Öffnen der Seite sichtbar ist.

Liefern Sie bei großen Bildern Varianten aus, die zum angezeigten Platz und zur Pixeldichte passen, gegebenenfalls mit srcset und sizes. Breiten- und Höhenattribute helfen, Platz zu reservieren, verkleinern aber nicht die heruntergeladene Datei.

Kommt das HTML-Dokument spät an, prüfen Sie Seiten-Cache, Netz, Ressourcen des Hostings und PHP-Ausführung. Ein Bild zu verkleinern löst keine langsame SQL-Abfrage: Finden Sie aufwendige Serverarbeit mit PHP X-Ray.

Wenn CSS oder JavaScript das Laden blockieren

Testen Sie in LiteSpeed Cache die Minimierung unter Seitenoptimierung (Page Optimization). Dateien zusammenfassen, JavaScript verzögern und CSS asynchron laden sind verschiedene Optionen: Aktivieren Sie sie einzeln und prüfen Sie ihre Wirkung.

Prüfen Sie Menüs, Formulare, Filter, Einwilligung und Bezahlung. Eine Ressource, die beim ersten Laden scheinbar ungenutzt ist, kann beim Öffnen eines Menüs oder bei einer Interaktion nötig sein. Entfernen Sie nicht automatisch alles, was eine Coverage-Aufnahme als nicht ausgeführt markiert.

Ist Code von Drittanbietern das Problem, klären Sie, welche Funktion er erfüllt und was er kostet. Kopieren Sie keine externen Skripte ins Hosting, ohne Updates, Kompatibilität und Bedingungen des Anbieters zu prüfen.

Wenn sich das Layout verschiebt

Reservieren Sie Abmessungen oder Seitenverhältnis für Bilder, Anzeigen und eingebettete Inhalte. Prüfen Sie auch Schriften und Blöcke, die nach dem Laden erscheinen. Testen Sie mehrere Bildschirmbreiten sowie den Zustand vor und nach der Einwilligung.

Die Option, fehlende Größenangaben zu ergänzen, kann helfen, Platz zu reservieren, behebt aber allein nicht alle Verschiebungen und verringert nicht die Dateigröße der Bilder.

Wenn Ressourcen wiederholt heruntergeladen werden

Prüfen Sie die Browser-Cache-Header. Dateien mit versioniertem Namen können eine lange Gültigkeit haben, weil eine Änderung eine neue URL erzeugt. Ändert sich eine Datei bei gleichem Namen, brauchen Sie eine Regel, die eine Aktualisierung erlaubt, ohne Besuchern alte Versionen zu liefern.

Geben Sie personalisiertem HTML keine pauschal lange Gültigkeit. Die Header von Dateien, die Dritte ausliefern, hängen von diesen ab; entscheiden Sie, ob Sie die Ressource brauchen, bevor Sie versuchen, ihr Verhalten zu ändern.

Bilder und Komprimierung optimieren

Das Hosting komprimiert kompatible Textinhalte automatisch mit Gzip oder Brotli. Prüfen Sie Content-Encoding, bevor Sie Komprimierung in PHP hinzufügen.

Bei Bildern behalten Sie die Originale und testen eine Stichprobe. LiteSpeed kann Online-Dienste von QUIC.cloud für Optimierung und moderne Formate nutzen: Prüfen Sie Verbindung, Kontingent, Modus und Status der Aufgaben. Die Anleitung zu QUIC.cloud erklärt die aktuelle Verbindung, die sich von den alten Domain-Schlüsseln unterscheidet.

Prüfen, ob die Verbesserung echt ist

Ändern Sie eine Sache, leeren Sie nur die nötigen Caches und wiederholen Sie dieselben Tests. Vergleichen Sie die betroffene Metrik und die Funktion, nicht nur die Farbe im Bericht. Eine Kategorie mit zu vielen Produkten braucht vielleicht Seitenumbrüche und weniger Elemente statt weiterer Plugin-Einstellungen.

Beobachten Sie nach dem Deployment die echten Erlebnisse über ihren Aktualisierungszeitraum. Führen Sie ein Änderungsprotokoll und nehmen Sie Änderungen zurück, die eine Punktzahl verbessern, aber Funktionen beschädigen. Weiter geht es mit der vollständigen Anleitung zur WordPress-Optimierung.