Seitenreport Seitenreport
Medien in WooCommerce

Zu große Bilddateien in WooCommerce beheben

Bildgewicht, Ausgabegröße und Bildmotiv gemeinsam prüfen. In WooCommerce prüfen Sie dafür Produktgalerie, Variantenbilder und Vorschaubilder.

Produktgalerie, Variantenbilder und Vorschaubilder

Prüfen Sie Produktlistenbild, Galerie und Zoom getrennt. Die Zoom-Datei muss nicht schon in voller Größe für jede Kategorie-Kachel geladen werden.

Vergleichen Sie Produkt-Hauptbild, Galerie und das Bild der ausgewählten Variante. In Block-Themes bestimmt die Galerie-Komponente ihre Darstellung; klassische Customizer-Einstellungen gelten nicht automatisch für jeden Galerieblock.

Wo Sie die Einstellung in WooCommerce prüfen

Öffnen Sie Produktbild, Galerie und das Bild der betroffenen Variante. Kontrollieren Sie die konkrete Bildreferenz und ihre Mediathek-Angaben. Beim Variantenwechsel muss auch die neue Bildausgabe eine passende Alternative und einen reservierten Darstellungsraum besitzen.

Beispiel für diesen konkreten Befund

Illustrativer Kontrollfall: Eine Produktkachel mit 360 CSS-Pixeln Breite lädt das 4.000 Pixel breite Original. Entscheidend ist die im Netzwerkprotokoll geladene Variante, nicht der Dateiname im CMS.

Nachprüfung in WooCommerce

Galerie-Wechsel und Variantenauswahl mobil testen. Tatsächlich geladene Größe, Alternativtext und reservierte Fläche für jede Ansicht prüfen.

Bei mehreren Bildschirmbreiten die gewählte Bild-URL, Dateigröße und Schärfe prüfen. Auf hochauflösenden Displays kann eine höhere natürliche Auflösung sinnvoll sein.

Ausnahmen und Geltungsbereich

Eine Detailansicht mit Zoom darf größere Dateien benötigen als eine Vorschauliste. Qualität und Übertragungsaufwand am tatsächlichen Einsatz abwägen.

Bezug: WooCommerce auf WordPress. Block- und klassische Produkt-Templates sowie SEO-Erweiterungen können unterschiedliche Ausgabestellen besitzen.

Den allgemeinen Fehler einordnen

Definition, systemunabhängige Ursachen und weitere Korrekturbeispiele: Bildgewicht, Ausgabegröße und Bildmotiv gemeinsam prüfen

Dokumentation zur Konfiguration und zum Prüfsignal

WooCommerce: Produktbilder und Galerien

W3C: Aufgabe und Alternative eines Bildes

web.dev: Bildausgabe optimieren

Verwandte Medien-Fehler in WooCommerce