ARIA Properties

ARIA Properties sind spezielle HTML-Attribute, die zusätzliche Informationen über den Zustand oder die Eigenschaften eines Elements bereitstellen – speziell für Screenreader und assistive Technologien. Sie sind Teil der WAI-ARIA-Spezifikation (Accessible Rich Internet Applications) und verbessern die Barrierefreiheit interaktiver Websites.

Was bewirken ARIA Properties?

Anders als ARIA Roles, die festlegen, was ein Element ist (z. B. Schaltfläche), sagen ARIA Properties, wie es sich verhält oder in welchem Zustand es sich befindet.

Beispiele für Properties:

  • aria-checked="true" (Element ist ausgewählt)
  • aria-disabled="false" (Element ist aktivierbar)
  • aria-hidden="true" (Element wird von Screenreadern ignoriert)

Diese Attribute sind besonders bei benutzerdefinierten UI-Komponenten wichtig, z. B. bei komplexen Dropdown-Menüs oder Slidern.

Der Klicklounge-Tipp: ARIA Properties ersetzen keine saubere HTML-Struktur – sie ergänzen sie. Setzen Sie sie nur dann ein, wenn keine nativen HTML-Elemente geeignet sind.