Barrierefreiheit im Überblick — Die 7 Säulen des barrierefreien Webdesigns veröffentlicht in 2007zuletzt bearbeitet in 2018

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.

Einstiegsthemen

Im Folgenden werden die sieben Säulen der 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.x bzw. der Barrierefreien Informationstechnik-Verordnung – BITV 2.0 vollständig zu erreichen.

Alternativen für Grafiken und Multimedia

Webseiten werden nicht nur in grafischen Browsern dargestellt. Wenn z.B. 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 in Erwägung gezogen 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 z.B. 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?

Skalierbarkeit

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 skalierbare Schrift 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 Inhalte

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 Skripte 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 (z.B.ü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 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 usw. 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.