Knowhow und Wissenswertes zu barrierefreiem Webdesign

Einführung

Barrierefreies Webdesign umfasst weitaus mehr als einige technische Anforderungen. Die Webstandards für HTML und CSS müssen eingehalten werden, aber Webstandards umfassen beispielsweise auch die Web Content Accessibility Guidelines. Darin werden eine Vielzahl von Anforderungen von Verständlichkeit bis technische Robustheit beschrieben, deren Erfüllung erst Barrierefreiheit bedeuten.

Barrierefreiheit kann nur erreicht werden, wenn sie als Qualitätsziel und bereits bei der Planung und Konzeption von Webprojekten umfassend berücksichtigt wird.

In der Rubrik Intern: Einführung finden Sie die folgenden Beiträge:

Was bedeutet Barrierefreiheit? — Barrierefreies Webdesign beschreibt die Zugänglichkeit und Nutzbarkeit von Webseiten und -anwendungen vor dem Hintergrund einer Behinderung.
Computer und Behinderung? — Der Computer nützt behinderten Menschen vielleicht mehr als einem "Durchschnitts-Surfer", weil der Computer bestimmte Einschränkungen kompensieren kann.
Das Internet hören und fühlen — Eine qualitative Studie zur "Barrierefreie Informationstechnik-Verordnung - BITV" am Beispiel von blinden Schülern
Barrierefreiheit im Überblick — Checklisten können eine Orientierung bei der Beurteilung der Barrierefreiheit geben. Mit den "Sieben Säulen der Barrierefreiheit" wird eine erste Orientierung gegeben.
Barrierefreies Design — eine Aufgabe für Web-Architekten — Dieser Beitrag reißt einige wichtige Themen aus der Barrierefreien Informationstechnik-Verordnung an.

Webstandards

Zahlreiche Techniken ermöglichen heute die Entwicklung komplexer und interaktiver Webanwendungen. Manche Techniken sind mehr, manche weniger, manche gar nicht geeignet, um Webinhalte zugänglich zu gestalten. Hier sind sowohl technisches Wissen als auch das Wissen um die Anforderungen der Nutzergruppen gefragt, um möglichst vielen Menschen ein barrierefreies Web zur Verfügung stellen zu können.

In der Rubrik Intern: Webstandards finden Sie die folgenden Beiträge:

Die sehr kurze Geschichte von Webstandards — Webdesign wird immer komplexer und muss sich dennoch den Anforderungen an die Barrierefreiheit stellen und zugängliche Webanwendungen ermöglichen.
Webstandards des W3C — Die Empfehlungen des W3C unterstützen Software- und Webentwickler bei der barrierefreien, aufwärtskompatiblen, geräteunabhängigen Webentwicklung.
Die Unterschiede zwischen XHTML und HTML — Damit Seiten validieren und als "Best Practice" gelten können, sollten die kleinen Unterschiede zwischen XHTML und HTML beachtet werden.
Layout-Tabellen sind wie Briefe in Excel — Es besteht keine Notwendigkeit, das Layout einer Webseite mit Tabellen aufzubauen. Alle Browser unterstützen mittlerweile CSS.
Der barrierefreie Einsatz von Frames — Frames können eingeschränkt barrierefrei gestaltet werden. Allgemein sollten robustere Lösungen dem Einsatz von Frames vorgezogen werden.
Das i-Tüpfelchen der Barrierefreiheit — Valider HTML-Code fördert die Kompatibilität mit Browsern und Hilfsmitteln. Die Barrierefreiheit kann nicht automatisch getestet werden, sondern muss mit Werkzeugen überprüft werden.
Gültige HTML-Elemente — Der Einsatz gültiger und standardkonformer HTML-Elemente (Tags) fördern ein zugängliches Internet.
Gültige HTML-Attribute — HTML-Attribute sollten ihrem Zweck nach eingesetzt werden.

Rich Media

Rich Media ist ein starkes Mittel, um Inhalte visuell und akustisch zu ergänzen oder überhaupt zu vermitteln. Rich Media bezeichnet Inhalte, die visuell oder akustisch durch Video, Audio, Dynamik oder Formate angereichert werden.

Multimedia stellt eine besondere Herausforderung bei der barrierefreien Gestaltung dar, denn es werden Inhalte auf mehreren Ebenen und in zeitliche Abhängigkeit vermittelt. wesentliche Anforderung der Barrierefreiheit sind Untertitel und Audiodeskription.

Rich Media beschränkt sich aber nicht alleine auf Video- und Audioformate. Auch Anwendungen wie Adobe Flash ebenso wie das PDF-Format bedürfen besonderer Aufmerksamkeit.

In der Rubrik Intern: Rich Media finden Sie die folgenden Beiträge:

Multimedia hilft — Beim richtigen Einsatz von Audiodeskriptionen, Untertiteln und ggf. weiteren Textalternativen kann Multimedia Barrierefreiheit fördern.
Barrierefreie Gestaltung multimedialer Inhalte mittels SMIL 2.0 in der Theorie und anhand eines Beispiels — Die Praxis zeigt, dass einzelne Medientypen durchaus für Nutzergruppen mit bestimmten Beeinträchtigungen zugänglich gemacht werden können. So können zum Beispiel die visuelle Ebene eines Films von sehbehinderten Menschen durch das alternative Angebot dieser Inhalte in Form einer akustischen Beschreibung erfasst, oder die Sprachdialoge durch Untertitel beziehungsweise ein Gebärdensprache-Video barrierefrei gemacht werden.
Gestaltung barrierefreier PDF — Tagged PDF und laufende Qualitätssicherung im Entwicklungsprozess bilden die Grundlage von barrierefreien PDF-Dokumenten.

Störfaktoren

Manche Webtechniken können Störfaktoren beim Lesen oder Wahrnehmen sein. Insbesondere solche Störfaktoren, die potenziell die Nutzung durch bestimmte Personen ausschließen können, müssen unbedingt vermieden werden, um Barrierefreiheit auf der niedrigsten Konformitätsstufe zu erreichen.

Es gibt aber auch weitere Techniken, die ihrem Wesen nach zu vermeiden sind bzw. besondere Beachtung erfordern.

In der Rubrik Intern: Störfaktoren finden Sie die folgenden Beiträge:

Die 5-Sekunden-Ausnahme für blinkenden Text — Blinkende Inhalte lenken ab bis hin zur Unfähigkeit, mit einer Webseite zu interagieren. Kurzzeitige dynamische Effekte sind aber nach der WCAG zulässig.
Grafische Zugangscodes sperren blinde Internetnutzer aus — CAPTCHA — ursprünglich grafische Sicherheitsabfragen zum Schutz vor Forenspam — bilden oft eine Barriere für Nutzer von Screenreadern.

Nutzerführung

Die Nutzerführung ist durchaus ein weites Feld und oft abhängig von einzelnen Aufgaben und Prozessen. Vor dem Hintergrund der Barrierefreiheit gibt es ebenso viele Aspekte, die es in Navigationskonzepten zu beachten gilt.

Die Spannweite der Anforderungen reicht vom Anbieten von mindestens zwei Zugangspfaden über die Kennzeichnung der aktuellen Position bis hin zum Wortlaut von Linktexten. Natürlich darf dabei die Geräteunabhängigkeit nicht vernachlässigt werden.

Im Web ist aber vor allem darauf zu achten, dass Tastaturnutzer innerhalb einzelner Seiten effizient navigieren können.

In der Rubrik Intern: Nutzerführung finden Sie die folgenden Beiträge:

Unsichtbare Texte — nur für Screenreader — Gelegentlich benötigen Screenreadernutzer zusätzliche Texte oder Links, die am Bildschirm per CSS versteckt werden sollen.
Eine ergänzende Orientierungshilfe: Die Brotkrumen-Navigation — Auf Basis der WCAG 2.0 sollte die Position der aktuellen Seite angegeben werden. Die Brotkrümmel-Navigation ist eine von mehreren geeigneten techniken.
Image-Maps und Barrierefreiheit — Wie Image-Maps richtig und barrierefrei eingesetzt werden.
Links öffnen im neuen Fenster — Neue Browserfenster bedeuten einen Kontextwechsel und sollten daher angekündigt werden.
Strukturelle Navigation von Überschrift zu Überschrift — Das Springen von Überschrift zu Überschrift ist wichtig für Screenreadernutzer - aber welche Überschriftenebene passt am Besten?

Alternative Versionen

Je nach Behinderung oder technischer Aufbereitung von Inhalten können alternative Versionen der Inhalte die Barrierefreiheit fördern. Ich beschreibe in dieser Rubrik Möglichkeiten und Grenzen zur Erstellung alternativer Inhaltsversionen und gehe besonders auf den Mythos "Textversion" ein.

In der Rubrik Intern: Alternative Versionen finden Sie die folgenden Beiträge:

Ganz andere Wege — Manche komplexe Inhalte sind nicht oder nicht sofort barrierefrei umsetzbar; dann kann eine alternative Version Abhilfe schaffen.
Wofür alternative Versionen geeignet sind — Zusätzliche Inhalte können und sollen als alternative Version angeboten werden, aber sie müssen dann auf die speziellen Bedürfnisse der Nutzergruppen abgestimmt sein.
Theorie und Anforderungen der alternativen Version — Die alternative Version soll die Barrierefreiheit förden. Dieser Beitrag gibt einen Überblick darüber, wann alternative Versionen zulässig sind.
Mythos "Textversion" — Die Textversion hat niemals zu den Anforderungen der Barrierefreiheit gehört. Dennoch wird sie gerne als "barrierefreie Version" verkauft.
Style-Switcher — Ein Stilwechsler kann zur Erreichung einer bestimmten Konformitätsstufe der Barrierefreiheit eingesetzt werden.

Verständliche Inhalte

Bereits in der Web Content Accessibility Guidelines 1.0 aus dem Jahr 1999 wurde deutlich, welche Schwierigkeiten es gab, die Verständlichkeit als Anforderung der Barrierefreiheit zu formulieren, hies es doch, Inhalte müssen möglichst klar und einfach formuliert werden. Diese Anforderung ist in der WCAG 2.0 "nur" noch eine dokumentierte Technik — die Erfolgskriterien zur Barrierefreiheit werden heute so formuliert, dass sie technisch überprüfbar sind.

Die Verständlichkeit wird in der WCAG 2.0 mit Anforderungen aus dem Bildungswesen gekoppelt.

In der Rubrik Intern: Verständliche Inhalte finden Sie die folgenden Beiträge:

Texte im Web verständlicher schreiben — Vorstellung des Hamburger Verständlichkeitsmodells nach I. Langer, F. Schulz von Thun und R. Tausch.
Großer fetter Text macht noch lange keine Überschrift — Überschriften sollen zur Gliederung von Inhalten eingesetzt werden. Vor allem Bedeutung und Beziehung der Überschriften müssen dabei im HTML nachvollzogen werden können.

Redaktionsbilder

Bilder machen ein Webangebot ansprechender und interessanter, z.B. eine Illustration, eine Fotoserie oder dekorative Elemente. Bilder illustrieren und dekorieren und sind ein wichtiges Mittel, Inhalte verständlicher und zugänglicher zu machen. Die Frage nach dem passenden Alternativtext kann meist nicht leicht beantwortet werden, da es insbesondere auf den Kontext des Bildes ankommt. Wichtig ist u.a. der Informationsgehalt des Bildes: Werden Informationen vermittelt und, wenn ja, welche der zahlreichen Möglichkeiten der Beschreibung ist sinnvoll? Es ist aber nicht nur eine redaktionelle Aufgabe, Alternativtexte zu wählen; Redaktionssysteme müssen die entsprechenden Optionen zur Verfügung stellen und in Templates müssen Grafiken ebenso auf Informationsgehalt überprüft werden.

Im Moment biete ich keine Beiträge in dieser Rubrik an.

Zugänglichkeit von Inhalten

Die redaktionelle Arbeit im Web kann sich nicht alleine auf (verständliche) Inhalte oder die Wahl passender Alternativtexte für Bilder beschränken. Einige Aspekte der WCAG20 verlangen HTML-Kenntnisse von Redakteuren ab.

Im Idealfall bieten Redaktionssysteme alle erforderlichen Werkzeuge, die zur barrierefreien Verarbeitung von Texten notwendig sind. Diese Anforderungen sind Vielfältig und werden in den Authoring Tool Accessibility Guidelines des W3C beschrieben. Viele Aspekte lassen sich durch die Wahl passender Autorensysteme automatisieren. Dennoch: bei Datentabellen sowie bei der Behandlung von Sprachwechseln und Abkürzungen ist eine technische Überprüfung durch Redakteure meist unumgänglich.

In der Rubrik Intern: Zugänglichkeit von Inhalten finden Sie die folgenden Beiträge:

Anforderungen der BITV an die Webredaktion — Aspekte der Barrierefreiheit lassen sich teilweise automatisiert umsetzen. Einige Kriterien der BITV müssen Redakteure manuell sicherstellen.
Benimmregeln für Datentabellen — Ein mehrteiliger Artikel mit allgemeiner Einführung und Code-Beispielen zur barriererfreien Erstellung von einfachen und komplexen Datentabellen.
Zett Punkt Bee Punkt — Über die Auszeichnung von Abkürzungen im Web
Automatisieren der Auszeichnung von Abkürzungen und Sprachwechseln — Konzeptbeschreibung zur automatischen Auszeichnung von Abkürzungen und Sprachwechseln im Content-Management-System von www.bmz.de.

Portable Document Format

Das Portable Document Format (PDF) von Adobe ist ein wichtiges Format im Web. Obwohl dieses Format nicht als Webstandard entwickelt wurde, hat es sich sehr früh etabliert und ist ein de-facto-Standard z.B. für Downloads. Die barrierefreie Gestaltung von PDF war nicht von Anfang an möglich und ist bis heute nicht überall im Workflow zu integrieren, d.h. in vielen Anwendungen kann Barrierefreiheit vorbereitet werden und der PDF-Export liefert akzeptabele Ergebnisse, aber bei der Erzeugung von PDF in manchen anderen Anwendungen muss die Barrierefreiheit nachträglich eingearbeitet werden.

Weil PDF bzw. die ursprünglichen Dokumente sehr unterschiedlich sind — die Qualität reicht von gut strukturierten Dokumenten bis zu eingescannten Dokumenten — ist die Qualität der PDF ebenso unterschiedlich. Vor welchen Herausforderungen insbesondere blinde Nutzer beim Öffnen eines PDF-Dokuments stehen können und welche Handlungen teilweise erforderlich sind, beschreibt Oliver Nadig in einem ausführlichen Tutorium für Screenreader-Nutzer.

In der Rubrik Portable Document Format finden Sie die folgenden Beiträge:

PDF und Barrierefreiheit — Ein Tutorial zur Erstellung barrierefreier PDF-Dokumente. Erforderlich hierfür ist eine Vollversion eines Adobe-Produkts wie Adobe Acrobat 8 Professional sowie Microsoft Word ab der Version 2000.
Lesen, was drinsteht - rausholen, was drinsteckt Wie blinde Computernutzer sich PDF-Dokumente zugänglich machen — Wenn PDF nicht barrierefrei ist, dann müssen Screenreadernutzer auf diverse und teilweise komplexe Maßnahmen zurückgreifen, um die Inhalte der Dateien zugänglich zu machen.

Geräteunabhängigkeit

Die Bedienung von Webseiten mit der Tastatur stellt manche Nutzer vor eine Herausforderung. Der lineare Zugang zu Inhalten kann in dynamischen Anwendungen oder komplexen Layouts dazu führen, dass solche Inhalte nicht barrierefrei sind. HTML selbst bietet hierfür kaum Möglicchkeiten, die Nutzbarkeit für Tastaturnutzer zu verbessern.

In der Rubrik Intern: Geräteunabhängigkeit finden Sie die folgenden Beiträge:

Tabben statt Klicken — Einzelfälle rechtfertigen den Einsatz von Tabindizes, in der Regel sollte jedoch auf dieses Attribut verzichtet werden.
Navigieren mit Shortcuts — Das accesskey-Attribut kann für wichtige Links und Steuerelemente vergeben werden. In diesem Artikel wird ein Schema vorgestellt, das auf den meisten Webauftritten eingesetzt werden kann.

Flexible Darstellung

Die Flexibilität der Darstellung umfasst insbesondere die Textvergrößerung für die Bildschirmdarstellung. Sie kann auf den Seitenzoom des Browsers reduziert werden, aber Best-Practice geht darüber hinaus und berücksichtigt u.a. die reine Schriftvergrößerung und ein flüssiges Layout.

Zur optimalen Darstellung gehören auch einige typografische Aspekte, die die Leserlichkeit fördern.

In der Rubrik Intern: Flexible Darstellung finden Sie die folgenden Beiträge:

Minimale Schriftgrößen für das Web — Konkrete Anforderungen für eine Mindestschriftgröße werden in der WCAG 2.0 nicht gestellt.
Gedanken zur Silbentrennung — Worttrennungen sind ein visueller Aspekt des Webdesigns und müssen mit CSS statt mit HTML realisiert werden.

Screendesign

Ein großes Spektrum unterschiedlichster Augenerkrankungen erfordert es, dass Screendesigner mehrerer Kriterien zur erfolgreichen Erstellung barrierefreier Webseiten berücksichtigen müssen. Ebenso müssen die Bedürfnisse von Tastaturnutzern beachtet werden.

In der Rubrik Intern: Screendesign finden Sie die folgenden Beiträge:

Sehbehinderten-Simulatoren — Sehbehindertensimulatoren helfen Webentwicklern, ein Verständnis für die vielfältigen Auswirkungen von Sehbehinderungen zu entwickeln.
Werkzeuge für Screendesigner — Die Vorstellung von Werkzeugen für Screendesigner stellt Anwendungen vor, welche die gezielte Entwicklung barrierefreier Layouts unterstützen.
WCAG 2.0-Erfolgskriterien und Sehbehinderung — Screendesigner bekommen mit den WCAG 2.0 und ihren zugehörigen Techniken eine umfassende Richtlinie zur barrierefreien Webseitengestaltung für Sehbehinderte.