Anwendungsgebiet

Das Element "Nur Bilder" bietet eine Vielzahl an Möglichkeiten, um einzelne Bilder oder kleine Galerien darzustellen. Um die Seite harmonisch zu gestalten, sollten Sie bei der Verwendung mehrerer Bilder darauf achten, gleiche Bildformate zu verwenden. Beschneiden Sie deshalb z.B. Bilder in einer Zeile, besser noch für die komplette Galerie, immer im gleichen Seitenverhältnis (z.B. 1:1).

Erstellung

Um einen Button-Link zu erstellen, klicken Sie an der gewünschten Stelle auf das Plus-Symbol, um den Content-Assistent aufzurufen. Auf dem Reiter "Typischer Seiteninhalt" befindet sich das Element "Nur Bilder". Ein Klick darauf führt zu einer neuen Maske zum Einfügen der Bilder.

Vergeben Sie zunächst eine Überschrift und wählen Sie einen Typ entsprechend der Informationshierarchie auf der Seite. Beachten Sie, dass es pro Seite nur eine Überschrift vom Typ H1 geben soll. Eine H1 wird in der Regel durch den Header gesetzt.

Auf dem Reiter "Bilder" starten Sie mit Klick auf "Bild hinzufügen" die Bildauswahl. Im Element-Browser können Sie ein oder mehrere Bilder auswählen. Nachdem sich der Element-Browser geschlossen hat, erscheinen die Bilder als Panels im Reiter "Bilder".

Bearbeiten Sie nun Eigenschaften des Bildes: Das Feld "Titel" muss nicht ausgefüllt werden. Es erzeugt eine Flagge mit diesem Text, wenn man mit der Maus darüberfährt. Sinnvoll ist das Feld "Alternativer Text". Dieser Text ist im Frontend unsichtbar, wird aber von Suchmaschinen und Lesegeräten für sehbehinderte Menschen ausgelesen. Der Text sollte eine Beschreibung des Bildinhalts bieten und z.B. auch im Bild sichtbaren Text wiedergeben.

Mit dem Button "Editor öffnen" starten Sie die Oberfläche zum Zuschneiden und zur Auswahl eines Bildausschnitts. Wählen Sie zunächst ein Seitenverhältnis (oben rechts) und bestimmen Sie dann mit den Eckpunkten im Bild (orange) den Bildausschnitt. Mit "Akzeptieren" wechseln Sie zurück in die Bildübersicht. Verfahren Sie so mit allen ausgewählten Bildern.

Wenn Sie mehrere Bilder ausgewählt haben, können Sie im Bereich "Spalten" außerdem für jede Geräteklasse festlegen, wie viele Bilder in einer Zeile nebeneinander dargestellt werden sollen. Für XS (Smartphone) und SM (Phablets) ist meist "1" – also ein Bild pro Zeile – ein sinnvoller Wert. Für MD (Tablets) 2 und für größere Geräte 3 oder 4.

Unter dem Punkt "Verhalten" können Sie "Bei Klick vergrößern" aktivieren, wenn die Besucher dadurch einen Mehrwert haben, also mehr Details oder das Bild ohne Zuschnitt sehen können.

Auf dem Reiter "Erscheinungsbild" können Sie zusätzliche Effekte für das Element (Feld "Frame") und die Bilder (Feld "Bild-Klassen") auswählen. Bei Bildern mit weißen Hintergründen sollten Sie einen Rahmen aktivieren.