Barrierefreiheit im Überblick — Die 7 Säulen des barrierefreien Webdesigns
veröffentlicht in 2007zuletzt bearbeitet in
Barrierefreiheit umfasst zahlreiche unterschiedliche Aspekte des Webdesigns. Wie können Frontend-Entwickler oder Screendesigner, die womöglich zum ersten Mal vor den Anforderungen der Barrierefreiheit stehen, dennoch einen barrierefreien Auftritt für eine möglichst große Zielgruppe schaffen?
Checklisten?
Es ist verständlich, dass Designer und Entwickler nach Checklisten verlangen. Checklisten können jedoch nur eingeschränkt zur Bewertung der Barrierefreiheit genutzt werden, denn die vielfältigen Arbeitsweisen von Nutzern mit Behinderungen sind beim Einstieg ins Thema oft nicht bekannt. Da Checklisten das Hintergrundwissen meist nicht mitliefern und außerdem viele (nicht alle) Aspekte der Barrierefreiheit im Kontext der Webseite beurteilt werden müssen, sind Checklisten zur Überprüfung der Barrierefreiheit eher für diejenigen geeignet, die mit der Materie bereits vertraut sind.
Der Einsatz von Checklisten für die Überprüfung der Barrierefreiheit von Webseiten setzt Kenntnisse über die Bedeutung der einzelnen Erfolgskriterien und Konformität zu den entsprechenden Webstandards voraus.
Werkzeuge?
Der Ruf nach Werkzeugen, die Barrierefreiheit erzeugen, ist ebenso verständlich wie der Wunsch nach Checklisten. Automatische Werkzeuge können Barrierefreiheit nicht erzeugen. Beispiele sind:
- Werkzeuge zur Überprüfung der Barrierefreiheit gibt es viele. Die automatischen Werkzeuge können bestenfalls 30% der Anforderungen zuverlässig prüfen. Es entsteht bei bestandener Prüfung der Eindruck, dass alles in Ordnung ist. Tatsächlich sind die meisten Anforderungen gar nicht geprüft worden.
- Seit einigen Jahren bieten verschiedene Firmen
Accessibility-Overlays für bestehende Webseiten. Das JavaScript im Hintergrund analysiert die Seite und bietet verschiedene Korrekturmaßnahmen an. Letztlich stoßen die Overlays auf die gleichen Probleme wie die automatischen Prüfwerkzeuge. Zusätzlich muss man feststellen, dass die Overlays viel weniger bieten als sie versprechen.
Einstiegsthemen
Im Folgenden werden die sieben Säulen der digitalen Barrierefreiheit vorgestellt. Mit dem Verständnis dieser Themenkomplexe sind zumindest die groben Anforderungen der Barrierefreiheit umsetzbar. Die zugehörigen Fragestellungen reichen aber mit Sicherheit nicht aus, um die Konformität zu den Web Content Accessibility Guidelines (WCAG) 2.1 bzw. der Barrierefreie-Informationstechnik-Verordnung – BITV 2.0 vollständig zu erreichen.
Alternativen für Grafiken und Multimedia
Webseiten werden nicht nur am Bildschirm dargestellt. Wenn zum Beispiel ein Screenreader eingesetzt wird, sind grafische Inhalte ohne geeignete Textalternativen nicht verständlich. Für Multimedia sind die alternativen Inhalte etwas komplexer umzusetzen als bei Grafiken: Insbesondere müssen Untertitel und Audiodeskription berücksichtigt werden.
Folgende Fragen müssen behandelt werden, wenn Grafiken und/oder Multimedia auf einer Webseite vorkommen:
- Wenn
Grafiken ausgeschaltet werden, kann die Seite dann im gleichen Umfang genutzt werden wie bei eingeschalteten Grafiken?
- Wenn Multimedia eingesetzt wird, stehen die Audio-Inhalte in Textform zur Verfügung? Sind die Textabschriften für die Audio-Inhalte
als Untertitel mit der Multimedia synchronisiert?
Bei Multimedia geht es nicht alleine um Nutzer, die den Inhalt nicht hören können, sondern auch um blinde Nutzer, die zum Beispiel die Inhalte von Screencasts nicht nutzen können und auf Textalternativen oder synchronisierter Audio-Deskription angewiesen sind.
Kontraste und Farben
Die Wahrnehmung am Bildschirm kann durch ein vermindertes Sehvermögen stark beeinträchtigt sein. Bei der Barrierefreiheit der visuellen Präsentation sind insbesondere folgende Fragen relevant:
- Wenn in einem beliebigen Browser
ein eigenes Farbschema eingestellt wird, sind alle erforderlichen Informationen erkennbar?
- Genügen alle Farbkombinationen den Anforderungen an
ausreichende Kontrastverhältnisse?
Vergrößerbarkeit
Ist ein Nutzer auf stark vergrößerte Schrift angewiesen, so wird er ein Vergrößerungssystem einsetzen. Wenn jedoch "nur" eine leichte (bis zu zweifache) Vergrößerung gewünscht ist, dann benötigt er vergrößerbare Texte mit flexiblem Layout.
Die Seitenzoom-Funktionen der Browser dürfen generell keine "Unfälle" bewirken. Auch wenn der Seitenzoom gut funktioniert, so reicht sie nicht immer aus:
- Können die Nutzer die voreingestellte
Schriftgröße aller Texte über die reine Schriftvergrößerung vergrößern?
- Ist bei geringer Bildschirmauflösung und/oder vergrößertem Text jeder Textblock vollständig und ohne horizontales Scrollen lesbar?
Linearisierbarkeit
Am Bildschirm sind einzelne Seitenregionen wie Kopfzeile, Navigation und Inhalt meist klar durch Position, Farbe und andere Gestaltungsmerkmale unterscheidbar, in linearer Software wie einer Sprachausgabe wird der komplette Inhalt jedoch sequenziell aufbereitet. Wenn also im Quelltext der Text erst nach einer Kopfzeile und einer umfangreichen Navigation im Quellcode steht, dann werden sie bei linearer Nutzung erst zum Schluss ausgelesen. Diesem Problem entgegnen Screenreader, Vergrößerungssysteme, Browser und andere Hilfsmittel durch erweiterte Funktionen zum Springen innerhalb einer Seite und ermöglichen dadurch eine strukturelle Navigation mit der Tastatur.
Obwohl ein strukturierter Seitenaufbau mit Überschriften, Listen und Absätzen Voraussetzung einer barrierefreien Nutzung ist, muss auch die Reihenfolge der Inhalte in sich schlüssig sein. Deshalb müssen die folgenden beiden Fragen positiv beantwortet werden:
- Ist bei ausgeschaltetem Layout (CSS und Tabellen) jede Webseite genauso nachvollziehbar wie bei eingeschaltetem Layout?
- Steht eine
strukturelle Navigation, vor allem bei umfangreicheren Seiten, zur Verfügung, damit einzelne Seitenregionen gezielt angesteuert werden können?
Fokus-Management und dynamische Komponenten
Die Geräteunabhängigkeit ist einer der Hauptziele im barrierefreien Webdesign. Eng verknüpft mit der Linearisierbarkeit spielt dabei die Bedienbarkeit des Webangebots mit der Tastatur oder mit Schaltersteurungen eine wichtige Rolle. Kritisch für den barrierefreien Zugang können vor allem dynamische Komponenten und andere clientseitige Anwendungen sein.
Auch wenn die Barrierefreiheit von Widgets eine echte Fleißaufgabe im barrierefreien Webdesign sein kann, muss man zumindest die folgenden Fragen mit "Ja" beantworten können:
- Ist mit der
Tastatur eine gleichwertige Bedienung des Inhalts wie mit der Maus möglich?
- Sind alle Inhalte, die nicht nativ mit HTML abgebildet werden können,
mit den passenden ARIA-Rollen, -Zuständen und -Eigenschaften ergänzt?
Verständlichkeit, Navigation und Orientierung
Barrierefreiheit umfasst viele Aspekte der Verständlichkeit, Navigation und Orientierung und zwar aus der Sichtweise verschiedener Nutzergruppen. Für einen ersten Eindruck sind folgende Fragen hilfreich:
- Sind die Inhalte
allgemein verständlich?
- Werden für Formulareingaben Anweisungen zur Fehlervermeidung und eine Fehlerbehandlung geboten?
- Können Inhalte auf unterschiedlichem Wege zum Beispiel über eine Suchfunktion und über eine Übersicht) erreicht werden, um unterschiedliche Fähigkeiten der Nutzer zu berücksichtigen?
- Ist die
Sprache des Inhalts richtig angegeben, damit Sprachausgaben sie korrekt vorlesen können?
Außerdem muss die Frage nach der Bereitstellung von Inhalten in Leichter Sprache und
Deutscher Gebärdensprache gestellt werden. Diese Anforderung ergibt sich aus der
Definition der Barrierefreiheit.
Strukturierte Inhalte
Der korrekte Einsatz von HTML-Strukturelementen ist das A und O des barrierefreien Webdesigns. HTML ist das Handwerk, das jede beteiligte Person und jede eingesetzte Software beherrschen muss, um gute Webseiten zu produzieren. Deswegen sollten zusätzlich zu den unter "Linearisierbarkeit" aufgeführten Fragen noch die folgenden gestellt werden:
- Wurde die Semantik in HTML für
Überschriften, Absätze, Listen und so weiter durchgängig für alle Inhalte beachtet?
- Haben alle Formularelemente beschreibende Beschriftungen?
Die sinnvolle Strukturierung der Inhalte ist die Grundlage für die Trennung von Inhalt (HTML), Präsentation (CSS) und Verhalten (JavaScript). Diese Trennung der verschiedenen Ebenen ist wiederum Basis für die Standardkonformität eines Webangebots und ein nachweisbares Qualitätsmerkmal der Barrierefreiheit.
Der folgende Begriff auf dieser Seite wird im Glossar definiert:Gebärdensprache