Optimiere die Bilder für deinen Largest Contentful Paint (LCP) mit Jetpack Boost

Die Bildoptimierung für LCP identifiziert und optimiert automatisch die wichtigsten Bilder auf den Übersichtsseiten deiner Website. Diese Funktion analysiert deine Übersichtsseiten, identifiziert deren zentrale Bilder (falls vorhanden) und wendet technische Optimierungen an, damit sie für deine Besucher schneller geladen werden.

Die Bildoptimierung für LCP ist sowohl im kostenlosen als auch im kostenpflichtigen Jetpack Boost-Tarif verfügbar. Der kostenlose Tarif ermöglicht die Optimierung einer Übersichtsseite, während der Premium-Tarif bis zu zehn unterstützt.

Was ist der Largest Contentful Paint (LCP)?

Largest Contentful Paint (LCP) ist eine Metrik der Core Web Vitals, die misst, wie lange es dauert, bis das größte sichtbare Inhaltselement – etwa ein großes Bild oder eine Überschrift – im Browser eines Besuchers vollständig geladen ist.

Ein schneller LCP vermittelt den Eindruck, dass deine Website schnell und reaktionsfähig ist. Ein langsamer LCP kann deine Website für Nutzer langsam wirken lassen, selbst wenn andere Elemente schnell geladen werden.

Warum der LCP für deine Website wichtig ist

Rendern des größten Inhaltselements (LCP) ist ein Messwert der Core Web Vitals, der misst, wie lange das größte sichtbare Inhaltselement auf deiner Website zum Laden benötigt.

  • Besucher beurteilen die Geschwindigkeit einer Website danach, wie schnell der Hauptinhalt erscheint – nicht danach, wann die gesamte Seite vollständig geladen ist.
  • Ein langsamer LCP lässt deine Website träge wirken, selbst wenn andere Elemente schnell geladen werden.
  • Ein schneller LCP lässt deine Website professionell und reaktionsfähig wirken.

Suchmaschinenoptimierung

  • Da LCP ein Core Web Vital ist, Google verwendet LCP als Rankingfaktor in den Suchergebnissen.
  • Websites mit guten Werten für LCP (unter 2,5 Sekunden) werden höher eingestuft als langsamere Wettbewerber.
  • Schlechte Werte für LCP können deine Sichtbarkeit in der organischen Suche beeinträchtigen.

Was macht den LCP langsam?

Häufige Ursachen für eine schlechte Leistung von LCP sind:

  • Große, nicht optimierte Bilder.
  • Bilder ohne geeignete Priorisierung beim Laden.
  • Fehlende Techniken für responsive Bilder.
  • Langsame Antwortzeiten des Servers.
  • Ressourcen, die das Rendern blockieren.

Was ist die Bildoptimierung für LCP?

Die Bildoptimierung für LCP ist eine Funktion von Jetpack Boost, die die wichtigsten visuellen Elemente auf deinen zentralen Seiten identifiziert und Leistungsoptimierungen anwendet, damit sie schneller geladen werden.

Sie konzentriert sich auf das größte Bild oder Hintergrundbild, das beim Laden einer Seite im Browserfenster sichtbar ist – das sogenannte Element LCP. Die Optimierung dieses Elements kann deine Core Web Vitals-Werte deutlich verbessern.

So funktioniert die Bildoptimierung für LCP

Automatische Seitenanalyse

Die Funktion untersucht deine Übersichtsseiten und identifiziert:

  • Das größte visuelle Element, das im Ansichtsbereich erscheint.
  • Ob es sich um ein normales Bild oder ein Hintergrundbild handelt.
  • Die optimale Ladereihenfolge für jeden Gerätetyp (Mobilgerät/Desktop).

Angewandte technische Optimierungen

Für Bildelemente:

  • Optimiert das Bild für LCP mithilfe des Site Accelerator von Jetpack.
  • Setzt fetchpriority="high" für eine priorisierte Ladereihenfolge.
  • Wendet loading="eager" an, um Verzögerungen durch verzögertes Laden zu verhindern.
  • Erzeugt responsive Bilder mit srcset und sizes Attributen.
  • Unterstützt Displays mit hoher Pixeldichte.

Für Hintergrundbildelemente:

  • Optimiert das Hintergrundbild für LCP mithilfe des Site Accelerator von Jetpack.
  • Fügt Preload-Links im Head des Dokuments hinzu.
  • Implementiert responsive Hintergrundbilder mithilfe von CSS image-set().
  • Wendet gerätespezifische Media Queries an.
  • Verwendet Überschreibungen für CSS, um ein optimales Laden sicherzustellen.

Status verstehen

Analyse ausstehend

Jetpack Boost analysiert derzeit deine Seiten auf Mobilgeräten und Desktops. Dieser Vorgang dauert normalerweise einige Minuten:

  • Analyse abgeschlossen: Jetpack Boost hat die Elemente von LCP identifiziert, und die Optimierungen sind für alle erfolgreich analysierten Seiten und Gerätetypen aktiv.
  • Teilweise abgeschlossen: Jetpack Boost hat die Analyse abgeschlossen, konnte das Element LCP jedoch auf einer oder mehreren Seiten oder für einen oder mehrere Gerätetypen nicht identifizieren oder optimieren. Dies kann unabhängig voneinander auf Mobilgeräten oder Desktops geschehen. Die Optimierungen bleiben überall dort aktiv, wo die Analyse erfolgreich war.

Überprüfe die betroffenen Seiten, um weitere Informationen zu erhalten. Wenn eine Seite weiterhin fehlschlägt, findest du unter Fehlerbehebung bei der Bildoptimierung für LCP weitere Informationen.

Analyse abgeschlossen

Deine Elemente von LCP wurden identifiziert und die Optimierungen sind jetzt aktiv. In Testtools solltest du Leistungsverbesserungen feststellen.

Fehlerbehebung bei häufigen Problemen

Wenn Jetpack Boost einige deiner Seiten nicht optimieren konnte, kann dies an Problemen wie fehlender Seitenzugänglichkeit, langsamem Laden oder einer komplexen Struktur liegen.

Eine vollständige Liste bekannter Probleme und Lösungen findest du hier: Fehlerbehebung bei der Bildoptimierung für LCP in Jetpack Boost.

Brauchst du noch Hilfe?

Bitte wende dich an den Support. Wir beraten dich gerne.