console.log()

Barrierefreiheit testen – Teil 3/3

| Keine Kommentare

Anforderungen in BITV 2.0 und WCAG 2.0

Mit Richtlinien wie der Web Content Accessibility Guidelines (WCAG 2.0 vom 11. Dezember 2008) des W3C soll der Grad der Zugänglichkeit von Websites quantifiziert und somit überprüfbar und vergleichbar ermittelt werden können.

In Deutschland müssen „Internetauftritte, […] Intranetauftritte und -angebote, die öffentlich zugänglich sind“ die Anforderungen der Barrierefreie-Informationstechnik-Verordnung erfüllen (BITV 2.0 vom 12. September 2011 (BGBl. I S. 1843)). Die BITV gilt für Internetangebote aller Behörden der Bundesverwaltung.

Hierzu zählen auch Internetangebote der „mittelbaren Bundesverwaltung“, das heißt „Körperschaften, Anstalten und Stiftungen des öffentlichen Rechts, die der Rechtsaufsicht des Bundes unterstehen“. Dazu gehören Bund, Länder, Gemeinden, Universitäten, Ärzte-, Apotheker-, Zahnärzte- und Psychotherapeutenkammern sowie öffentlich-rechtliche Rundfunkanstalten und Stiftungen.

Die Anforderungen der BITV 2.0 orientieren sich an den Anforderungen der WCAG 2.0. Als Grundlage für diese Anforderungen hat eine Arbeitsgruppe der Initiative „Einfach für Alle“ mit Unterstützung von Unternehmen, Hochschulen, Behörden und Initiativen aus Deutschland, Österreich und der Schweiz eine deutsche Übersetzung der WCAG 2.0 verfasst.

In Zukunft sollen die WCAG auch EU-weit als Standard für Barrierefreie Websites gelten, um widersprüchliche Anforderungen der verschiedenen Richtlinien zu vermeiden.

BITV 2.0 und WAI-ARIA

Die BITV 2.0 fordert implizit, dass für alle User Interface Elemente Namen, Rollen, Zustände und Eigenschaften definiert werden:

„Für alle Komponenten der Benutzerschnittstelle sind Name und Rolle durch Programme erkennbar. […] Bei Änderungen dieser Zustände, Eigenschaften und Werte erhalten Benutzeragenten, einschließlich assistiver Technologien, eine Mitteilung.“

Daraus ergeben sich folgende Anforderungen:

  • HTML-Elemente müssen semantisch korrekt verwendet werden, damit ein Screen Reader den korrekten Namen für das Element ausgeben kann. Zum Beispiel wird ein Button mit dem Text „Okay“ von VoiceOver als „Okay, Taste“ oder von Firefox auf Android als „Schaltfläche Okay“ ausgegeben.
  • Alle Elemente, für die der HTML-Standard nicht bereits eine implizite Semantik vorsieht, müssen zusätzlich mit WAI-ARIA Rollen versehen werden.
  • Außerdem müssen Zustände und Eigenschaften der Elemente mit entsprechenden WAI-ARIA Attributen semantisch ausgezeichnet werden, damit sie durch Browser und Screen Reader ausgelesen und verändert werden können.
  • Bereiche einer Website deren Inhalt aktualisiert wird  – zum Beispiel Chat, Twitter-Feed oder Ähnliches –  müssen mit entsprechenden ARIA-Rollen (log, status, alert, progressbar) oder –Eigenschaften (aria-live, aria-relevant, aria-atomic) als Live Regions ausgezeichnet werden. Das ist vor Allem für Anwendungen wichtig, die durch Benutzerinteraktionen das DOM verändern, damit der Screen Reader benachrichtigt wird und den Benutzer über den neuen Inhalt informiert.

Barrierefreiheit überprüfen

Um die Barrierefreiheit einer Website oder Webanwendung zunächst einfach zu testen, sollte in einem ersten Schritt die Tastaturbedienung sowie das Ausfüllen von Formularen praktisch getestet werden. Außerdem sollte die Struktur der Seite im Browser ohne CSS oder direkt im Quellcode untersucht werden. Dabei sollte überprüft werden, ob alle HTML-Elemente semantisch korrekt eingesetzt und nachvollziehbar strukturiert sind.

Mit dem Web-basierten Werkzeug WAVE von Web AIM können mögliche Probleme und Fehlerquellen für die Barrierefreiheit einer Website schnell und einfach identifiziert werden. Für Firefox gibt es eine WAVE Toolbar, die das Testen beliebiger Websites mit wenigen Klicks ermöglicht.

Außerdem sollte die Website mit einem Screen Reader praktisch getestet werden. Hierfür empfiehlt sich der kostenlose NVDA für Windows, VoiceOver in iOS und Mac OS X sowie TalkBack in Android.
VoiceOver wird in iOS über Einstellungen > Allgemein > Bedienungshilfen > VoiceOver aktiviert. Für das Testen mit VoiceOver empfiehlt es sich den ‚Home-Dreifachklick‘ mit VoiceOver zu aktivieren, um VoiceOver einfach an- und auszuschalten. Beim Testen mit Screen Readern sollten Kopfhörer verwendet werden, um das Umfeld nicht akustisch zu stören.

Für die weitere Überprüfung der Barrierefreiheit kann der Kriterienkatalog des BIENE-Wettbewerbs herangezogen werden.
„Mit einer BIENE zeichnen die Aktion Mensch und die Stiftung Digitale Chancen die besten deutschsprachigen barrierefreien Webseiten aus.“ (einfach-fuer-alle.de/biene-2010).
Die letzte BIENE-Auszeichnung wurde 2010 verliehen – der bis dahin jährlich stattfindende Wettbewerb soll in Zukunft aber wieder fortgesetzt werden.
Die Bewertungskriterien des BIENE-Wettbewerbs basieren auf den WCAG und der BITV, sind jedoch einfacher verständlich und mehr praxisorientiert. Jan Hadenfeldt und Alexander Stirn von Virtual Identity haben aus den BIENE-Kriterien eine Übersichtstabelle mit Bezug auf die beteiligten Disziplinen (Redaktion, Design, Frontend, Backend) zusammengestellt.

Um die Einhaltung der WCAG bzw. BITV darüber hinaus verbindlich nachzuweisen sind aufwendigere Prüfverfahren notwendig. Der BITV-Test wird als entwicklungsbegleitender oder abschließender Test zum Beispiel von BIK angeboten. Der Kriterienkatalog des BITV-Tests ist wie bei BIENE offen zugänglich und kann auch in Form einer Selbstbewertung durchgeführt werden. Eine Selbstbewertung ist jedoch nicht mit der unabhängigen Prüfung von BIK vergleichbar.

Websites, die mit dem BITV-Test geprüft wurden, können dann in die sogenannte 90plus-Liste von BIK aufgenommen werden. Dort sind besonders gut zugängliche Websites und Agenturen aufgeführt. Die 90plus-Liste ist sowohl eine gute Quelle für Best-Practises, als auch eine Referenz-Plattform für Agenturen und deren Kunden.

Autor: Clemens Fiedler

Clemens ist Webdeveloper im CMS Team "The Contenters" am Standort Freiburg und interessiert sich für Frontend Themen. Sein Schwerpunkt liegt auf JavaScript, HTML, CSS und Responsive Design. Einfach gutes Frontend ist für ihn das was bei den Menschen ankommt, unabhängig von Zugang, Gerät oder Fähigkeiten.

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.