Welche Behinderungen/ Beeinträchtigungen gibt es?

2.1 (Altersbedingte) Sehschwächen

Nicht nur auf komplett blinde Menschen gilt es, acht zu nehmen. Schon eine altersbedingte oder angeborene Sehschwäche kann dazu führen, dass viele Webseiten für eine solche Person schlechter zugänglich sind.

Welche Probleme haben solche Personen also auf nicht barrierefreien Webseiten?

2.1.1 Angenehme Schriftgröße

Die Schriftgröße der einzelnen Elemente einer Webseite sollte so angegeben sein, dass ein Vergrößern der Schrift um 200% ohne Probleme und ohne Verlust von Inhalt oder Funktionalität möglich ist.

2.1.2 Ausreichend Kontrast

Damit eine Person mit Sehschwäche einen Text gut lesen kann, sollte ein Mindestkontrast von 1:4,5 eingehalten werden. Besser noch 1:7. Diese Kontrastregel gilt auch für wichtige UI-Elemente, die von primärer Bedeutung sind (icons, etc.).

2.2 Farbseh-Schwächen

Farbseh-Schwächen existieren in verschiedenen Ausprägungen. Die bekannteste dürfte wohl die Rot-Grün-Schwäche sein. Bei dieser Art der Farbsehschwäche können Betroffene die Farben Rot und/oder Grün nur als Grau-/Braunschattierung wahrnehmen. Außerdem existieren noch die Blauschwäche (sehr selten) und die totale Farbenblindheit.

Für Menschen mit Farbsehschwäche gelten die gleichen Kriterien, wie für Menschen mit altersbedingten Sehschwächen. Ein weiteres Kriterium kommt jedoch hinzu.

2.2.1 Nicht ausschließlich auf Farben verlassen

Beim Gestalten von UI-Elementen sollte man darauf achten, dass man sich nicht ausschließlich auf Farben verlässt um verschiedene Zustände anzuzeigen. Will man zum Beispiel signalisieren, dass eine Prüfung bestanden ist, sollte man sich nicht nur auf das Einfärben der Schrift mit Rot oder Grün verlassen. Irgendwo sollte auch in Textform stehen, ob die Prüfung bestanden ist.

2.3 Körperliche Einschränkungen

Zu einer körperlichen Einschränkung kann man auf viele Arten kommen. Sie kann angeboren sein, oder sie ist im Laufe des Lebens geschehen. Sie kann auch nur vorrübergehen sein, wenn man sich zum Beispiel die Hand gebrochen hat. Wenn man in so einer Situation ist, wird man sich freuen, wenn es auf einer Webseite möglich ist, diese nur mit der Tastatur zu bedienen.

2.3.1 Tastatursteuerung und Shortcuts

Als Informatiker nutzt du sie vielleicht auch ohne körperliche Einschränkung recht häufig, da man damit viel abkürzen kann. Bei Formularen (z.B. beim Login) wirst du bestimmt schon einmal den Tabulator verwendet haben um durchzunavigieren. Das setzt voraus, dass sich jemand über die richtige Reihenfolge der Felder Gedanken gemacht hat. Im Markup mag der Link zu "Passwort-Vergessen" direkt nach dem Passwort-Feld kommen. Wenn man mit dem Tabulator durchnavigiert, möchte man jedoch im Normalfall erstmal auf dem Submit-Button landen, nachdem man das Passwortfeld ausgefüllt hat.

Auch Shortcuts können viel helfen um nicht immer zwischen Tastatur und Maus hin und her wechseln zu müssen. Als Beispiel wären hier die vielen Shortcuts zu nennen, die Youtube bietet. [F] wechselt in den Vollbildmodus, [arrow-up] und [arrow-down] ändern die Lautstärke, ...

2.4 Kognitive Belastung (Cognitive Load)

Unter Kognitiver Belastung möchte ich die Probleme einer tatsächlichen Krankheit und die Probleme des fehlenden Wissens zusammenfassen. Hierbei handelt es sich größtenteils um Probleme mit Sprache an sich oder dem Verstehen von komplexen Zusammenhängen.

2.4.1 Einfache Sprache

Komplexe Satzstrukturen mit mehreren Nebensätzen und komplexe Wörter sind nicht nur für Menschen mit kognitiven Behinderungen schwer zu verstehen, sondern auch für gesunde Menschen unangenehm. Daher gilt es Sätze möglichst einfach zu strukturieren.

2.4.2 Fachsprache

Auch wenn deine Webseite für z.B. Informatik-Studenten gemacht ist, können andere Menschen auf der Seite landen, die sich für Informatik interessieren. Akronyme sollten also möglichst beim erstmaligen Verwenden ausgeschrieben werden. Für Fachwörter bietet sich ein Glossar für unwissende Nutzer an.

2.4.3 Struktur

Ein sehr langer Fließtext sollte möglichst in kleinere Absätze untergliedert werden und eventuell mit Subüberschriften versehen werden. So ist es einfacher den Text zu verstehen. Um Inhalt zu strukturieren bieten sich außerdem HTML Elemente, wie <section>, <article>, <ul>, <ol>,... an.

2.5 Blinde Menschen

Kommen wir zu der Gruppe, für die wohl am meisten beachtet werden muss. Blinde Menschen können Webseiten nicht so konsumieren, wie es Sehende können. Sie nutzen Screenreader(z.B. NVDA) um sich den Inhalt der Webseite anzuhören. Dabei tauchen viele Probleme auf.

2.5.1 Bilder und Videos

Bilder sollten immer einen Alternativ-Text besitzen, der blinden Menschen beschreibt, was auf den Bildern zu sehen ist.

Man mag meinen, dass es bei Videos kein so großes Problem gibt, da im Video meistens Personen über ein bestimmtes Thema reden und Blinde sich das ja anhören können. Jedoch wird in Videos oft zu gezeigten Objekten oder Szenen Bezug genommen, wodurch einer blinden Person schnell der Bezug fehlt. Dafür gibt es Audio Descriptions, die zusätzlich das Visuelle beschreiben.

2.5.2 Fokussteuerung im HTML Markup

Ein weiteres Problem besteht in jeglichen Dropdown Menüs oder Pop-ups.

Dropdowns sind für Sehende Menschen eine super Sache. Man wird nicht vom Inhalt einer Seite überrumpelt und kann ihn nachträglich ausklappen. Man klickt auf den Button und sieht, wo die Box mit dem Inhalt aufgeht und kann weiterlesen. Für Blinde endet die Reise jedoch hier. Eine blinde Person klickt auf den Button und... nichts passiert. Zumindest für sie nicht, denn wenn wir dem Screenreader nicht sagen, dass der Dropdown jetzt ausgeklappt ist und wir den Focus zum ausgeklappten Inhalt bewegen, dann bekommt die Blinde Person nichts neues vorgelesen.

Pop-Ups sind auch ein sehr praktisches UI-Element, das unverzichtbar ist, wenn man zusätzlichen Inhalt anzeigen will, auf der aktuellen Seite aber kein Platz mehr ist und ein Link zu einer neuen Seite keine Lösung ist. Ein besonderes Problem entsteht hier, da solche Pop-Ups meist am Ende eines HTML-Dokuments eingefügt werden. Sie befinden sich also nicht in der korrekten chronologischen Reihenfolge im Markup.

Wenn in der Mitte der Seite also ein Button ist, der das Pop-Up öffnet, dann sollte der Fokus nach dem Öffnen des Pop-Ups natürlich zum Pop-Up bewegt werden. Beim Schließen des Pop-Ups muss man dafür sorgen, dass der Fokus wieder zurück zu dem Element geht, der es geöffnet hat, damit keine Verwirrung darüber entsteht, wo man jetzt genau ist. Während ein Pop-Up geöffnet ist, will man meist auch nicht, dass Nutzer mit Elementen außerhalb des Pop-Ups interagieren können. Man muss also auch noch dafür sorgen, dass man mit dem Tabulator nur innerhalb des Pop-Ups navigieren kann und nicht irgendwann außerhalb landet, obwohl das Pop-Up noch offen ist.

2.5.3 Captchas

Captchas sind ein großes Problem, was die Barrierefreiheit angeht. Sie sorgen auf der einen Seite für mehr Sicherheit und verwehren Bots die Möglichkeit Formulare automatisiert auszufüllen. Jedoch sind viele Captchas nicht barrierefrei, da sie auf visuelle Elemente setzen. Will eine blinde Person zum Beispiel ein Support-Formular ausfüllen und landet vor einem Captcha, dann wird sie hier ohne eine sehende Person nicht weiterkommen. Dieses große Problem hat beim W3C eine eigene Seite eingenommen. Dort gibt es mehr oder weniger gute Lösungsmöglichkeiten.

Nächstes Thema » « Vorheriges Thema