Hindernisse existieren, um beseitigt zu werden

header-barrierefreiheit

Das Internet bietet heute mehr Anwendungsmöglichkeiten als jemals zuvor. Doch wo es mehr Features gibt, tun sich auch mehr Hindernisse für Benutzer:innen auf. Darum gehört Barrierefreiheit zu den wichtigsten Qualitätskriterien für Websites. Sie richtig umzusetzen benötigt Fachwissen in Design, Technik und Redaktion.

Unter Barrieren versteht man Alltagshindernisse, die von Menschen mit Beeinträchtigung nicht ohne zusätzliche Hilfe überwunden werden können. Sie können räumlicher Natur sein wie etwa Stufen vor einem Geschäftseingang, die sich mit einem Rollstuhl nicht überwinden lassen. Eine Ampel ohne akustisches Signal stellt eine Barriere dar, genauso wie ein Video ohne Untertitel. Das können wir ganz intuitiv nachvollziehen.

Nicht ganz so offensichtlich ist, dass auch unser “Alltag” im Internet eine Menge Barrieren beinhaltet. Schließlich surfen auch Menschen mit eingeschränkter Seh- und Hörkraft oder Motorik eigenständig im Netz. Je nach Beeinträchtigung können sie auf unterschiedliche Hindernisse stoßen. Sie zu beseitigen ist eine anspruchsvolle Aufgabe – Barrierefreiheit bleibt stets “Work in Progress”. Folglich müssten wir eher von “Barrierearmut” sprechen.

So oder so: Für Websitebetreiber:innen führt kein Weg daran vorbei. Das ist nicht nur ein ethischer Grundsatz. Laut Bundes-Behinderten-Gleichstellungsgesetz (BGStG) haben Menschen mit Behinderungen Anspruch auf gleichberechtigte Teilnahme am gesellschaftlichen Leben – das betrifft natürlich auch das Internet.

Hilfe durch Hardware und Software

So wie Webbrowser heute x-fach mehr Funktionen haben als vor zehn oder zwanzig Jahren, gibt es auch viel mehr Werkzeuge zur barrierefreien Navigation im Netz. Dies beginnt schon bei der Hardware. Mit einer Mundmaus können Benutzer:innen heute nicht nur den Cursor über den Desktop bewegen, sondern sie sogar fürs Gaming verwenden. Mit Braille-Displays können Sehbeeinträchtigte Websites vollständig ertasten, Untertitel helfen bei akustischen Einschränkungen et cetera. Barrierefreiheit ist ähnlich wie Suchmaschinenoptimierung eine Querschnittsmaterie. Geübte Webdesigner:innen und Programmierer:innen wissen, wie sie ihre Anforderungen am besten erfüllen – und damit die User Experience für alle verbessern. 

Die Magie des richtigen Codes

Wenn Sie diese Seite betrachten, sehen Sie eigentlich keine Website. Denn diese ist, wie jedes Computerprogramm, eine Ansammlung an Codezeilen. Sie legen fest, was Sie im Browser sehen können: das Textformat, bestimmte Farben, ein gewisses Layout,… Für Screenreader und Co. zählt allerdings nicht das Aussehen einer Seite. Diese Programme beziehen ihre Informationen direkt aus dem HTML-Code. Die richtige, saubere Programmierung schafft es, den Code für beide Arten der Ausgabe zu optimieren.

Ein Beispiel dafür sind Überschriften. Für Sie als Leser:in ist es nicht ersichtlich, ob eine Zeile mit dem <h>-Tag als Überschrift definiert wurde oder ein Teil des Textblocks ist – für Screenreader allerdings sehr wohl. Sie lesen den HTML-Code und teilen sehbehinderten Nutzer:innen mit: Das ist keine wahllos eingefügte Zeile, sondern eben eine Überschrift. Ganz ähnlich verhält es sich mit Tabellen. Mit voller Sehkraft können Sie als Mensch leicht erkennen, wo ein Satz beginnt und wo er endet, auch mit Abständen und über mehrere Zeilen hinweg. Ein Programm hat diese Übersicht nicht. Daher ist es vorteilhaft, bei der Erstellung von Websites auf CSS (Cascading Style Sheets) zu setzen, die das Chaos mit Spalten und Zeilen erst gar nicht zulassen.

Geschicktes Design heißt Usability für alle

Eine moderne Website zu erstellen umfasst aber nicht nur einen sauberen Code, sondern auch ein ganzheitliches Screendesign. Der richtige Look und eine gute Struktur sind freilich nicht nur für den Abbau von Barrieren wichtig. Sie tun auch der Usability gut. Richtig angeordnete Menü- und Linkelemente zum Beispiel helfen nicht nur dabei, sich auf einer Seite zurechtzufinden. Sie ermöglichen auch die rasche Navigation per Tabulator, also ohne den Einsatz der Maus.

Beim Einsatz von Farben ist besondere Sorgfalt nötig. Denn die Farbwahrnehmung ist von Mensch zu Mensch – und Bildschirm zu Bildschirm – verschieden. Keine Website wird auf jedem Monitor ganz gleich aussehen. Auch das individuelle Farbspektrum der Menschen ist höchst unterschiedlich. In Phänomenen wie der weit verbreiteten Rot-Grün-Schwäche äußert sich das besonders stark. Barrierefreies Design verlangt hier also, unterschiedliche Informationen nicht ausgerechnet mit diesen Farben darzustellen. 

Gute Websites sind so ausbalanciert, dass sie auch in Graustufen eine gute Lesbarkeit aufweisen. Schlüsselwörter oder -passagen sollten daher anders, etwa durch einen unterschiedlichen Schriftschnitt, hervorgehoben werden. Dabei ist darauf zu achten, dass die Hervorhebung auf gezoomten Seiten immer noch die beabsichtigte Wirkung erzielt – am besten durch responsives Design, das sich den verschiedenen Bildschirmformaten (Smartphone, Tablet, Desktop,…) automatisch anpasst.

Es gibt immer eine Alternative

Generell gilt auch abseits der Barrierefreiheit: Den User:innen sollte schon vor dem Klick klar sein, wohin sie ein Link führt. Das ist etwa bei “Klicken Sie hier” überhaupt nicht der Fall – viel besser wäre “Nehmen Sie mit uns Kontakt auf”. Werden andere Dokumentdateien oder gar Downloads direkt verlinkt, ist es sinnvoll, Art und eventuell Größe der Datei anzugeben.  Auch ein Alternativtext macht Sinn, der per Mouseover oder Kontextmenü sichtbar wird. Dieser kann von Screenreadern gelesen werden. Für Links “nach außen” hat sich eine zusätzliche grafische Markierung für manche Websites ebenfalls bewährt. 

Screenshot der LIMESODA-Website mit Bild, Überschrift, Text und einem Beispiel für Alternativtext.
Starke Kontraste, definierte Überschriften und ein Alternativtext (mit dem Pfeil markiert)

Bilder sollten beschrieben werden

Von größter Bedeutung ist dieser Alternativtext für den barrierefreien Einsatz von Bildern und Grafiken. Auch dieser wird im Quellcode klar definiert und soll in wenigen Worten ausdrücken, was auf dem Bild zu sehen ist. Selbstgewählte Bezeichnungen oder gar der Dateiname (z.B. “Foto links oben” oder “teamfoto1.jpg”) sind als Alternativtext keine Hilfe – erst bei konkreten Beschreibungen (“Unser fünfköpfiges Team”) können Grafiken wirklich sinnvoll ersetzt werden. Und wieder kommt Barrierefreiheit hier allen User:innen zugute. Stellen Sie sich vor, eine Website wird nicht vollständig geladen, besteht aber aus lauter Bilderlinks. In diesem Fall ist der Alternativtext Ihre beste Orientierung. Er ist freilich nur da sinnvoll, wo Grafiken auch Information vermitteln – also nicht bei reinen Designelementen. Mit Bildern zu arbeiten ist also buchstäblich aufwändiger, als es auf den ersten Blick scheint. 

Wo die Redaktion eingreift

So elegant und praktisch ein gelungenes Design ist, am Ende zählt auch der redaktionelle Inhalt einer Seite. Sprachliche Barrierefreiheit ist für Menschen mit Lernschwierigkeiten, mit nicht-deutscher Erstsprache oder niedriger Schulbildung eine große Erleichterung. Sie beginnt bei exakten Formulierungen und geht bis zur Übersetzung in leicht verständliche Sprache. Wichtig: Leicht verständliche Sprache, Einfache Sprache, Leicht Lesen – diese Varianten sind nicht “schlichtes Deutsch”! Sie gehorchen Normen und Regeln. Dahingehend können Websites auch zertifiziert werden. Aber auch wenn das für Sie nicht nötig ist: Verständlich zu schreiben ist nie schlecht! Denn oft steckt der Teufel im Detail, und was für Sie völlig klar und deutlich scheint, ist für Dritte ein sprachlicher Stolperstein. Das gilt im Übrigen auch für Social Media. Wussten Sie, dass Screenreader Hashtags unterschiedlich interpretieren? Nämlich je nachdem, ob sie Großbuchstaben beinhalten. #dasabc wird in einem Zug gelesen (also quasi “dasa btz”), #DasABC wiederum so, wie Sie es auch lesen würden. 

Fazit

Barrierefreiheit – oder Barrierearmut – ist ein weites Feld. Wir können es nie vollständig erschließen, denn das Internet entwickelt sich immer weiter. Jedes neue Feature stellt die Menschen, die es nutzen, vor Herausforderungen. Ganz egal, ob sie eine Beeinträchtigung haben, oder nicht. Gute Usability nutzt allen. Natürlich gehört viel guter Wille dazu, schließlich erhöht sich kurzfristig der Programmier- und Testaufwand, um alle Standards einzuhalten. Aber es zahlt sich aus. Das Team von LIMESODA berät Sie gerne.

Rating: 5.0/5. Von 3 Bewertungen.
Bitte warten...

Hinterlasse einen Fingerabdruck für die Ewigkeit: Ein Kommentar bei LimeSoda!

(*) Pflichtfeld

Bewirb dich bei uns!

LimeSoda.
Digitalagentur in Wien.

Bewirb dich jetzt!
Mario

Verpasse nicht den nächsten Blog-Post von Mario!

Jetzt zum LimeSoda-Newsletter anmelden