Bildgröße und Bildformat

In den Einstellungen des Banners kann eine Bilddatei für den Hintergrund hochgeladen werden. Die angezeigte Hintergrundgröße und Positionierung können dabei über die Konfigurationen "Hintergrund Größe" und Hintergrund Position" eingestellt werden. Wie auch bei den Einkaufswelten von Shopware gibt es kein Allgemein-Rezept für die Bildgröße des Banners, da hier viele Faktoren wie etwa das Format des Banners, die Größeneinstellung und Positionierung des Bildes eine Rolle spielen.

Hintergrund Größe - diese Eigenschaft definiert die Abmessungen eines Hintergrundbildes.

auto - Das auto Schlüsselwort skaliert das Hintergrundbild so in die entsprechende Richtung, dass das ursprüngliche Seitenverhältnis beibehalten wird.

cover - Das cover Schlüsselwort behält das Seitenverhältnis des Hintergrundbildes bei und skaliert es so, dass es so klein wie möglich ist, aber den Hintergrund-Positionierungsbereichs vollständig abdeckt. contain - Das contain Schlüsselwort behält das Seitenverhältnis des Hintergrundbildes bei und skaliert es so, dass es so groß wie möglich ist, aber vollständig im Hintergrund-Positionierungsbereichs enthalten ist.

Hintergrund Position - diese Eigenschaft bestimmt die Position des Hintergrundbildes im Bereich des Banners.

In den meisten Fällen sollen die Hintergrundbilder füllend dargestellt, sodass diese den kompletten Banner Bereich ausfüllen. Hier greift die Eigenschaft für die Hintergrund Größe cover. Für diesen Fall sind Bildgrößen ratsam, welche prinzipiell die komplette Browserbreite füllen können. Eine gängige Größe ergibt sich aus der Auflösung vieler heutiger Monitore, sodass die Breite der HD-Aulösung als Richtwert verwendet werden kann.

1920 Pixel in der Breite ist hier eine gute Basis.

Die Höhe wiederum ist abhängig vom Motiv, sollte jedoch nicht niedriger als die Höhe des Banners gewählt werden. Insbesondere die kleinen mobilen Geräte wie Smartphones stellen den Banner nicht mehr horizontal, sondern eher quadratisch oder sogar hochkant dar, sodass das Bildformat diese Anforderung erfüllen sollte.

Last updated