Wie Barrierefreiheit die Zugänglichkeit deiner Webseite verbessern kann

In Deutschland gibt es rund 10 Millionen Menschen mit Behinderung (Stand: Ende 2019). Das ist etwa ein Achtel der Gesamtbevölkerung. Alle diese Personen können Probleme haben, eine Webseite auf normale Weise zu bedienen. Deshalb ist es wichtig, auf Barrierefreiheit beim Entwickeln einer Webseite zu achten. Besonders wichtig ist dies bei offiziellen Webseiten wie zum Beispiel von Bundesministerien. Dort ist die Nutzung von Barrierefreiheit auch seit Juni 2021 Pflicht. Trotzdem ist es auch bei nicht-öffentlichen Webseiten sinnvoll auf Barrierefreiheit zu achten. 

Aber was ist denn jetzt eigentlich genau Barrierefreiheit?

Barrierefreiheit ist ein Begriff dafür, dass man allen Menschen, auch solchen, die in einem Bereich Einschränkungen haben können, einen adäquaten Zugang ermöglicht. Barrierefrei können zum Beispiel Verkehrsmittel, technische Gebrauchsgegenstände, Systeme der Informationsverarbeitung oder Kommunikationseinrichtungen sein, wenn sie für Menschen mit Behinderungen ohne besondere Erschwernis und wenn notwendig mit Hilfe von Hilfsmitteln nutzbar sind.
Barrierefreiheit ist außerhalb des deutschsprachigen Raums auch unter dem Begriff Accessibility oder zu Deutsch Zugänglichkeit bekannt. Außerdem ist es ein Teilbereich der Usability (Gebrauchstauglichkeit).

Wenn ihr mehr über Usability erfahren wollt, schaut euch meinen letzten Blogbeitrag dazu an:

Wie ihr seht, kann Barrierefreiheit in vielen verschiedenen Lebensbereichen hilfreich sein. Ich beschränke mich hier aber auf die Barrierefreiheit im Bereich der Webentwicklung.

Welche Einschränkungen und Barrieren kann es geben?

Sehvermögen

Einschränkungen des Sehvermögens können durch ein geringes Sehvermögen oder vollkommene Blindheit auftreten. Auch Fehlsichtigkeit wie Kurzsichtigkeit, Weitsichtigkeit und eine Alterssehschwäche können Barrieren sein.
Wichtig ist auch die Farbfehlsichtigkeit nicht außen vor zulassen. Darunter wird nicht nur vollkommene Farbenblindheit verstanden, sondern auch zum Beispiel Rot-Grün-Blindheit. Von Rot-Grün-Blindheit sind ganze 9 % aller Männer und 0,8 % aller Frauen betroffen.
Weitere Einschränkungen können Tunnelsicht, bei der das Sichtfeld um einiges eingeschränkt ist, oder auch das Vorhandensein von Sonnenlicht sein. Daran sieht man auch, dass Menschen, die an keiner Behinderung leiden, trotzdem von Einschränkungen in bestimmten Situationen betroffen sein können und dann ebenfalls von barrierefreien Webseiten profitieren können.

Hörvermögen

Die bekanntesten Einschränkungen des Hörvermögens sind wohl die Taubheit, eine starke Hörschwäche und die altersbedingte Hörschwäche. Man sollte aber Sprachunkenntnisse auch nicht außen vor lassen. Jemand, dessen Sprachniveau in einer Fremdsprache vielleicht nicht hoch genug ist, um jedes gesprochene Wort zu verstehen, kann auch von Barrierefreiheit profitieren. Eine weitere Einschränkung können störende Hintergrundgeräusche sein. Stell dir vor, du sitzt in der Bahn und versuchst ein Video anzuschauen, hast aber deine Kopfhörer vergessen und kannst leider, weil auf dem Sitz gegenüber gerade zwei Kinder spielen, nichts verstehen.

Motorischen Fähigkeiten

Eine Einschränkung von motorischen Fähigkeiten kann vor allem die Beeinträchtigung von einzelnen Körperteilen betreffen. Dies kann von Geburt an bestehen, wegen eines Unfalls oder wegen eines Schlaganfalls verursacht worden sein. Auch alltägliche Beeinträchtigungen, wie dass man gerade nur eine Hand frei hat, um den Computer zu bedienen, fallen unter motorische Beeinträchtigungen. Außerdem kann Parkinson beim Bedienen einer Maus eine große Beeinträchtigung darstellen.

Lese- und Schreibfähigkeiten

Ein Defizit in Lese- und Schreibfähigkeiten kann die Alexie (völliges Unvermögen zu lesen) oder die Dyslexie oder auch bekannt als Legasthenie (eingeschränktes Lesevermögen) sein. Außerdem kann dies auch durch einen geringen Bildungsstand, weil zum Beispiel die Person noch ein Kind ist, oder durch Sprachunkenntnisse verursacht werden.

Konzentrationsvermögen

Bei eingeschränktem Konzentrationsvermögen denkt man direkt an ADHS (Aufmerksamkeitsdefizit-/Hyperaktivitätsstörung). Es können aber auch Betroffene von ADS, Autismus und dem Fatigue-Syndrom, dies ist eine anhaltende Erschöpfung, Konzentrationsprobleme haben. Ein eingeschränktes Konzentrationsvermögen kann auch durch einfache Ablenkung ausgelöst werden, weshalb man sich dann zum Beispiel nicht mehr darauf konzentrieren kann, einen schwierigen Text zu lesen.

Um sich einen Eindruck über das Ausmaß der Beeinträchtigungen machen zu können, gibt es im Netz mehrere Simulatoren, die die Auswirkungen auf die betroffenen Personen simulieren. Als Beispiel ist hier die Chrome Erweiterung „Web Disability Simulator" zu nennen.

Wie kann ich die Zugänglichkeit meiner Webseite verbessern?

Auch zur Barrierefreiheit gibt es einige Richtlinien, an die man sich halten kann, um die eigene Webseite auf ihre Zugänglichkeit zu testen und zu verbessern.
Im internationalen Raum sind die Web Content Accessibility Guidelines (WCAG) 2.1 momentan relevant. Auf den WCAG basierend wurde die Barrierefreie-Informationstechnik-Verordnung (BITV) 2.0 für Deutschland entwickelt. Für Europa gibt es die Norm für barrierefreies Webdesign nach EN 301 549.
Zum Testen der Webseite kann man beispielsweise eine Checkliste von W3C benutzen, die die wichtigsten Richtlinien von WCAG aufführt.

Tipps zur Verbesserung der Zugänglichkeit:

Allgemein ist es immer gut, darauf zu achten, dass niemals Informationen nur über einen Kanal übertragen werden! Also zum Beispiel bei Videos immer einen Untertitel anbieten und zu Bildern, die relevant sind, eine Umschreibung vorlesen lassen.

Sehvermögen

Menschen mit eingeschränktem Sehvermögen haben Schwierigkeiten, eine Computermaus zu benutzen, da sie ja nicht sehen, wo sich gerade der Mauszeiger auf dem Bildschirm befindet. Deswegen ist es wichtig, darauf zu achten, dass eine Webseite auch nur über die Tastatur ohne Maus bedient werden kann. Dazu muss auch ermöglicht werden, dass wichtige Funktionen über Tastaturkürzel erreichbar sind.
Des Weiteren werden oft Screenreader genutzt. Ein Screenreader ist ein Bildschirmleseprogramm, dieses mithilfe der Tab-Taste den Text auf der Webseite durchläuft und vorliest. Die Vermittlung des Textes kann auf zwei Arten geschehen: akustisch über die Soundkarte des Computers oder taktil über eine Braillezeile, die an der Tastatur angebracht ist. Damit Screenreader problemlos genutzt werden können, muss beim Entwickeln der Webseite schon einiges beachtet werden:

Bei Grafiken soll ein Alternativtext hinterlegt werden, Tabellen und Formulare sollen eindeutig beschriftet werden und die Textgestaltungmittel wie, dass der Text kursiv sein soll, müssen gekennzeichnet werden. Außerdem ist es wichtig, die verschiedenen Elemente der Webseite mittels HTML5 zu kennzeichnen, damit der Screenreader erkennt, wo er sich gerade befindet und beispielsweise die Navigation oder den Footer überspringen kann.
Es ist wichtig, bei der Farbgebung darauf zu achten, dass der Hintergrund und die Schrift einen genügenden Kontrast besitzen und dass die Farbgebung gegebenenfalls geändert werden kann.
Die Schriftgröße und -art sollte ebenfalls einstellbar sein. Zeilenabstände und Leerzeichen sollen gut gewählt sein. Ebenfalls soll es die Möglichkeit geben, die Webseite per Zoom zu vergrößern. Auch eine Vergrößerung des Mauszeigers kann für Menschen, die nur eingeschränkt sehen können sinnvoll sein.

Hörvermögen

Für Menschen mit eingeschränktem Hörvermögen ist es besonders sinnvoll, zu auditiven Ausgaben auch Untertitel und/oder Gebärdensprache anzubieten.

Motorischen Fähigkeiten

Um Personen mit einem Defizit an motorischen Fähigkeiten zu helfen, können Tools wie eine Mundmaus genutzt werden, die ohne Hände genutzt werden können. Eine Mundmaus kann, wie der Name schon aussagt, über den Mund bedient werden, dabei wird durch schwachen Druck der Mauszeiger bewegt und durch Saugen oder Blasen die linke oder rechte Maustaste bedient.
Hier ist es ebenfalls sinnvoll, die Möglichkeit zu bieten, den Computer nur über Tastatur und eventuell mit selbst gewählten Tastaturkürzeln bedienen zu können. Außerdem kann man darauf achten, dass zwischen den Komponenten genügend Platz und Klickflächen groß genug sind, um Menschen, die nicht gut mit der Maus umgehen können oder an Parkinson leiden, helfen zu können.

Lese- und Schreibfähigkeiten

Personen mit Lese- und/oder Schreibdefiziten kann man das Zurechtkommen auf der Webseite erleichtern, indem man darauf achtet, kleine Schriftgrößen, komplizierte Schriftarten und lange Texte zu vermeiden. Ebenfalls tragen gut gewählte Zeilenabstände und Leerzeichen zu einem verbesserten Leseerlebnis bei.
Schwierige Wörter sollten möglichst vermieden werden, eventuell sollte sich auch Gedanken darüber gemacht werden, ob das Angebot von Spracheinstellungen sinnvoll wäre: Leichte Sprache und auch andere Sprachen wie beispielsweise Englisch.
Auch hier ist es sinnvoll, zu den Texten eine weitere auditive Alternative anzubieten und Texte durch selbsterklärende Grafiken zu ergänzen.

Konzentrationsvermögen

Menschen mit Konzentrationsschwierigkeiten kann es helfen das ganze Webdesign relativ einfach, clean und nicht überladen zu halten. Starke Farben, Animationen und Elemente mit Bewegung sollten nur vorsichtig verwendet werden.
Timer können einen zusätzlichen Stressfaktor bieten, deshalb sollten diese möglichst nicht verwendet werden.
Hier gilt es ebenso wie bei einem beeinträchtigten Lesevermögen auf mehrere alternative Informationsübertragungsarten zu setzen, da diese den Inhalt wiederholen oder ergänzen können.

Wie kann mobile Zugänglichkeit aussehen?

Heutzutage ist es sehr wichtig auch Nutzer*innen, die über einen mobilen Browser zugreifen, nicht außen vor zu lassen. Weltweit nutzen mehr Personen eine Webseite über das Smartphone als über den Desktop und es wird wahrscheinlich in den nächsten Jahren noch zunehmen! Deswegen ist es wichtig, auch bei mobilen Webseiten auf Barrierefreiheit zu achten, denn oft gibt es am Smartphone einige zusätzlich Dinge zu beachten.

Bei der mobilen Zugänglichkeit muss besonders beachtet werden, dass wir es mit einer um einiges kleineren Bildschirmgröße zu tun haben. Die Schrift sollte also standardmäßig schon in einer guten lesbaren Größe eingestellt sein, aber auch noch verstellbar sein. Außerdem sollte bis zu 200 % der Zoom geändert werden können. Der Kontrast sollte wegen der erhöhten Wahrscheinlichkeit, dass die Sonne blendet auch hoch genug sein, damit der Text trotzdem noch lesbar bleibt.
Bei der Bedienung sollte darauf geachtet werden, dass das Touchscreen-Gerät auch mit einer Tastatur eventuell gesteuert werden kann und sehr einfache Touchscreen- und Gerätemanipulationsgesten verwendet werden können. Außerdem sollte die Bildschirmausrichtung geändert werden können, damit das Smartphone zum Beispiel an einem Elektrorollstuhl befestigt werden kann und die Schaltflächen sollen leicht zugänglich platziert werden.

Fazit 

Nun hast du jede Menge Tipps für eine bessere Zugänglichkeit deiner Webseite an die Hand gelegt bekommen. Wichtig ist, sich zu merken, dass man nicht immer alles beachten muss, oft reicht es schon, einzelne Punkte von den oben genannten umzusetzen, um Menschen mit Einschränkungen schon helfen zu können.
Viele Dinge, wie beispielsweise lange Texte und überladenen Seiten zu vermeiden und genügend Kontrast zwischen Hintergrund und Texten zu garantieren, können der allgemeinen Übersichtlichkeit der Webseite schon dienen und generell umgesetzt werden.

Bild: Negro Elkha auf Adobe Stock