Darstellung und Verhalten

Varianten

Bildergalerie

• Initial werden maximal fünf Bilder verkleinert dargestellt.
• Das erste Bild ist grösser dargestellt (Format 4:3).
• Die Bilder sind falls nötig zugeschnitten (Format 3:2).
• Sind mehr als fünf Bilder vorhanden, wird ein Button angezeigt, mit dem die restlichen Bilder eingeblendet werden können.
• Die Galerie hat immer einen H2-Titel.

Bildslider 

• Initial wird das erste Bild des Bildslider dargestellt.
• Der Bildslider hat eine fixe Höhe und ist maximal so breit wie die Inhaltsspalte. Die Bilder werden entsprechend skaliert.
• Unterhalb des Bildes wird die Anzahl der Bilder (inkl. aktueller Bildnummer) angezeigt.
• Auf der rechten Seite werden die Vor- und Zurück-Pfeile angezeigt, mit denen Nutzende durch die Bilder blättern können.
• Der Bildslider kann optional einen Titel haben (H2-H4).

Für beide Varianten gilt

• Es kann zu jedem Bild eine Bildlegende und Quelle angezeigt werden.
• Jedes Bild kann als Download angeboten werden. Dieser wird mittels Download-Icon angezeigt.
  • In der Variante «Bildergalerie» ist das Download-Icon in der kleinen Darstellung und in der Vollbildansicht sichtbar.
  • In der Variante «Bildslider» ist das Download-Icon nur in der Vollbildansicht sichtbar.
• Bei Klick auf ein Bild wird eine Vollbildansicht geöffnet. Diese füllt den Bildschirm voll aus und besteht aus dem Bild, der Bildlegende, der Anzahl der Bilder (inkl. aktueller Bildnummer) und den Vor- und Zurück-Pfeilen, mit denen Nutzende durch die Bilder blättern können. In der oberen rechten Ecke befindet sich ein Icon zum Schliessen der Vollbildansicht.

Verwendung

Mit der Bildergalerie oder einem Bildslider zeigen wir mehrere Bilder, um einen ansprechenden visuellen Eindruck zu vermitteln.

Die Bildergalerie zeigt mehrere Bilder gleichzeitig auf dunklem Hintergrund an, jedoch kleiner. Die Bilder werden nur per Klick gross angezeigt. Diese Variante der Bildergalerie eignet sich, wenn viele Bilder vorhanden sind (bspw. Bilder eines Events). Durch die Darstellung aller Bilder im Kleinformat erhalten Nutzende einen guten Überblick und Eindruck.

Der Bildslider zeigt das erste Bild gross an. Mit Vor- und Zurück-Pfeilen können Nutzende durch die Bilder blättern. Diese Variante der Bildergalerie eignet sich vor allem für wenige Bilder (Empfehlung: maximal zehn Bilder).

Allgemein gilt für Bilder : Wenn immer möglich, soll ein Bild die Aussage des Inhalts unterstützen. Ein gutes Bild unterstützt das Nutzererlebnis, indem es unterschwellig hilft, den Inhalt zu verstehen. Generische Stimmungsbilder ohne Aussagekraft sollen nicht genutzt werden.