imported>Carolin: -Kategorie:Barrierefreiheit, +Kategorie:Digitale Barrierefreiheit

2025-03-09T12:09:58Z

-Kategorie:Barrierefreiheit, +Kategorie:Digitale Barrierefreiheit

Neue Seite

'''WAI-ARIA''' ({{lang|en|'''''W'''eb '''A'''ccessibility '''I'''nitiative – '''A'''ccessible '''R'''ich '''I'''nternet '''A'''pplications''}}) ist eine Initiative zur Verbesserung von Webseiten und [[Webanwendung]]en, um sie für Menschen mit Behinderungen besser zugänglich zu machen, insbesondere für blinde Anwender, die [[Screenreader|Vorleseprogramme]] verwenden.

ARIA ist eine technische Spezifikation, die von Mitgliedern der {{lang|en|[[Web Accessibility Initiative]]}} entwickelt wurde. Seit März 2014 ist ARIA ein empfohlener Webstandard des {{lang|en|[[World Wide Web Consortium]]}} (W3C).<ref>[https://www.w3.org/TR/2014/REC-wai-aria-20140320/ Accessible Rich Internet Applications (<abbr>WAI-ARIA</abbr>) 1.0] auf der Website des [[World Wide Web Consortium]], abgerufen am 14. Juni 2014</ref>

== Konzept und Funktionsweise ==

ARIA verwendet die Techniken [[JavaScript]] und [[Ajax (Programmierung)|Ajax]]. ARIA ist eine rein [[Semantic Web|semantische]] Erweiterung für [[HTML]], die das Layout einer [[Webseite]] nicht verändert. Die [[Barrierefreies Internet|Barrierefreiheit]] dynamischer Seiten wie im [[Web 2.0]] mit seinen [[Rich Internet Application]]s und die allgemeine [[Benutzerfreundlichkeit#Web-Usability|Benutzerfreundlichkeit]] können so verbessert werden.

ARIA ermöglicht Webseiten (oder Teilen einer Seite), sich als [[Anwendungsprogramm|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, [[Webbrowser|Browsern]], [[Unterstützungstechnologie|assistiven Technologien]] und Programmen zur Verifizierung von [[Barrierefreiheit]] vorgesehen.

WAI-ARIA besteht aus vier Komponenten:

; {{lang|en|Landmark Roles}}
: erlauben die semantische Zuweisung einer Rolle zu HTML-Konstrukten. Dadurch kann für Screenreader die Aufgabe eines Oberflächenelements kenntlich gemacht werden, die sich aus den HTML-Elementen selbst nicht erschließt. Beispiele sind [[Slider (Computer)|Slider]] (Schieberegler) oder [[Baum (Steuerelement)|Bäume]]. Für einige dieser Rollen gibt es seit [[HTML 5]] auch dezidierte HTML-Elemente.
; ARIA-Attribute
: ARIA definiert einige zusätzliche [[SGML-Attribut|Attribute]] wie <code>aria-required</code> oder <code>aria-invalid</code>, die sich für alle HTML-Elemente verwenden lassen. Sie lassen sich beispielsweise dafür verwenden, den Inhalt eines Eingabefeldes als ungültig zu markieren, etwa wenn in einer E-Mail-Adresse kein [[@]]-Zeichen vorkommt oder zwei Eingaben eines Kennworts (zur Bestätigung) nicht übereinstimmen.<ref>Marco Zehe: {{Webarchiv |url=https://www.zehe-edv.de/2008/07/19/einfaches-aria-tip-2-aria-invalid-und-role-alert/ |text=Einfaches ARIA Tip #2: aria-invalid und role „alert“ |wayback=20170317235641}} auf der Website zehe-edv.de, 19. Juli 2008</ref>
; {{lang|en|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.
; {{lang|en|States und Properties}}
: werden für richtige JavaScript-[[Widget]]s verwendet (wie beispielsweise einer aus <code>div</code>-Elementen bestehenden Liste von Optionen), um semantisch bedeutsame Eigenschaften des jeweils aktuellen Zustands auszuzeichnen. Beispielsweise muss die Tastaturnavigation inklusive der Hervorhebung des gerade aktiven Elements bei eigenen JavaScript-{{lang|en|Widgets}} selbst implementiert werden. Damit die Information, welches Element gerade aktiv ist, nicht nur optisch durch Hervorhebung, sondern etwa auch Navigationshilfen für Sehbehinderte zur Verfügung steht, kann mit <code>activedescendant</code> das aktuell fokussierte Element ausgewiesen werden. ARIA stellt als semantische Erweiterung einen Standard für die Auszeichnung solcher Informationen zur Verfügung.

== Siehe auch ==
* {{lang|en|[[Universal Design]]}}
* {{lang|en|[[Web Content Accessibility Guidelines]]}}

== Weblinks ==
* [https://www.w3.org/WAI/standards-guidelines/aria/ W3C-Überblick zu WAI ARIA] (englisch)
* Aaron Leventhal: {{Webarchiv |url=http://barrierekompass.de:80/aktuelles/detail/barrierefreie-web-20-anwendungen-mit-wai-aria.html |text=Barrierefreie Web 2.0 Anwendungen mit WAI ARIA |wayback=20140416151844}} auf der Website barrierekompass.de, anatom5 perception marketing GmbH, 30. Juli 2007 (deutschsprachige Übersetzung)
* Gez Lemon: [https://www.hessendscher.de/wai-aria/ Einführung in <abbr>WAI</abbr> <abbr>ARIA</abbr>] auf der Website hessendscher.de, 1. August 2008 (deutschsprachige Übersetzung vom 27. Februar 2009 von Stefan Walter)
* Marco Zehe: {{Webarchiv |url=http://www.marcozehe.de/category/aria/ |text=Marco's Accessibility Blog. Category: ARIA |wayback=20171201040355}} auf der Website marcozehe.de (englisch)
* {{Webarchiv |url=http://www.paciellogroup.com/blog/category/wai-aria |text=Blog posts in the category: WAI-ARIA |wayback=20150901093851}} auf der Website paciellogroup.com (englisch)

== Einzelnachweise ==
<references />

{{Navigationsleiste W3C-Standards}}

[[Kategorie:Digitale Barrierefreiheit]]
[[Kategorie:Web-Entwicklung]]
[[Kategorie:Blindenhilfsmittel]]

Accessible Rich Internet Applications - Versionsgeschichte

imported>Carolin: -Kategorie:Barrierefreiheit, +Kategorie:Digitale Barrierefreiheit