# Accessibility

Accessibility bedeutet, digitale Produkte so zu gestalten, dass möglichst viele
Menschen sie nutzen können. Dazu gehören Menschen mit dauerhaften
Einschränkungen ebenso wie Personen mit temporären oder situativen
Herausforderungen, etwa bei schlechter Beleuchtung oder mit nur einer freien
Hand. Gute Accessibility verbessert die Nutzung für **alle**.

Unser Design System Flow bildet dafür eine wichtige Grundlage. Die Components
bringen bereits zugängliche Interaktionen, eine sinnvolle Struktur und
unterstützende Attribute mit. Echte Accessibility entsteht jedoch erst im
Zusammenspiel mit der Umsetzung im Produkt. Flow unterstützt dich dabei, ersetzt
aber keine bewussten Entscheidungen in deinem Projekt.

Die Anforderungen der
[Web Content Accessibility Guidelines (WCAG) 2.2 AA](https://www.w3.org/TR/WCAG22/)
dienen Flow als Referenz für eine zugängliche Gestaltung. Sie fließen in
Components, Patterns und Grundlagen – wie beispielsweise Kontraste – ein und
werden kontinuierlich berücksichtigt und weiterentwickelt.

---

# Was Flow für dich übernimmt

Unsere Components sind so gestaltet, dass sie automatisch viele typische
Anforderungen an Accessibility erfüllen.

Dazu gehören zum Beispiel:

- ausreichende Kontraste
- Tastaturbedienbarkeit
- unterstützende ARIA-Attribute an geeigneten Stellen
- einheitliche Interaktionsmuster und Patterns

Wenn du die Components wie vorgesehen verwendest, hast du bereits eine solide
Grundlage für Accessibility.

---

# Was du selbst beachten solltest

Accessibility entsteht erst durch die richtige Verwendung der Components im
Produkt.

Beachte dabei einige Grundlagen:

- **Nutze semantisches HTML:** Verwende strukturelle Elemente wie `header`,
  `main` oder `footer`, um Bereiche einer Seite eindeutig zu kennzeichnen, statt
  generischer Container ohne Bedeutung.
- **Achte auf eine sinnvolle Struktur der Seite:** Überschriften sollten logisch
  aufgebaut sein und Inhalte klar gliedern.
- **Setze ARIA-Attribute bewusst ein:** ARIA ergänzt Semantik, ersetzt sie aber
  nicht.
- **Formuliere hilfreiche Alternativtexte für Bilder:** Alt-Texte sollten immer
  den Zweck eines Bildes beschreiben. Dekorative Bilder benötigen keinen
  Alternativtext.
- **Beschrifte interaktive Elemente verständlich:** Links und Buttons sollten
  klar sagen, was passiert.
- **Prüfe Farbkontraste bei individuellen Anpassungen.**

---

# Mehr erfahren

Accessibility ist kein Zustand, den man einmal erreicht und dann abhaken kann.
Sie sollte während der Entwicklung regelmäßig geprüft und Schritt für Schritt
verbessert werden.

Flow und die zugehörige Dokumentation bieten dafür eine solide Grundlage und
helfen dir, viele Anforderungen frühzeitig zu berücksichtigen. Es lohnt sich
dennoch, sich zusätzlich mit den offiziellen Richtlinien vertraut zu machen.
Besonders hilfreich sind die
[WCAG 2.2 Guidelines](https://www.w3.org/TR/WCAG22/) sowie die
[ARIA Authoring Practices Guide (APG)](https://www.w3.org/WAI/ARIA/apg/). Dort
findest du konkrete Best Practices, Beispiele für typische Interaktionsmuster
und weiterführende Empfehlungen für barrierearme Interfaces.