Select

Ein Select ermöglicht es Usern, eine einzelne Option aus einer vordefinierten Liste auszuwählen.GitHubMarkdown
App(optional)

Grundlagen

Best practices

Achte bei der Verwendung eines Selects darauf, dass ...

  • das Label kurz und deutlich formuliert ist.
  • ein Placeholder verwendet wird, wenn kein sinnvoller Default-Wert existiert oder der User aktiv eine Auswahl treffen soll. Der Placeholder sollte eine klare Handlungsaufforderung enthalten – zum Beispiel: „Sprache wählen“.
  • die Optionen verständlich und konsistent benannt sind. Jeder Eintrag sollte mit einem Großbuchstaben beginnen; Satzzeichen wie Kommas oder Semikolons sind zu vermeiden.
  • die Anzahl der Optionen überschaubar bleibt. Bei sehr vielen Einträgen kann z. B. eine ComboBox die bessere Wahl sein.
  • die Optionen in einer sinnvollen, nachvollziehbaren Reihenfolge dargestellt werden, z. B. alphabetisch, thematisch oder nach Relevanz.

Verwendung

Verwende ein Select, um ...

  • eine Einfachauswahl bereitzustellen. Diese sollte aus mindestens zwei Optionen bestehen. Zu beachten ist, dass im geschlossenen Zustand immer nur eine Option für den User sichtbar ist. Wenn alle Optionen direkt sichtbar sein sollen, muss eine andere Component verwendet werden (z. B. RadioGroup).
  • Platz zu sparen, wenn beispielsweise eine RadioGroup oder ein SegmentedControl zu viel Raum einnehmen würde.
  • Usern ausschließlich gültige Auswahlmöglichkeiten anzubieten – im Gegensatz zur freien Texteingabe im TextField.
  • in Formularen eine klare Entscheidung aus mehreren Alternativen einzufordern.

Auf dieser Seite