Accessible Rich Internet Applications

WAI-ARIA (Web Accessibility Initiative - Accessible Rich Internet Applications) ist eine rein semantische Erweiterung für HTML, die das Layout von Webseiten nicht verändert.

Konzept und Funktionsweise

ARIA ist als technische Spezifikation im Entwurfsstadium. Sie wird von Mitgliedern der Web Accessibility Initiative entwickelt, und soll ein empfohlener Webstandard des World Wide Web Consortiums (W3C) werden.^[1]

ARIA macht mit JavaScript und Ajax angereicherte Webseiten und Webanwendungen besser für behinderte Menschen zugänglich, insbesondere für blinde Nutzer von Screenreadern. Die Barrierefreiheit dynamischer Seiten wie im Web 2.0 mit seinen Rich Internet Applications und die allgemeine Benutzerfreundlichkeit können so verbessert werden.

ARIA ermöglicht es Webseiten (oder Teilen einer Seite), sich als Anwendungen zu bezeichnen anstatt als statische Seiten. Dazu werden in dynamischen Webanwendungen Informationen zu Rollen, Eigenschaften und Zuständen hinzugefügt. ARIA ist zur Benutzung durch Entwickler von Webanwendungen, Browsern, assistiven Technologien und Programmen zur Verifizierung von Barrierefreiheit vorgesehen.

Die 4 Säulen von WAI ARIA:

1. Landmark Roles erlauben die semantische Zuweisung einer Rolle bei HTML-Konstrukten. Hiermit können Elemente, die es in HTML so eigentlich nicht gibt, für Screenreader kenntlich gemacht werden. Beispiele sind Slider, Tree Views usw.
2. Einfache ARIA Attribute wie aria-required oder aria-invalid lassen sich für alle HTML-Elemente verwenden und können beispielsweise dafür genutzt werden, ein Eingabefeld als ungültig zu markieren, wenn z. B. in einer E-Mail-Adresse kein @-Zeichen vorkommt, ein zweimal eingegebenes Kennwort nicht übereinstimmt^[2]
3. Live Regions sind Teile einer Seite, die sich in unregelmäßigen Abständen aktualisieren. Diese Veränderungen können bei implementiertem ARIA von Screenreadern automatisch erkannt und gesprochen werden.
4. States und Properties werden für richtige JavaScript-Widgets verwendet (wie beispielsweise bei einer aus divs bestehenden Liste mit Optionen. Activedescendant wird z. B. benutzt, um das jeweils fokussierte Element auszuweisen, so dass in einem Popup-Menü, einer Liste usw. immer das aktive Element verfolgt werden kann. Die Tastaturnavigation muss bei eigenen JavaScript-Widgets selbst implementiert werden. ARIA ist nur eine semantische Erweiterung, die Informationen zur Verfügung stellt, selbst aber keine weiteren funktionalen Erweiterungen ermöglicht. Wenn jemand also z. B. in einer mit Divs aufgebauten Liste mit den Pfeiltasten navigieren will, muss er dies selbst implementieren und mit ARIA dann immer das fokussierte Element mitteilen.

Implementierung in Browser

Im Browser Firefox 3 von Mozilla wurde der kommende Accessibility-Standard bereits implementiert, während man bei Opera und dem als Grundlage für den Safari-Browser dienenden WebKit daran arbeitet. Microsoft bemüht sich, die Version 8 des Internet Explorers damit aufzurüsten. Nicht-ARIA-fähige Browser wie der IE7 ignorieren die semantischen Erweiterungen komplett und werden nicht in ihrer Funktionalität beeinträchtigt.

ARIA validiert im Moment nicht mit Standard-XHTML-1.0-Validatoren. ^[3] Das W3C weiß darum und sucht zur Zeit nach einer für alle Seiten vertretbaren Lösung. Das Entwicklerteam von WordPress hat bewusst entschieden, auf die XHTML-1.0-Validierung zu verzichten und stattdessen den Fortschritt mitzumachen. ^[4]

ARIA wurde bereits in der Version 1.0 im Dojo Toolkit implementiert. Bei jQuery und dem Yahoo! UI Toolkit wird daran gearbeitet. Bei Google Mail hat man angefangen, ARIA in die englischsprachige Benutzerschnittstelle zu integrieren. ^[5]

Siehe auch

• Universal Design
• Barrierefreies Internet
• Web Content Accessibility Guidelines

Weblinks

• W3C-Überblick zu WAI ARIA
• Aaron Leventhal von IBM/Mozilla über ARIA (deutschsprachige Übersetzung
• Introduction to WAI ARIA von Gez Lemon im Opera-Entwicklerblog (deutschsprachige Übersetzung)
• Beiträge zu ARIA in Marco's Accessibility Blog
• Beiträge zu ARIA im Blog der Paciello Group
• Henny Swan: Setting up a screen reader test environment

Einzelnachweise

1. ↑ Accessible Rich Internet Applications (WAI-ARIA) Version 1.0
2. ↑ über aria-invalid und role alerts, Marco Zehe
3. ↑ Roger Johansson über Validierungsprobleme
4. ↑ Marco Zehe über die Implementierung von ARIA bei WordPress
5. ↑ Gmail und ARIA: Enhancing the Chat experience

Standards des World Wide Web Consortiums

Empfehlungen (Recommendations): ATAG | Canonical XML | CSS | CharMod | CC/PP | DDR Simple API | DOM | EXI | Element Traversal | EMMA | GRDDL | HTML | ITS | MathML | OWL | P3P | PICS | PLS | PNG | POWDER | RDF | RDF-Schema | Ruby | SISR | SKOS | SML | SMIL | SOAP | SOAP MTOM | SPARQL | SRGS | SSML | SVG | SSML | UAAG | VoiceXML | WCAG | Webarch | WebCGM | WSDL | WS-Adressing | WS-Policy | XHTML | XML | XInclude | XKMS | XLink  | XML Base | XMLEnc-Decrypt | XML Events | XML Information Set | XML Namespace | XML Schema | XML Signature | XOP | XForms | XPath | XPointer | XProc | XQuery | XSL | XSLT

Arbeitsentwürfe (Working Drafts) und Kandidaten (Candidate Recommendations): Capture API | CCXML | CDF | Clipboard API | Contacts API | Cross-Origin Resource Sharing | CURIE | EARL | File API | HTML5 | HTML Canvas | HTML Microdata | Indexed Database API | InkML | LTLI | RIF | Selectors API | System Information API | WAI-ARIA | Web IDL | Web Sockets API | Web SQL Database | WICD | Widgets | XFrames | XBL