Barrierefreies Webdesign — ein zugängliches und nutzbares Internet gestalten

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

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 Extern: 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:

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:

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:

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:

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:

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:

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:

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:

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.