Navigieren auf digital.sbb.ch

Beta

Radiobutton

1. Was macht das Element?

  • Dient zur Auswahl genau einer Option aus mehreren.

2. Wann soll das Element eingesetzt werden?

  • Bei zwei und mehr Auswahlmöglichkeiten, bei der sich die Optionen gegenseitig ausschliessen.

3. Regeln

  • Es müssen mindestens zwei Optionen zur Auswahl stehen.
  • Eine Vorauswahl ist Pflicht.
  • Für detaillierte Erklärungen kann neben dem Label ein Icon dargestellt werden. Beim Klick auf dieses Fragezeichen öffnet sich ein .
  • Radio Buttons können vertikal oder horizontal angeordnet werden. Die vertikale Anordnung wird bevorzugt, dadurch kann der Benutzer die Auswahlmöglichkeiten schneller erfassen.
  • Horizontale Anordnung nur bei zwei bis drei Auswahlmöglichkeiten und kurzen Bezeichnungen.
  • Der Text kann mehrzeilig sein.
  • Nebst dem eigentlichen Radiobutton dient auch der gesamte Text als Click-Target.

4. Ausprägungen und Zustände

Das Element hat folgende Zustände:

Das Element hat folgende Ausprägungen:

  • mit Info (nur bei vertikaler Ausrichtung)
  • ohne Info
  • vertikal ausgerichtet
  • horizontal ausgerichtet

4.1 Vertikale Anordnung

Darstellung der Radiobuttons, vertikale Anordnung, mit Info
Darstellung der Radiobuttons, vertikale Anordnung, ohne Info

Design Spezifikation

4.2 Horizontale Anordnung

Darstellung der Radiobuttons, horizontale Anordnung

Design Spezifikation