Theme-Bildausgabe und Produktmedien
Kontrollieren Sie die vom Theme angeforderten Bildbreiten. Ein kleines Kartenlayout sollte nicht dieselbe große Ressource wie eine Detailansicht laden.
Prüfen Sie die im Theme erzeugten Bild-URLs, Größen und Alternativtexte für Produktmedien. Das gleiche Original kann in einer kleinen Produktkarte und einer großen Galerie mit unterschiedlichen Anforderungen verwendet werden.
Wo Sie die Einstellung in Shopify prüfen
Prüfen Sie die Bildausgabe der betroffenen Section und ihre Verwendung von image_url und image_tag. Vergleichen Sie angeforderte Breite, responsive Quellen und Alt-Text mit dem Produktmedium. Die größte Originaldatei muss nicht an jede Bildschirmgröße ausgeliefert werden.
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 Shopify
Die tatsächlich geladene Variante im mobilen Netzwerkprotokoll kontrollieren. Das erste sichtbare Produktbild nicht pauschal hinter Lazy Loading verschieben.
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: Shopify Online Store mit Liquid-Theme. Für Hydrogen oder andere Headless-Storefronts gelten eigene Rendering- und Hostingzuständigkeiten.
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
Shopify: image_tag und Bildattribute