Barrierefrei — Na und?

Die meisten Webdesigner verstehen leider das falsche, wenn man sie auf barrierefreien Webseiten anspricht. Barrierefreie Websitegestaltung wird häufig mit Gestaltung von Websites für behinderte Menschen gleich gesetzt. Diese Gruppe bildet jedoch nur einen Teil der Zielgruppe. Barrierefrei heißt zunächst einmal nur Websites so zu gestalten, dass möglichst viele (behinderte Menschen eingeschlossen) ohne Probleme auf die Inhalte der Webseite zugreifen können. Daher wird barrierefreies Webdesign oft auch mit Accessibility zu deutsch Zugänglichkeit gleichgesetzt. Dies trifft es meines Erachtens auch besser, da die Zielgruppe so wesentlich weiter gefasst wird. Neben den Menschen mit Behinderungen sind damit ebenso ältere Menschen eingeschlossen, die besondere Bedingungen an die Zugänglichkeit des Internets stellen, aber auch die große Masse an Surfern, die mit Handy und anderen Kleinstmonitoren auf Webseiten zugreifen. Ein weiterer possitiver Effekt ist, dass barrierefreie Seiten meist besser für Suchmaschinen optimiert sind.

Was versteht man unter barrierearmen Websites?

Auf Grund des § 11 Abs. 1 Satz 2 des Behindertengleichstellungsgesetzes vom 27. April 2002 (BGBl. I S. 1467) verordnet das Bundesministerium des Innern im Einvernehmen mit dem Bundesministerium für Arbeit und Sozialordnung Richtlinien für barrierefreies Webdesign. Diese Richtlinien hierfür werden in Deutschland, seit dem 24.07.2002 für öffentliche Internetauftritte verpflichtend, durch die Barrierefreie Informationstechnik-Verordnung (BITV) festgelegt. Die einzelnen Punkte der Verordnung können Sie auf den Seiten des Bundesministeriums für Justiz oder aufbereitet auf den Seiten von Einfach für Alle, der Initiative der Aktion Mensch für ein barrierefreies Internet oder in diesem Blog im Artikel “Barrierefreie Informationstechnik-Verordnung” nachlesen.

Barrierefreies Internet

Barrierefreies Internet

Wer hat etwas von barrierefreien Internetseiten?

Eine barrierefreie Website ist entgegen der allgemeinen Sichtweise nicht nur für Blinde, sondern ein Service für viele Menschen. Vergleichbar damit, dass Fahrstühle und Rampen schließlich auch nicht nur Rollstuhlfahrern nützen, sondern vor allem auch zum Beispiel Fahrradfahrern, Leuten mit schweren Koffern oder Eltern mit Kinderwagen.

Alle Besucher einer Internetpräsenz können von barrierefreien Webseiten profitieren, da Barrierefreiheit die Benutzerfreundlichkeit einer Website verbessert. Barrierefreie Seiten erschließen einen deutlich größeren Besucherkreis, weil Sie für alle zugänglich sind. Dabei sollten die automatisierten Crawler der großen Suchmaschinen nicht unberücksichtigt bleiben. Oft sind Anwender aus technischen oder auch anderen Gründen nicht in der Lage die Seite zu öffnen, zu bedienen oder zu verstehen. Dies heißt nichts anderes, als dass sie die Seite nicht wahrnehmen können!

Wem nützt es also letztendlich? Insbesondere werden folgenden Gruppen der Zugang zum Internet erleichtert:

  • Älteren Menschen
  • Kindern
  • Anfängern
  • Menschen mit
    • Lernbehinderungen
    • Sehbehinderungen
    • Hörbehinderungen
    • motorischen Einschränkungen
  • Geistig beeinträchtigte Personen
  • Menschen, die Deutsch nicht als erste Sprache erlernt haben (Die Sprache bezieht sich hier auf Webseiten im deutschen Sprachraum)
  • Automatisierten Programmen zur Erstellung von Suchindices der großen Suchmaschinenbetreiber (z.B. Google, Bing, Yahoo, etc.)
  • und viele mehr

Was kann ich als Webdesigner tun?

Ich kann anfangen umzudenken! Dazu muss ich mich zunächst einmal nur an zwei Grundsätze halten:

  1. Einhalten von Standards
  2. Klare Trennung von Struktur/Inhalt und Layout/Design

Natürlich müssen noch weitere Regeln eingehalten werden. Die beiden oben genannten sind jedoch für mich die Grundlage, auf denen die anderen Punkte aufbauen.

Alle Besucher einer Internetpräsenz können von barrierefreien Webseiten profitieren, da Barrierefreiheit die Benutzerfreundlichkeit einer Website verbessert

Einhalten von Standards

Die Einhaltung eines Standards ist unabdingbar. Dabei ist es jedoch egal, ob man HTML oder XHTML wählt. Die Vorteile bzw. die Unterschiede der zwei sollen an anderer Stelle diskutiert werden. Wichtig ist jedoch das man die Ausprägung strict verwendet. Tomas Caspers erläuterte auf der Webseite von EfA, warum die strikte Variante von HTML 4.01 der Variante transitional von XHTML vorzuziehen sei (Nachzulesen auch hier in diesem Blog:”HTML 4.01 erhält den Vorzug vor XHTML“). Ebenso sollte man sich inzwischen ruhig mit HTML 5 auseinandersetzen. Die HTML 5 Spezifikationen beinhalten etliche Punkte, welche die semantische Auszeichnung der strukturellen Elemente beinhalten, was wiederum eine der dringendsten Forderungen von barrierefreien Webseiten seit jeher ist.

Neben der Einhaltung eines Standards ist es selbstverständlich, dass der (X)HTML Code fehlerfrei ist. Dazu verwendet man am besten einen Validator, der einem bei der Prüfung hilft. Der Markup Validation Service des W3C zum Beispiel ist dafür hervorragend geeignet. Das gleiche gilt für die CSS Dateien. Das W3C bietet auch hierfür einen CSS Validation Service an (Lesen Sie bitte auch Validatoren richtig verstehen).

Dennoch, selbst wenn man größte Sorgfalt bei der Erstellung der eigenen Seite walten lässt und die Validierung durch die Validatoren besteht, so sehen sich viele Websitebetreiber einer fehlerhaften Homepage gegenüber. Viele Websiteersteller peppen ihre Seiten mit fremden Widgets oder Plugins auf, hiervon sind vor allem Betreiber von Blogs und CMS betroffen. Über diese fremden Inhalte schleusen sie oftmals fehlerhaften Quellcode wieder auf die eigene Seite ein. Daher sollte man bevor man überhaupt fremden Inhalt auf seiner Seite einbaut, die eigene Seite zunächst komplett fertig stellen — ohne den fremden Inhalt — um sicherstellen zu können, dass im eigenen Quellcode keine Fehler vorliegen. Kann man das sicherstellen, so kann man beginnen fremde Inhalte nach und nach zu ergänzen. Dabei jedoch immer wieder neu validieren und im Zweifelsfall lieber auf fremden Inhalt verzichten als fehlerhaften Quellcode einzubauen.

Lieber auf fremden Inhalt verzichten als fehlerhaften Quellcode einbauen.

Strukturierung des Inhalts

Eine sinnvolle Strukturierung des Inhalts ist unabdingbar. Eine klare Struktur hilft den Inhalt besser im Rahmen von Accessibility zugänglich zu machen. Dies ist zum einen eine Forderung des barrierefreien Webdesigns, unterstützt aber auch die Optimierung für Suchmaschinen, besser bekannt unter dem englischen Begriff SEO (deutsch: Suchmaschinenoptimierung).

Zur Trennung von Inhalt und Layout gehört im weitesten Sinne auch der bereits genannte Punkt sauberen, reinen und fehlerfreien (X)HTML-Code für die Inhalte zu verwenden (s.o).

Keine Layouttabellen verwenden

Einer der wichtigsten Punkte ist jedoch auf Tabellen als Layouthilfen zu verzichten. Tabellen sollten nur dann verwendet werden, wenn es darum geht Daten in tabellarischer Form zu präsentieren. Vor Jahren benutzte man jedoch Tabellen, um ein Spaltenlayout in (X)HTML umzusetzen. Selbst heute findet diese Technik noch Verwendung. Das Problem dabei ist, dass der lineare Aufbau des Inhalts damit durcheinander gebracht wird. Sehbehinderte Menschen verwenden zum Beispiel Screenreader, die den Inhalt von oben nach unten vorlesen. Treffen Sie eine Tabelle, werden die Zeilen nacheinander vorgelesen und innerhalb einer Zeile von links nach rechts. Dies bedeutet, dass die Inhalte nicht mehr logisch in ihrer gedachten und visualisierten Reihenfolge angeordnet sind.

Inhalte heutzutage ohne Tabellenlayout sinnvoll darzustellen ist kein Problem mehr. Über verschiedene <div>-Tags lässt sich eine Seite sinnvoll strukturieren. In HTML 5 werden sogar spezielle neue Tags eingeführt (<header>, <section>, <article>, <footer>, etc.) um den modernen aktuellen Webseiten gerechter zu werden. Über die entsprechenden Stylesheets lässt sich sogar ein Spaltenlayout realisieren. Das YAML-Framework unterstützt mit seinen speziell entwickelten Stylesheets und einer Vielzahl von Vorlagen tabellenfreies Design. Neben YAML von Dirk Jesse gibt es auch zahlreiche weitere Webseiten, die sich mit tabellenfreiem Design beschäftigen. Einen sehr guten Einstieg in das Thema bietet die Seite Little Boxes von Peter Müller. Teil 1 seiner drei Bücher (Little Boxes Teil 0, Little Boxes Teil 1 und Little Boxes Teil 2) kann man kostenlos online lesen (Little Boxes Teil 1 online lesen).

Formatierung ausschließlich durch CSS

Dieser Punkt schließt direkt an den vorherigen an. Die Struktur und der Inhalt der Webseite werden mit fehlerfreiem, reinen und sauberen (X)HTML-Code aufgebaut. Jegliche Formatierung erfolgt über CSS. Dies heißt vor allem auch, dass keine HTML-Attribute wie color="" oder bgcolor="" verwendet werden. Die Anweisung von CSS können entweder direkt in den HTML-Tags oder im Kopfbereich der Webseite zwischen den <head> </head> Tags erfolgen. Besser ist es jedoch eine eigene Datei mit der Endung *.css zu erstellen und diese über das <link />-Tag einzubinden. Literatur oder Informationen zum Einstieg in CSS finden Sie bei Peter Müller oder bei CSS4You.

Webseiten logisch semantisch aufbauen

Ich hatte bereits im oberen Abschnitt darauf hingewiesen, dass man keine Layouttabellen verwenden soll, da sonst der logische Aufbau der Strukturierung einer Webseite durcheinander gerät. Vielmehr noch, um Webseiten barrierefrei zu gestalten ist es notwendig den Inhalt logisch semantisch strukturiert aufzubauen. Heike Edinger und Timo Wirth erklären das folgendermaßen:

Ganz einfach ausgedrückt, bedeutet semantisches HTML nichts anderes als bedeutungsvolles HTML (Semantik = Lehre der Bedeutung). HTML-Code schreiben heißt somit nichts anderes als Inhalte gliedern, Strukturen schaffen, logische Beziehungen herstellen, Bedeutung markieren. Die HTML-Elemente übermitteln bei semantischem Code nicht wie die Inhalte aussehen sollen, sondern welche Bedeutung oder Funktion sie haben.Quelle: Vorsprung durch Webstandards

Konkret heißt dies, dass ich die HTML-Tags dazu verwende um den Inhalt zu beschreiben und nicht um den Inhalt in einem bestimmten Format auszugeben. Dies bedeutet zunächst einmal dass der Text, den ich schreibe und auf einer Webseite veröffentliche gegliedert gehört. Also teile ich den Text in verschiedene Kapitel, Bereiche oder Abschnitte, diese erhalten je nach ihrer Gliederungsstufe eine Überschrift (Heading), welche mit den entsprechenden <h1>, <h2>, <h3> … Tags ausgezeichnet. Dabei ist es zunächst einmal unwichtig, ob die Überschriften fett oder in verschiedene Größen am Bildschirm angezeigt werden. Stuart Langridge schrieb dazu in seinem 2005 erschienen Buch »DHTML Utopia Modern Web Design Using JavaScript & DOM«:

The way your page looks isn’t really relevant. The import part is that the information in the page is marked up in a way that describes what it is.Quelle: DHTML Utopia Modern Web Design Using JavaScript & DOM

Semantisches Markup wirft aber auch Fragen auf, da es nicht immer eindeutig erscheint, wie Inhalte semantisch ausgezeichnet werden sollen. Heike Edinger und Timo Wirth führen dazu auf Semantischer Code – Definitionen, Methoden, Zweifel als Beispiel die Auszeichnung der in vielen Blogs und CMS verwendeten Breadcrumb Navigation an. Über einen beispielhaften sinnvollen semantischen Aufbau einer Webseite diskutiere ich in einem anderen Artikel.1)

Um sich den strukturierten Inhalt einer Webseite zu betrachten, empfiehlt es sich in seinem Browser alle Stylesheets zu deaktivieren.2) Die nun angezeigte unformatierte Webseite zeigt den Inhalt an, wie ihn auch Screenreader zu sehen bekämen. Die Seite kann nun ziemlich lang werden, da die Inhalte nacheinander dargestellt werden, auch wenn sie sonst im formatierten Zustand nebeneinander stünden. Um hier den Nutzern von Screenreadern entgegenzukommen, sollte man sogenannte Sprungmarken einbauen, die an oberster Stelle des Dokuments stehen. Sie sind Links zu den Hauptbereichen der Webseite, also meistens der Navigation und des Hauptartikels. Man sollte sich mit zwei bis drei Sprungmarken begnügen. Im formatierten Zustand werden diese Sprungmarken über CSS ausgeblendet.

Anforderung an Design und Inhalt

Richtlinien für barrierefreie Webinhalte (WCAG)

Im Mai 1999 wurde die Version 1.0 der Richtlinien für barrierefreie Webinhalte veröffentlicht. Neun Jahre danach, am 11. Dezember 2008 wurde die Version 2.0 (WCAG 2.0) veröffentlicht. Die Version 2.0 versteht sich nicht als eine komplett neugestaltete Version, sondern vielmehr als eine konsequente Ergänzung und Weiterführung der bereits existierenden Version WCAG 1.0. Die neuen Richtlinien der WCAG 2.0 sollen sich einfacher benutzen lassen und sollen besser verständlich sein, dies bedeutet, sie sind weitestgehend auf fortschrittlichere Techniken anwendbar und es lassen sich durch automatisierte Tests (Validatoren) und durch manuelle Evaluation durch Menschen diese Richtlinien prüfen.

W3C-WAI empfiehlt die Benutzung der WCAG 2.0 statt der WCAG 1.0. Quelle: W3C

Doch was enthalten diese Richtlinien. Die Deutsche Behindertenhilfe Aktion Mensch e.V. hat die offizielle deutsche Übersetzung der WCAG 2.0 der W3C-WAI beigesteuert. Diese kann über die Website der EfA oder direkt beim W3C nachgelesen werden.

Vier maßgebliche Punkte müssen im Rahmen der WCAG 2.0 erfüllt sein. Eine Webseite ist barrierefrei, wenn sie die folgenden vier Prinzipien erfüllt: Sie muss wahrnehmbar, bedienbar, verständlich und robust sein. Den vier Prinzipien sind insgesamt 12 Richtlinien untergeordnet

  1. Wahrnehmbar

    • Stellen Sie Textalternativen für Nicht-Text-Inhalte zur Verfügung.
    • Stellen Sie Untertitel und Alternativen für Audio- und Videoinhalte zur Verfügung.
    • Sorgen Sie dafür, dass Inhalte anpassbar sind; sorgen Sie außerdem dafür, dass sie für assistierende Techniken verfügbar sind.
    • Benutzen Sie einen ausreichenden Kontrast, damit Dinge leicht zu sehen und zu hören sind.
  2. Bedienbar

    • Sorgen Sie dafür, dass alle Funktionalitäten per Tastatur zugänglich sind.
    • Geben Sie den Benutzern ausreichend Zeit, Inhalte zu lesen und zu benutzen.
    • Benutzen Sie keine Inhalte, die zu Anfällen führen können.
    • Helfen Sie Benutzern dabei, zu navigieren und Inhalte zu finden.
  3. Verständlich

    • Sorgen Sie dafür, dass Text lesbar und verständlich ist.
    • Sorgen Sie dafür, dass Inhalte vorhersehbar aussehen und funktionieren.
    • Helfen Sie Benutzern dabei, Fehler zu vermeiden und zu korrigieren.
  4. Robust

    • Maximieren Sie die Kompatibilität mit aktuellen und zukünftigen Techniken.

Erläuterung der einzelnen Punkte

Textalternativen:

In der BITV ist dies unter der ersten Bedingung festgelegt. Allen Nicht-Text-Elementen (Bilder, graphisch dargestellten Text einschließlich Symbolen, Regionen von Imagemaps, Animationen (z. B. animierte GIFs), Applets und programmierte Objekte, Zeichnungen, die auf der Verwendung von Zeichen und Symbolen des ASCII-Codes basieren (ASCII-Zeichnungen), Frames, Scripts, Bilder, die als Punkte in Listen verwendet werden, Platzhalter-Graphiken, graphische Schaltflächen, Töne (abgespielt mit oder ohne Einwirkung des Benutzers), Audio-Dateien, die für sich allein stehen, Tonspuren von Videos und Videos) ist ein äquivalenter Text bereitzustellen. Ziel ist es, äquivalente Inhalte bereitzustellen, die den gleichen Zweck oder die gleiche Funktion wie der originäre Inhalt erfüllen.

Beispiel:

Grafiken und Bilder werden in (X)HTML über das <img>-Tag eingefügt. Innerhalb des Tags steht Ihnen das Attribut alt="" zur Verfügung. An diese Stelle sollte ein Text stehen, der Anstelle der Grafik angezeigt werden kann. Eine beschreibende Erläuterung der Grafik gehört hingegen in das Attribut title=""

Barrierefreie Webseiten müssen wahrnehmbar, bedienbar, verständlich und robust sein.

Untertitel und Alternativen:

Hierunter versteht man, dass eine Audio-Beschreibung der wichtigsten Informationen der Videospur bereitzustellen. Bei Videos mit Tonspur sind Untertitel notwendig, die den Inhalt beschreiben bzw. erläutern. Untertitel sind hingegen nicht notwendig, wenn das Video keine Audiospuren enthält oder das Video nur als Ergänzung zu einem textbasierten Inhalt zu sehen ist.

Anpassbar:

Inhalte sollen auf verschiedene Arten dargestellt werden können (zum Beispiel einfacheres Layout), ohne dass Informationen oder Struktur verloren gehen. Diese Richtlinie knüpft direkt an den bereits weiter oben erörterten Punkt »Webseiten logisch semantisch aufbauen« an.

Ausreichenden Kontrast:

Inhalte müssen unterscheidbar sein. Benutzern muss es leicht gemacht werden, Inhalt zu sehen und zu hören einschließlich der Trennung von Vorder- und Hintergrund. Hierzu gehören zum einen der ausreichende Kontrast zwischen Inhalt und Hintergrund. Dabei sollte das Kontrastverhältnis von Text und Bildern von Text mindestens 4,5 : 1 sein; mit der Ausnahme, dass bei großem Text oder Bildern vom großen Text ein Kontrastverhältnis von 3 : 1 ausreicht.

Zu diesem Punkt »Unterscheidbar« wird auch die skalierbare Größe von Text hinzugezählt. Text muss ohne assistierende Technik um bis zu 200 Prozent geändert werden können, ohne dass dabei Inhalt oder Funktionalität verloren geht.

Tastaturzugänglichkeit:

Folgende Gesichtspunkte sind dabei zu beachten. Es sollten die (X)HTML role="", state="" und value="" Atrribute verwendet werden, wenn statische Elemente als interaktive Bestandteile der Benutzeroberfläche zu einem neuen Zweck genutzt werden. Es sind Tastaturkurzbefehlen zu wichtigen Links und Steuerelementen von Formularen bereitzustellen, zum Beispiel über das Attribut accesskey=""). Es sollten einzigartiger Buchstabenkombinationen verwendet werden, um jeden Punkt einer Liste zu beginnen. Vermeiden Sie es in Browsern gängige Tastaturbefehle für andere Zwecke zu benutzen (zum Beispiel sollte die Taste »F1« immer für die Hilfefunktion verwendet werden und nicht für eigene Aktionen auf der Webseite missbraucht werden).

Ausreichend Zeit:

Benutzer dürfen ihre eigene Zeiteinteilung wählen. Dabei ist zu beachten, dass bei zeitgesteuerten Events, der Anwender durch einfache Gesten, ein Ablaufen der Zeit unterbrechen bzw. ausdehnen kann. Ausnahmen sind hier zum Beispiel Auktionen.

Anfälle:

Inhalte sind derart zu gestalten, dass sichergestellt ist, es ist keine der Arten, von denen bekannt ist, dass sie zu Anfällen führen. Dies bedeutet, dass Webseiten nichts enthalten, das öfter als dreimal in einem beliebigen, eine Sekunde dauernden Zeitraum blitzt.

Navigieren und Inhalte finden:

Inhaltsblöcke, die auf verschiedenen Webseiten wiederholt werden, sollten über geeignete Mittel umgangen werden können. Dies kann zum Beispiel mit der sogenannten Skiplink-Navigation umgesetzt werden.

Webseiten haben einen Titel, der Thema oder Zweck beschreibt, welches sich in dem weiter oben beschriebenen Punkt »Webseiten logisch semantisch aufbauen« wieder findet.

Wenn Webseiten inhaltlich von einander abhängen bzw. auf einander aufbauen, erhalten fokussierbare Komponenten den Fokus in einer Reihenfolge, der Bedeutung und Bedienbarkeit aufrecht erhält.

Der Zweck jedes Links kann durch den Linktext allein oder durch den Linktext zusammen mit seinem durch Software bestimmten Link-Kontext bestimmt werden.

Es gibt Informationen zu der Position des Benutzers innerhalb eines Satzes von Webseiten, welches am Besten mit der sogenannten Breadcrumb-Navigation umgesetzt werden kann.

Abschnittsüberschriften werden genutzt, um den Inhalt zu gliedern.

Lesbar und verständlich:

Die voreingestellte menschliche Sprache jeder Webseite und jedes Abschnitts oder jedes Satzes im Inhalt kann durch Software bestimmt werden. Ausnahmen sind Eigennamen, technische Fachbegriffe, Wörter einer unklaren Sprache und Wörter oder Wendungen, die Teil des Jargons des direkt umliegenden Textes geworden sind. Solche Stellen lassen sich über das Attribut lang="" in den vorhandenen Tags eines Inhaltsabschnittes oder in dem neutralen Tag <span> angeben.

Spezielle Definitionen von Wörtern oder Wendungen, die auf ungewöhnliche oder eingeschränkte Weise benutzt werden, sollten erkennbar gemacht werden; dies gilt auch für Idiome und Jargon. Hier lassen sich Erläuterungen zum Beispiel über das title="" Attribut ergänzen oder es werden Links zu Definitionslisten oder Wörterbüchern im Internet angeboten

Die ausgeschriebene Form oder Bedeutung von Abkürzungen muss kenntlich gemacht werden. Hierfür eignen sich am Besten die in (X)HTML vorgesehen Tags <abbr> und <acronym>.

Bestimmte Aussprache von Wörtern muss ebenso erkennbar sein, wenn die Bedeutung der Wörter — im Zusammenhang — mehrdeutig ist, wenn man die Aussprache nicht kennt. Hier hilft ggf. die Bereitstellung der Aussprache in einer Sprachlaut-Datei, so dass sich Benutzer die Aussprache des Wortes anhören können.

Vorhersehbar:

Anhaltender Änderungen der Attribute state="" oder value="" dürfen nicht ausgelöst werden, wenn ein Bestandteil den Fokus erhält. Zumindest muss eine alternative Möglichkeit gewährleistet sein, jegliche Änderungen wieder zurück zu setzen.

Neue Fenster sollten nur geöffnet werden, wenn dies aus Sicht der Barrierefreiheit am Besten ist. In jedem Fall muss der Benutzer, wenn ein neues Fenster geöffnet wird, vorgewarnt werden.

Bestandteile mit der gleichen Funktionalität innerhalb eines Satzes von Webseiten werden konsistent erkannt, dazu gehören auch vor allem die Navigationselemente.

Fehler vermeiden und korrigieren:

Hier geht es vor allem darum, den Anwender zu unterstützen Fehler zu vermeiden und falls doch ein Fehler anwenderseitig gemacht wird diesen unproblematisch korrigieren zu können. Dabei spielt die Fehlererkennung eine wichtige Rolle. Anwendern sollte es leicht gemacht werden, zu den Fehlern zu springen. Bei abgeschickten Formularen muss eine Gültigkeitsprüfung auf dem Server erfolgen. Dies ist unabhängig davon, ob bereits eine clientseitige Prüfung erfolgt ist oder nicht. Tritt ein Fehler durch das Senden eines Formulars auf, sollte dies erneut mit einer Zusammenfassung der Fehler angezeigt werden. Bereits eingegebene Daten sollten nach Möglichkeit erhalten bleiben. Vorteilhaft ist eine Benachrichtigungen über Fehler während der Anwender Informationen eingibt. Dem Anwender sollte geholfen werden, Korrekturen zu machen, indem Links zu jedem Fehler angeboten werden. Hervorhebung oder visuelles Herausstellen von Fehlern dort, wo sie auftreten zum Beispiel über spezielle Klassen in den Stylesheets. Text kann durch Nicht-Text-Inhalt ergänzt werden, wenn Fehler gemeldet werden. Sollten Formulardaten erfolgreich gesendet worden sein, so sollte unbedingt eine Meldung, über das erfolgreich Versenden der Daten ausgegeben werden.

Ebenso sollte eine kontextsensitive Hilfe auf der Website angeboten werden. Vor allem bei Texteingaben in Formularen sollte ein Hilfe-Link auf jeder Webseite bereitgestellt werden, ebenso kann Hilfe durch einen Assistenten auf der Webseite erfolgen. Zusätzlich sollte eine Rechtschreibprüfung und Vorschläge für die Texteingabe erfolgen. Schließlich werden Textanweisungen zu Beginn eines Formulars oder eines Satzes an Feldern, welche die notwendigen Eingaben beschreiben, angeboten. Zusätzlich ist bei bestimmten erwarteten Datenformaten ein Beispiel des erwarteten Datenformats anzugeben.

Kompatibilität:

Die Kompatibilität kann maximiert werden durch die Berücksichtigung aktueller und zukünftiger Browser, einschließlich assistierender Techniken. Vermieden werden sollten unbedingt abgelehnte Funktionen von W3C-Techniken. Ebenso sollte Inhalte nicht dargestellt werden, die auf Techniken angewiesen sind, die nicht die Barrierefreiheit unterstützend sind, wenn die Technik abgeschaltet oder nicht unterstützt wird. Hierbei gilt es besonders JavaScript oder Flash zu berücksichtigen.

Es gibt keinen Grund keine barrierefreien Webseiten zu gestalten!

Was machen wir nun daraus?

Es gibt keinen Grund Webseiten nicht barrierefrei zu gestalten. Die Trennung von Inhalt und Layout wird heutzutage zumeist sowieso eingehalten, da die größte Anzahl der Webseiten auf CMS oder Blogsysteme zurückzuführen sind, die dies generell umsetzen. Eine Berücksichtigung semantisch logischer Auszeichnungen erfordert hingegen für viele ein Umdenken oder zumindest eine konsequentere Umsetzung ihrer (X)HTML Fertigkeiten. Hierbei unterstützen uns die Richlinien der WCAG 2.0. Die 12 Richtlinien sind im Prinzip generell gut verständlich. Jedoch liegen sie zumeist nur in der Form des W3C oder einer der offiziellen Übersetzungen vor und sind damit recht formal und schlecht lesbar. Auf der anderen Seite ist es eigentlich recht simpel, sofern man sich einmal damit auseinandergesetzt hat.

Fußnoten

  1. Der Artikel ist noch nicht veröffentlicht. (zurück zum Text)
  2. Im Firefox können Sie über das Menü Ansicht > Webseiten-Stil > Kein Stil alle Stylesheets deaktivieren. Leichter geht es noch über die Firefox Erweiterung Webdevelopper Toolbar. (zurück zum Text)
Ihre Mitteilung