Development

Du programmierst das Produkt.

Nutze semantisch korrekte Elemente

Nutze immer semantisch korrekte Elemente um assistierende Technologien möglichst gut zu unterstützen. Zeichne daher Titel in allen Stufen, Listen, Tabellen und so weiter mit den entsprechenden Elementen aus und setze für dein Dokument die korrekte Sprache.

Hilfe für korrekte Semantik: https://www.accessibility-developer-guide.com/examples

Referenz 1: https://www.w3.org/TR/WCAG21/#info-and-relationships
Referenz 2: https://www.w3.org/TR/WCAG21/#language-of-page

Nutze Standard Elemente

Native Elemente ersparen dir sowohl in HTML als auch in Mobile Apps eine Menge Ärger. Die Elemente sind bereits auf Barrierefreiheit hin optimiert, ihr komplettes Verhalten muss ansonsten nachgebaut werden. Sag dies auch deinem Designer, wenn er auf etwas besteht.

Hilfe für typische nicht-native Elemente: https://inclusive-components.design

Referenz: https://www.w3.org/TR/WCAG21/#name-role-value

Achte auf eine korrekte Linearisierung

Achte darauf, dass alle Inhalte nicht nur visuell sinnvoll angeordnet sind, sondern dies auch im Code berücksichtigt wird. Versuche alles verständlich zu machen, wenn jemand ohne CSS von oben nach unten durch das Dokument navigiert.

Testen: Schalte das CSS im Browser aus oder Nutze den Screen Reader auf dem Mobile.

Referenz: https://www.w3.org/TR/WCAG21/#meaningful-sequence

Unterstütze die Orientierung

Baue zu Beginn einer Seite Skiplinks ein und nutze verschiedene Landmark-Elemente. Mit diesen beiden Hilfsmitteln können insbesondere Nutzerinnen und Nutzer mit Screen komfortabel direkt zu den verschiedenen Teilen des Inhaltes springen.

Hilfe zu Skiplinks: https://webaim.org/techniques/skipnav
Übersicht zu Landmark Elementen: https://www.w3.org/WAI/ARIA/apg/practices/landmark-regions/

Referenz: https://www.w3.org/TR/WCAG21/#bypass-blocks