EU-Richtlinie 2102

Die europaweite Harmonisierung von Webstandards zur Barrierefreiheit

Die Europaflagge mit Fanfaren und der Beschriftung 2016/2102

Im letzten Dezember trat die EU-Richtlinie 2016/2102 des Europäischen Parlaments und des Rates über den barrierefreien Zugang zu den Websites und mobilen Anwendungen öffentlicher Stellen in Kraft. Innerhalb von 21 Monaten sollen die Mitgliedsstaaten harmonisierte Standards der Barrierefreiheit in nationales Recht umsetzen.

zum Beitrag »

jQuery

Die Barrierefreiheit bleibt von der JS-Bibliothek unberührt

Das Logo von jQuery mit einigen Zahnrädern.

Die Frage, ob jQuery barrierefrei ist, wird immer wieder gestellt. Dabei ist jQuery nicht das Entscheidende für die Barrierefreiheit, sondern es kommt auf das HTML an. jQuery ist eine JavaScript-Bibliothek, die Entwicklern vereinfachte Funktionen bietet, um den DOM des Browsers zu manipulieren. Barrierefreiheit (im Code einer Webseite) hängt aber von den Elementen und Attributen im DOM des Browsers ab.

zum Beitrag »

Auf zur barrierefreien Version

Was die WCAG 2.0 und die BITV 2.0 zu Accessibility-Overlays sagen

Eine verschwommene Darstellung von vielen Schaltern und Schiebereglern

Ansätze zum barrierefreien Webdesign gibt es viele. Zuletzt habe ich eine Anwendung untersucht, die ein Interface für Autoren bereitstellt, um Weboberflächen nachträglich barrierefrei zu gestalten. Dabei konnten neben einem Kontrastschema auch weitere Profile für die Tastaturbedienung oder zum Ausschalten von blinkendem Inhalt gewählt werden; Das Profil legte sich einfach als „Accessibility-Overlay“ über die bestehende Webseite. Die Idee ist einfach, aber Nutzer müssen die Erweiterungen per Style-Switcher aktivieren. Außerdem stellt sich die Frage, ob solche Accessibility-Overlays Konformität zu den Web Content Accessibility Guidelines (WCAG) 2.0 bzw. zur Barrierefreien Informationstechnik-Verordnung – BITV 2.0 herstellen können.

zum Beitrag »

Wieder da

Zwei öffentlichkeitswirksame Ereignisse

2 Logos: Lean DUS und Spiegel-Online

Seit über einer Woche bin ich wieder aus dem Urlaub zurück. Jetlag und Termine haben aber dazu geführt, dass ich nur langsam wieder in den Trott gekommen bin. Letzte Woche war insofern öffentlichkeitswirksam, als eine dpa-Meldung über Barrierefreiheit in verschiedenen Medien erschienen ist und eine Veranstaltung in Düsseldorf unerwartet viele Besucher anlockte.

zum Beitrag »

Shadow

D’Hardest

Weitermachen – ich bin dann mal weg

ARIA schlägt HTML

Aria-label bei verlinkten Grafiken

4 Platzhalter-Avatare

Webseiten berücksichtigen heute zunehmend Accessible Rich Internet Applications (ARIA). Eine Beobachtung der letzten Jahre ist aber der überflüssige Einsatz von ARIA-Attributen. Es beginnt bei redundanten Auszeichnungen wie <button role=“button“>, was im Prinzip harmlos ist, und endet bei <body role=“application“>, was in vielen Situationen dazu führt, dass eine Webseite von Screenreadern nicht mehr gelesen werden kann. Eine weitere Problematik, die in nachfolgenden Beitrag diskutiert wird, ist dass ARIA-Attribute zur Bezeichnung von Elementen vergleichbaren HTML-Techniken überlegen sind.

zum Beitrag »

Neues in ARIA 1.1 #3

Ein <form> Element als Seitenregion festlegen

Ein Stift liegt auf einem Formular, der Stift ist mit 'aria-label oder aria-labelledby' bedruckt.

Bereits in Accessible Rich Internet Applications (ARIA) 1.0 wurde die Rolle „form“ als „landmark role“ definiert. Allerdings war das nicht übertragbar auf das HTML-Element <form>. In ARIA 1.1 werden <form> Elemente auch als Seitenregionen bestimmt werden können.

zum Beitrag »

Xylaroo

Sunshine

Einen guten Start in den Tag

Vier Typen von Textalternativen

Und immer ist der Zweck der Grafik anzugeben

Die 4 Asse eines Kartenspiels mit funktionalem, identifizierenden, beschreibenden und leerem Alternativtext

Grafiken jeder Art benötigen eine Textalternative, die den Zweck der Grafik angibt. Grundsätzlich ist dabei zwischen funktionalen, identifizierenden, beschreibenden und leeren Textalternativen zu unterscheiden:

  1. Funktionale Textalternativen kommen für aktive Elemente wie Links oder Formularelemente, die eine Grafik enthalten, in Frage. Genauer gesagt muss der Name des aktiven Elements den Zweck des aktiven Elements angeben. Grafiken, die eine Kontextänderung oder einen Status anzeigen, benötigen dabei Textalternativen.
  2. Identifizierende Textalternativen geben in knappen Worten den Zweck einer Grafik wieder. Identifizierende Textalternativen kommen insbesondere für illustrierende Grafiken in Frage, die einen geringeren Informationsgehalt haben oder deren Informationsgehalt bereits im umgebenden Text beschrieben wurde.
  3. Beschreibende Textalternativen kommen für informative Grafiken in Frage, die – wenn sie nicht angezeigt werden – dazu führen, dass wesentliche Inhalte der Seite fehlen. Da eine beschreibende Textalternative nicht immer in knappen Worten (1-2 Sätzen) formuliert werden kann, müssen im Bedarfsfall kurze (identifizierende) Textalternativen mit langen Beschreibungen kombiniert werden.
  4. Schließlich können leere Alternativtexte für dekorative Grafiken eingesetzt werden, damit in Hilfsmitteln wie Screenreader die Grafiken ignoriert werden können. Alternativ zu einem leeren Alternativtext kommen auch CSS- oder ARIA-Techniken in Frage.

zum Beitrag »