Inhalts-Slider
Der Slider zeigt in vordefinierten Intervallen verschiedene bildhafte Beiträge in Kombination mit kurzen Texten und damit Einstiege in bestimmte Themen an. Slider können bestimmte Beiträge hervorheben und somit Schwerpunkte setzen. Ein Inhalts-Slider kann frei im Hauptinhaltsbereich verwendet werden.
Verwendung
Im Gegensatz zum Highlight-Slider können Inhalts-Slider mehrfach als Gestaltungsmittel eingesetzt werden. Die Befüllung des Sliders sollte mit hochwertigen Bildern und kurzen, prägnanten Texten geschehen. Es besteht zudem die Möglichkeit Videos innerhalb des Sliders einzubinden.
Dabei gibt es zwei unterschiedliche Darstellungsarten von Slidern:
- Slides nur mit Bild
- Slides mit Überschrift, Bild und Text
Slider eignen sich für Themenslides von einem bis maximal sechs (unterschiedlichen) Themen.
Einsatz
Verhalten und Gestaltung
Die Slideshow läuft in Intervallen von sechs Sekunden automatisch durch, sofern mehr als ein Slide eingesetzt wurde. Der Nutzer hat die Möglichkeit den automatischen Durchlauf zu stoppen und proaktiv selbst zu navigieren, sowie neu zu starten. Zusätzlich wird die Animation gestoppt, wenn der Nutzer mit der Maus über dem Element steht.
Für die Navigation des Sliders, bei mehr als einem Slide, stehen dem Nutzer zwei Varianten zur Verfügung:
1. Pagination
2. Pfeile zur Steuerung am rechten Rand
Wird dem Slide nur ein Bild hinzugefügt, entsteht kein Slider und es entfallen die Steuerelemente.
Alle Steuerelemente befinden sich auf gleicher Höhe als Abschluss am unteren Rand des Moduls. Die Icons werden in der gewählten Portalfarbe angezeigt, wobei der Hintergrund Grau #f1f3f1 eingefärbt ist und einen Rahmen in der 20 % Portalfarbe hat.
Die inhaltliche Aufteilung des Sliders ist je nach gewähltem Seitenraster fest definiert und sollte lediglich ohne Marginalspalte verwendet werden.
Der Bildbereich nimmt mindestens 50 % des verfügbaren Bereichs ein. Es können sowohl Bilder als auch Videos platziert werden. Für den Textbereich stehen ebenfalls mindestens 40 % zur Verfügung, wobei entsprechende Außenabstände definiert sind. Zusätzlich besteht die Möglichkeit den Bildbereich auf 100 % zu erweitern, somit entfällt der Textbereich vollständig.
Ein wichtiger Bestandteil der Beiträge innerhalb eines Slides ist immer auch eine aussagkräftige CTA (Call-to-Action) – im Falle dieses Elements ein Button mit aussagekräftigem Linktext für die Interaktion.
Barrierefreiheit
Tastaturbedienung
Taste | Funktion |
---|---|
Pfeiltasten links/rechts | zurück/vorwärts blättern |
Leertaste | Automatischen Durchlauf starten/stoppen |
Hinweis: Der aktuelle Fokus muss innerhalb des Sliders platziert sein.