# Welche Thumbnailgrößen sollte man erstellen lassen?

**URL:** https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978
**Category:** Shopware 6 (German)
**Created:** [27. August 2024 um 07:24 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978 "2024-08-27T07:24:33Z")
**Posts on this page:** 9
**Page:** 1

<div class="post-metadata">

### Author: ![UX4U](https://avatars.discourse-cdn.com/v4/letter/u/5daacb/32.png) [@UX4U](https://forum.shopware.com/u/UX4U)
#### Post date: [27. August 2024 um 07:24 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978/1 "2024-08-27T07:24:34Z")

</div>

Shopware zeigt mit dem Standardtheme bei rechteckigen Bildern folgende Thumbnails:

- 200 x 200 Pixel große Bilder auf Kategorieseiten
- 430 x 430 Pixel große Bilder auf Produktdetailsseiten
- 55,1667 x 55,1667 Pixel große Bilder auf Produktdetailsseiten, wenn mehrere Bilder angelegt sind

Also sollte man Thumbnails in 200 x 200, 430 x 430 und 56 x 56 Pixel große Bilder als Thumbnails anlegen, oder?

Und zusätzlich die kostenlose Erweiterung [LazySizes und LazyLoading für passende Bilder-Sizes | Shopware Store](https://store.shopware.com/de/frosh56163799233f/lazysizes-und-lazyloading-fuer-passende-bilder-sizes.html) installieren, damit Shopware die richtigen Thumbnailgrößen ausliefert?

Wenn man beide Sachen nicht macht, liefert Shopware viel zu große Bilder aus und sorgt so für schlechte Ladezeiten.

Welche Thumbnailgrößen sollte man in Shopware haben?

---

<div class="post-metadata">

### Author: ![raymond-de](https://avatars.discourse-cdn.com/v4/letter/r/7feea3/32.png) [@raymond-de](https://forum.shopware.com/u/raymond-de)
#### Post date: [27. August 2024 um 18:31 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978/2 "2024-08-27T18:31:09Z")

</div>

Thumbnails werden generiert:

> **[Shopware 6 - Inhalte - Medien](https://docs.shopware.com/de/shopware-6-de/Inhalte/medien)**
>
> Dieser Bereich bietet Dir die Möglichkeit, die im Shop verwendeten Medien zu verwalten. Du kannst u. A. neue Medien hinzufügen, sowie Meta-Daten pflegen. Außerdem kannst Du Einstellungen für die Generierung von Thumbnails vornehmen.

Hier würde ich gar nichts ändern. Wir speichern die Originalbilder in 1200x1200 Pixel in WebP (umgewandelt direkt auf dem Webserver) ab. Gibt keine Performanceprobleme bei uns. Keine Erweiterungen für LazyLoading oder ähnliches ist installiert.

Nenne mal deine Webseite. Vielleicht ist der Webserver auch zu langsam oder am Theme wurde rumgeschraubt diesbezüglich? Wie groß (mb, kb) sind denn die Originalbilder und die Thumbnails bei dir?

---

<div class="post-metadata">

### Author: ![UX4U](https://avatars.discourse-cdn.com/v4/letter/u/5daacb/32.png) [@UX4U](https://forum.shopware.com/u/UX4U)
#### Post date: [28. August 2024 um 10:57 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978/3 "2024-08-28T10:57:04Z")

</div>

1200 x 1200 Pixel ist relativ klein für Originalbilder. Die Besucher wollen oft Details genau sehen.

Im Standard lädt Shopware für die Thumbnails größere Bilder, als es anzeigt.

Das erhöht die Ladezeit. Das kannst du leicht mit [https://www.webpagetest.org/](https://www.webpagetest.org/), [https://pagespeed.web.dev/](https://pagespeed.web.dev/) und den Entwicklertools in Browsern sehen.

Die Erweiterung [LazySizes und LazyLoading für passende Bilder-Sizes | Shopware Store](https://store.shopware.com/de/frosh56163799233f/lazysizes-und-lazyloading-fuer-passende-bilder-sizes.html) sorgt dafür, dass die besser passenden Thumbnails ausgeliefert werden.

Damit es noch besser passt, muss man auch Thumbnails erstellen, die zur angegebenen Bildgröße passen.

---

<div class="post-metadata">

### Author: ![PromoID](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/promoid/32/14015_2.png) [@PromoID](https://forum.shopware.com/u/PromoID)
#### Post date: [28. August 2024 um 12:54 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978/4 "2024-08-28T12:54:55Z")

</div>

Wir haben uns am Ende für 3 Formate entschieden - bis 1600px, bis 800px und bis 400px.  
Die Proportionen sollten natürlich eurem Theme und euren Einstellungen angepasst sein.

200, 56 usw. erachte ich für unnötig. Wir reden hier über einige wenige KB unterschied wenn man die Bilder richtig komprimiert. Da macht es nicht viel aus wenn der 56er die 200er Bilder nimmt.

Achtung: Alle Thumbnails natürlich neu generieren sobald man die Einstellungen in den Medien vorgenommen hat.

---

<div class="post-metadata">

### Author: ![UX4U](https://avatars.discourse-cdn.com/v4/letter/u/5daacb/32.png) [@UX4U](https://forum.shopware.com/u/UX4U)
#### Post date: [28. August 2024 um 14:55 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978/5 "2024-08-28T14:55:29Z")

</div>

Wenn die kleinsten Thumbnails 400 x 400 Pixel haben, nimmt Shopware für die 55,1667 x 55,1667 und 200 x 200 Pixel großen Thumbnails die Thumbnails mit 400 x 400 Pixel.

Das ist Blödsinn, weil es die Ladezeit stark erhöht und den Server stärker belastet.

Teste mal in einem Testshop die Erweiterung und die kleineren Thumbnails und überprüf die Werte mit den oben genannten Werkzeugen.

---

<div class="post-metadata">

### Author: ![raymond-de](https://avatars.discourse-cdn.com/v4/letter/r/7feea3/32.png) [@raymond-de](https://forum.shopware.com/u/raymond-de)
#### Post date: [28. August 2024 um 18:55 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978/6 "2024-08-28T18:55:43Z")

</div>

Im Listing stellen wir die Thumbnails in 330 x 208 Pixel, in der PDS in 596 x 596 Pixel und in der Vollansicht in 642 x 642 Pixel dar. Also 1200 x 1200 Pixel sind bei uns mehr als ausreichend. Wenn wir Details von einem Bild dargestellen wollen, erstellen wir mehrere Bilder und machen Detailaufnahmen von der Stelle des Produkts, was interessant ist.

Bis Ende letztes Jahres haben wir diese sogar nur in 1000 x 1000 Pixel hochgeladen.

Bei uns:  
Pagespeed Mobil Leistung: 61  
Pagespeed Desktop Leistung: 88

---

<div class="post-metadata">

### Author: ![UX4U](https://avatars.discourse-cdn.com/v4/letter/u/5daacb/32.png) [@UX4U](https://forum.shopware.com/u/UX4U)
#### Post date: [29. August 2024 um 11:05 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978/7 "2024-08-29T11:05:30Z")

</div>

@raymond-de welches Theme verwendest du? Das sind nicht die Werte vom Standardtheme.

Hast du die Erweiterung und genau solche Thumbnailgrößen getestet?

Bei diesen Werten ist, vor allem bei Mobilgeräten, eine erkennbare Beschleunigung der Ladegeschwindigkeit möglich.

---

<div class="post-metadata">

### Author: ![PromoID](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/promoid/32/14015_2.png) [@PromoID](https://forum.shopware.com/u/PromoID)
#### Post date: [30. August 2024 um 17:55 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978/8 "2024-08-30T17:55:47Z")

</div>

Mal rein aus Interesse: nutzt ihr Tools zum komprimieren der Bilder bevor ihr die bei Shopware hochlädt? Welche Tools?

---

<div class="post-metadata">

### Author: ![raymond-de](https://avatars.discourse-cdn.com/v4/letter/r/7feea3/32.png) [@raymond-de](https://forum.shopware.com/u/raymond-de)
#### Post date: [9. September 2024 um 10:06 UTC](https://forum.shopware.com/t/welche-thumbnailgroessen-sollte-man-erstellen-lassen/104978/9 "2024-09-09T10:06:13Z")

</div>

Wir nutzen unter linux cwebp zum Umwandeln von jpg in webp. Zukünftig convert zum Umwandeln von jpg in avif.
