Beim optimieren meines Shops stoße ich auf diese "Hürden". 1. Ich nutze auf der Startseite einen Produktsilder. Dieser verursacht leider schlechte CLS Werte, weil die Bilder kein "width" und "height" besitzen. 2. Für die mobile Ansicht bräuchten die Bilder "lazy loading". 3. Bilder als webp in den Shop hochladen. Hierüber habe ich hier im Forum gelesen, dass dies ab der Version 4.9. möglich sein soll. Ist dieses Ziel noch realistisch? Welche Möglichkeiten habe ich den Produktslider zu optimieren? Den Bildern kann ich kein "width" und "height" ohne px geben. Da komme ich einfach nicht ran. Mit der ID des Bildes habe ich versucht das aspect-ratio im CSS anzugeben. Leider ohne Erfolg. So sah mein Code aus: Code: #productlist7v2u0m0of-189_img img { aspect-ratio: 263 / 350; } Ich freue mich über Tipps von Euch.
Ich weiß nicht, ob das so funktioniert und immer noch nicht wirklich, was dieses aspect-ratio ist aber erfahrungsgemäß musste ich bisher immer "img" in den Pfad eingeben, wenn sich ein CSS Code auf das Bild bezog. Ich habe bei meinen Bildern in den Slidern z.B. Box-Shadow eingesetzt da habe ich das dann so gemacht: Code: .product-image img Also Class oder ID und dann das img nicht vergessen. z.B. so: Code: #productlist7v2u0m0of-189_img img { aspect-ratio: 263 / 350; } EDIT: Scheint tatsächlich zu funktionieren. Habs gerade mal bei einem Bild im Slider im eigenen Shop getestet.
Die Ladezeitoptimierung von Werbe-Markt.de könnte deine Probleme lösen, wir sind damit sehr sehr zufrieden.
@O.C. oh sorry, ja das "img" hatte ich schon mit dabei. (nur vergessen hier im Code zu schreiben) Aber eine Auswirkung habe ich damit beim CLS Wert leider nicht. @v-pixel im Cloudshop gehen externe Module nicht. Es muss doch auch Cloudshops geben, die solche Dinge anpassen möchten.