Barrierefreiheit: Webinhalte für alle

Barrierefreiheit ist von entscheidender Bedeutung, damit alle Menschen – unabhängig von ihren Fähigkeiten und Einschränkungen – Webseiten und Apps bedienen können. Das gilt insbesondere für offizielle Angebote von Behörden. Priminfo, eine Dienstleistung von Meteotest im Auftrag des Bundesamtes für Gesundheit, hatte eine Vorreiter-Rolle und wurde bereits 2018 nach WCAG 2.0 Level AA zertifiziert. In den letzten Monaten haben wir die Website auf den neusten Stand gebracht und freuen uns nun über die Rezertifizierung nach WCAG 2.1 Level AA.

Für einfache "Compliance" – dem Einhalten der vom Gesetz verlangten Mindeststandards – ist es ausreichend, auf semantisch korrekten HTML-Code, Textalternativen für Bilder oder Tastaturbedienbarkeit zu achten. Der AA-Standard (der zweithöchste) geht jedoch darüber hinaus: Er verlangt zum Beispiel Kontrast-Minima bei Texten und Bildern und eine konsistente Navigation. So ist sichergestellt, dass Menschen mit unterschiedlichen Beeinträchtigungen – Sehbehinderungen, Hörprobleme, motorische Einschränkungen usw. – auf alle Informationen zugreifen können.

Wir zeigen die Anforderung am Beispiel der Suche in den Priminfo FAQ (FAQ werden gefiltert während man einen Suchbegriff eintippt):

Der nachfolgende HTML-Code sorgt dafür, dass diese Suchfunktion – gemäss WCAG Level AA – barrierefrei ist:

• Anhand von role="searchbox" kann ein Screenreader-Programm "vorlesen", welchen Zweck das Eingabefeld erfüllt.
• Das Attribut aria-describedby="... verknüpft einen Erklärtext mit dem Eingabefeld. Das Screenreader-Programm liest die Erklärung an dieser Stelle vor.
• Das Attribut aria-controls="faq" beschreibt semantisch, dass Änderungen im Eingabefeld direkte Auswirkungen auf das Element "faq" (die Suchresultate) haben. Screenreader-Programme machen sich diese Information zunutze.
• tabindex="0" macht den "Zurücksetzen"-Knopf (x) über die Tastatur bedienbar (Tab-Taste) und aria-label erklärt die Bedeutung dieses Knopfs.

• Erweiterung der Zielgruppe: Barrierefreie Websites ziehen ein breiteres Publikum an und stärken die Reichweite.
• Inklusion & rechtliche "Compliance": Die Einhaltung von WCAG Level AA schützt vor Diskriminierung und minimiert rechtliche Risiken. Siehe Verordnung über die Beseitigung von Benachteiligungen von Menschen mit Behinderungen.
• Verbesserte User Experience: Eine einfach zugängliche Website sorgt generell für eine positive Erfahrung und stärkt die Kundenbindung.

• Sensibilisiere dein Team für Barrierefreiheit und integriere das Thema von Anfang an in den Entwicklungsprozess.
  
• Nutze Tools wie Firefox, Chromium Devtools, WAVE-Validator und Total Validator, um deine Web-Apps auf Barrierefreiheit zu testen und um Schwachstellen zu identifizieren.
  
• Barrierefreiheit ist kein einmaliges Projekt. Regelmässige Überprüfungen gewährleisten eine langfristige Zugänglichkeit
• Beantrage ein "Accessibility Testing" oder gleich eine Zertifizierung bei anerkannten Experten wie Access-for-All.ch.