allerlayEin wesentlicher Unterschied zwischen den WCAG 2.0 und den WCAG 2.1 ist: Viele Erfolgskriterien der WCAG 2.0 konnte man mit Software automatisiert prüfen. Die neuen Kriterien erfordern jedoch manuelle Tests. Webangebote und das Nutzerverhalten sowie Anforderungen an die Bedienbarkeit haben sich in den vergangenen Jahren stark verändert. Die neuen Erfolgskriterien werden diesem Wandel gerecht und sollen helfen, dass Websites und Apps besser zugänglich werden für Menschen mit Sehbehinderung, Lernschwierigkeiten und kognitiven Behinderungen.
In diesem Blogbeitrag will ich besonders jene Erfolgskriterien erläutern, die den Konformitätsstufen A und AA entsprechen. Es handelt es also um Kriterien, die von Behörden und Unternehmen erfüllt sein müssen.
WCAG 2.1 Erfolgskriterien und was sie in der Praxis bedeuten
Ausrichtung (Orientierung) (AA)
Das Erfolgskriterium «Orientierung» bezieht sich darauf, wie deine Website auf einem mobilen Gerät angezeigt wird und wie User darauf zugreifen können. Websites und Apps sollten sowohl die Ausrichtung im Querformat als auch im Hochformat unterstützen. Dadurch ist sichergestellt, dass User eine Website auch dann einwandfrei lesen können, wenn deren Geräte auf einer Erhöhung oder auf eine andere Art und Weise montiert ist.
Identifizieren Sie den Verwendungszweck (AA)
Sind Formularfelder korrekt ausgezeichnet, erleichterst du dem Besucher das Ausfüllen und ermöglichst AutoComplete, also die automatische Eingabe von beispielsweise Namen, Adressen, Telefonnummer oder Geburtstag. Ist der Verwendungszweck identifiziert, wechseln Smartphones zudem automatisch zur Nummerntastatur, wenn beispielsweise eine Telefonnummer gefordert ist.
Vergrösserungen (AA)
Bestimmt hast auch du schon von einem mobilen Gerät aus eine Website besucht, dessen Text sich nicht an die Bildschirmgrösse anpasst. Dies führt zu mühsamen Zoomen und Scrollen, und zwar nicht nur vertikal, sondern auch horizontal. Das nervt und ist für User, die eine starke Vergrösserung nutzen, noch frustrierender. Sorge deshalb bei der Gestaltung der Website für eine dynamische Anpassung des Inhalts an die Bildschirmbreite. Auf diese Weise müssen User nur vertikal scrollen.
Nicht-textueller Kontrast (AA)
Ausreichende Kontrastverhältnisse gehören zu den wichtigsten Kriterien der WCAG. Abhängig von der Textgrösse müssen Hintergrund und Text ein Mindest-Kontrastverhältnis von 3:1 oder 4.5:1 aufweisen. Die WCAG 2.1 gehen einen Schritt weiter: Auch Schaltflächen, Verknüpfungen, Formularsteuerelemente und Grafiken müssen ein Verhältnis von 3:1 aufweisen.
So muss zum Beispiel ein «X»-Symbol, das zum Schliessen eines Fensters dient, einen genügenden Kontrast zum Hintergrund aufweisen.
Bei Grafiken müssen jene Teile ein Mindestverhältnis von 3:1 aufweisen, die inhaltlich relevant sind. Dies gilt beispielsweise für Diagramme, Symbole und andere inhaltsvermittelnde Grafiken.
Textabstände (AA)
Mit diesem Erfolgskriterium stellen die WCAG 2.1 sicher, dass User den Abstand zwischen Absätzen, Wörtern und Buchstaben sowie die Zeilenhöhe individuell anpassen können, ohne die Funktionalität der Website zu verlieren.
Inhalte bei Hover oder Tastaturfokus (AA)
Auf vielen Websites werden zusätzliche Informationen angezeigt, sobald man den Mauszeiger über eine Grafik oder ein andere Element bewegt. Für manche Anwender kann dies störend sein. Unter WCAG 2.1 muss es eine Funktion geben, um den zusätzlichen Inhalt zu schliessen. Zudem muss der Inhalt so lange angezeigt werden, bis der Anwender das Fenster aktiv schliesst. Dadurch ist sichergestellt, dass der User ausreichend Zeit hat, um den Inhalt zu lesen. Dies ist insbesondere für User mit einer Lernbehinderung wichtig.
Zwischenfazit
Obwohl die WCAG 2.1 der Web-Accessibility dienen, helfen die neuen Kriterien, deine Website und Apps für alle User besser bedienbar und attraktiver zu machen. Denn bei Accessibility geht es um eine inklusive Website-Gestaltung. Weitere Kriterien der WCAG 2.1 sind:
- Tastaturbefehle (A)
- Pointer-Gesten (A)
- Pointer-Eingaben (A)
- Sichtbare Beschriftungen (A)
- Bewegungsbestätigung (A)
- Statusmeldungen (AA)
Auf die weiteren Kriterien der WCAG 2.1 werde ich in einem nächsten Blogpost eingehen.