Was ist barrierefreies Webdesign und wie wichtig ist es für Unternehmen?

Barrierefreies Webdesign sorgt für eine Gleichstellung im Internet. Zwar gibt es sogar ein Gesetz, dass zur Gleichstellung von Menschen mit Behinderungen verpflichtet, doch trotzdem ist inklusives Webdesign vielen Firmen noch ein Fremdwort.

Im Gesetz wird festgelegt, was mit „barrierefrei“ gemeint ist: Webseiten sollen auch für eingeschränkte Menschen ohne fremde Hilfe oder besondere Vorkehrungen nutzbar sein – genauso wie bauliche Anlagen und Gebrauchsgegenstände. Um es bildlich zu beschreiben: Möchte eine körperlich eingeschränkte Person im Rollstuhl eine Firma betreten, sollte es vor dem Eingang eine flache Rampe als alternativen Weg zu den Treppen geben, den diese Person nutzen kann – ansonsten kann sie den Laden nie betreten. Genauso gilt das für barrierefreie bzw. inklusive Webseiten: Es sollte eine Version eurer Website geben, deren Inhalt und Design so ausgerichtet ist, dass behinderte Menschen sie problemlos nutzen und verstehen können. Bei baulichen Anlagen ist barrierefreies Design oft schon selbstverständlich, denn es werden kaum neue Bauanlagen ohne zusätzlichen Fahrstuhl oder Rampe gebaut. Bei der Nutzung des Internets ist das bis heute noch nicht so weit verbreitet. Behinderte Personen tun sich daher oft schwer, das Internet zu nutzen, weil dort viele Hindernisse auf sie warten – welche genau, nehmen wir gleich genauer unter die Lupe.

Erst noch weiter zur Definition von „barrierefreiem Webdesign“: Das World Wide Web Consortium hat für dieses Thema die Web Content Accessibility Guidelines (WCAG) veröffentlicht. Darin wird barrierefreies Webdesign in drei Abstufungen festgelegt: A, Double-A (AA) und Triple-A (AAA). Je nach Schwere der Behinderung sollte eine Webseite den Kriterien des dazugehörigen WCAG-Standards entsprechen. Außerdem werden folgende vier Prinzipien für barrierefreies Webdesign festgelegt:

1. Wahrnehmbar: Informationen und Bestandteile der Webseite müssen für alle Nutzer so aufbereitet werden, dass diese sie wahrnehmen können.
2. Bedienbar: Eine einfache Bedienbarkeit der Webseite, beispielsweise in Bezug auf eine einfache Navigation, ist ein weiteres Kriterium für barrierefreies Webdesign.
3. Verständlich: Informationen sowie die Bedienung der Webseite müssen für Menschen mit jeglicher Einschränkung verständlich sein.
4. Robust: Eingeschränkte Menschen verwenden bei der Nutzung des Internets oft Benutzeragenten und assistierenden Techniken. Eure Webseite sollte so „robust“ sein, dass sie zuverlässig und problemlos von einer großen Auswahl solcher Techniken interpretiert werden kann. Auch, wenn sich die Hilfs-Techniken und Benutzeragenten weiterentwickeln, sollte eure stets Webseite barrierefrei funktionieren und mit ihnen kompatibel sein.

Barrierefreies Webdesign kommt in erster Linie behinderten Menschen zugute. Dazu zählen Menschen mit eingeschränkter geistiger Aktivität, motorischen Einschränkungen, eingeschränktem Sehvermögen oder Hörbeeinträchtigungen. Auch auf Personen, die an sonstigen Krankheiten, wie Epilepsie, leiden, muss im Webdesign besondere Rücksicht genommen werden. Viele Behinderungen entstehen aus chronischen Krankheiten, von denen sowohl junge als auch viele ältere Menschen betroffen sind. Doch auch euch als Unternehmen bringt eine barrierefreie Web-Optimierung Vorteile.

Barrierefreiheit hilft allen
Inklusive Webseiten dienen dem sozialen Gedanken, Inhalte allen Menschen gleichermaßen zugänglich zu machen. Keiner soll ausgeschlossen werden. Dafür ist es notwendig, dass die Inhalte und Designs einer Webseite auf bestimmte Personengruppen angepasst werden. Wer diese soziale Verantwortung anerkennt und seine Webseite entsprechend umbaut, kann sie von Organisationen wie der „WIR für Barrierefreiheit“ mit einem entsprechenden Siegel zertifizieren lassen. Außerdem nehmen Unternehmen, die inklusive Webseiten-Versionen anbieten, eine Vorreiterrolle ein, die als Vorbild für hoffentlich viele weitere Nachzügler dient.

Barrierefreiheit hilft eurem Unternehmen
Wie gehört, sind in Deutschland 30 % aller Menschen so beeinträchtigt, dass sie eure Webseite aktuell vielleicht gar nicht nutzen können. Das könnte ein Drittel eurer Zielgruppe sein, das aktuell vernachlässigt wird. Dazu kommen zahlreiche Pluspunkte, bei denen barrierefreies Design eurem SEO-Erfolg in die Karten spielen kann – doch dazu später mehr.

Barrierefreiheit hilft Menschen mit Sehbeeinträchtigung
So gibt es unfassbar viele Arten von Sehschwächen und Farbstörungen, die das menschliche Auge betreffen können. Bei gewissen Farben oder fehlenden Kontrasten können manche Behinderte nicht erkennen, wenn im Text ein Link hinterlegt ist oder wo sich ein Teil von einem anderen auf der Webseite farblich unterscheidet. So werden thematische Untergliederungen beispielsweise nicht wahrgenommen und verstanden. Doch nicht nur Farben, sondern auch Schriftgrößen sowie die oft fehlende Skalierbarkeit des gesamten Web-Layouts stellen für Sehbeeinträchtigte oft „Barrieren“ dar.

Barrierefreiheit hilft Menschen mit körperlichen Einschränkungen
Dazu kommen die Probleme von motorisch eingeschränkten Menschen. Für sie stellt oft die Navigation der Webseite eine besondere Hausforderung dar. Das wird vor allem dann klar, wenn man sich die einfache Frage stellt: Wie finde ich mich auf einer Webseite zurecht, wenn es mir körperlich nicht möglich ist, eine Maus zu bedienen?

Barrierefreiheit hilft Menschen mit Hörbeeinträchtigung
Menschen mit Hörbeeinträchtigung treffen wiederum auf andere Schwierigkeiten bei der Webnutzung: Da ihnen die Lautsprache beim Erlernen der Sprache fehlt, fällt vielen Gehörlosen die Schriftsprache schwer. Im persönlichen Gespräch hilft die Gebärdensprache aus, aber auf einer Webseite, auf der alle Informationen in Schriftform festgehalten sind, wird Hilfe benötigt, damit alle Inhalte verstanden werden können.

Barrierefreiheit hilft Menschen mit sonstigen Krankheiten
Für Menschen mit sonstigen Krankheiten, wie Epilepsie, müssen ebenfalls besondere Vorkehrungen getroffen werden, da sonst Schwindel, Kopfschmerz oder im schlimmsten Fall sogar ein epileptischer Anfall ausgelöst werden kann.

Jetzt, wo wir die verschiedenen Beeinträchtigungsarten und die auftretenden Probleme bei der Webnutzung kennen, sollten wir uns genauer anschauen, mit welchen Maßnahmen ihr eure Webseite barrierefrei umbauen könnt.

Unterteilen wir diese Tipps wieder in die verschiedenen Behinderungsarten:

Wie bereits erwähnt, ist die Navigation einer Webseite für diese Personengruppe eine große Herausforderung. Statt mit einer gewöhnlichen Maus steuern motorisch eingeschränkte Personen eine Webseite via Touchscreen, Joystick, Tastatur, blick- oder mundgesteuertem Cursor. Dafür ist es beispielsweise wichtig, dass Schaltflächen genügend Abstand zueinander haben und groß genug sind. Weitere Tipps speziell für die Steuerung über die Tastatur findet ihr hier.

Wenn eine taktile Informationsaufnahme in Form von Braillezeichen nicht möglich ist, greifen sehbeeinträchtigte Personen häufig auf auditive Hilfstechnologien wie Screenreader zurück. Diese Technologien benötigen einen logischen Quelltext der Webseite sowie alternativ-beschriebene Bilder und semantische Auszeichnungen, damit der Inhalt verständlich wiedergegeben werden kann. Im besten Fall baut ihr direkt auf eurer Webseite eine Funktion zum Vorlesen ein. Dabei solltet ihr beispielsweise auf Abkürzungen und römische Zahlen verzichten, da sie von Screenreadern nicht richtig vorgelesen bzw. ausformuliert werden können.

Außerdem solltet ihr auf Kontraste von grafischen Elementen und Schriften achten. In den WCAG-Standards sind zahlreiche Kontrastverhältnisse für verschieden große Schriften definiert. Ist der Kontrast von Schrift und Hintergrund zu gering, wird die Lesbarkeit für Sehbeeinträchtigte schnell zum Problem, vor allem je kleiner die Schrift wird. Perfekt wäre es, wenn die Nutzer das Layout und die Schriften eurer Webseite skalieren und via Button zwischen verschiedenen Kontrasten wechseln könnten. Besonders ältere Nutzer würden sich über diese Funktion freuen, weil sie überdurchschnittlich oft an Sehbehinderungen leiden.

Ein Beispiel für ein sehr vereinfachtes, barrierefreies Design ist die Website der Stadt Augsburg. Hier kann zwischen verschiedenen Kontrasten, Farben und Schriftgrößen gewählt werden. Ein gutes Web-Beispiel inklusive Vorlese-Funktion ist die Vereinsseite des Blinden- und Sehbehindertenvereins Südbaden.

Da vielen Gehörlosen die Schriftsprache schwerfällt, wäre ein zusätzliches Angebot in leichter Sprache hilfreich. Dafür solltet ihr die Sätze kurzhalten, mit vielen Absätzen arbeiten, um den Text optisch zu gliedern und auf eine einfache Wortwahl achten. Fachbegriffe oder komplizierte Wörter solltet ihr vermeiden. Am besten packt ihr in jeden Satz nur eine Information und verzichtet komplett auf Nebensätze. Auch, wenn alle Sätze im einfachen Subjekt-Verb-Objekt-Schema gehalten werden – umso besser ist das für beeinträchtige Leser.

Einen ausführlichen Leitfaden für die leichte Sprache stellt uns das Netzwerk Leichte Sprache zur Verfügung. Doch nicht nur Hörbeeinträchtigten helfen vereinfachte Texte: Auch geistig behinderte Personen, Menschen mit Lernschwierigkeiten und Nicht-Muttersprachler, können sehr einfach formulierte Informationen besser verstehen.

Bei eingebetteten Videos solltet ihr außerdem für eine Untertitel-Option sorgen. Audio-Inhalte werden dann transkribiert und können von Personen mit verschlechtertem Hörvermögen trotzdem verstanden werden.

Besonders für Menschen mit Epilepsie oder vestibulären Störungen müssen Animationen mit Bedacht eingesetzt werden. Andernfalls können diese Schwindel oder Kopfschmerzen auslösen, wenn sie nicht dem natürlichen Bewegungsgefühl entsprechen. Schlimmstenfalls können blitzende und blinkende Animationen epileptische Anfälle auslösen.

Soweit mal ein Einblick, welche Anpassungen ihr auf eurer Website vornehmen könnt, damit sie alle Menschen uneingeschränkt nutzen können. Natürlich ist es kein Muss, alle Kriterien der Barrierefreiheit umzusetzen. Es ist schon ein erster Schritt, wenn ihr erstmal ein, zwei Barrieren überwindet, beispielsweise mit der Skalierfunktion und Kontrast-Optionen. Solltet ihr euch aber schließlich doch dazu entscheiden, mehrere Optionen für absolute Barrierefreiheit auf eurer Homepage zu implementieren, empfiehlt sich eine farblich auffallende Navigationsleiste über der eigentlichen inhaltlichen Navigationsleiste. So lassen sich beispielsweise via Tastatursteuerung mit dem Tab-Zeichen zuallererst alle Optionen der benötigten Barrierefreiheit auswählen, bevor der Nutzer sich thematisch mit der Seite auseinandersetzen kann.

Ihr wollt wissen, wie barrierefrei eure Webseite aktuell ist? Hier findet ihr eine ausführliche Checkliste, mit deren Hilfe ihr prüfen könnt, welche und wie viele Kriterien der Barrierefreiheit ihr schon erfüllt.

Wie anfangs schon erwähnt, kann barrierefreies Design viele Vorteile für Unternehmen mit sich bringen. Während ihr eure Zielgruppenreichweite bei älteren, erkrankten und behinderten Menschen erweitern könnt, bewirkt inklusives Webdesign auch Vorteile im SEO-Bereich:

✓ Mehr erreichbare Nutzer heißt mehr Traffic für eure Webseite – etwas, das Google positiv für euer Ranking bewertet.

✓ Im Umkehrschluss verringert sich auch eure Bounce-Rate (Absprungrate), weil eingeschränkte Menschen sich von barrierefreiem Design besser abgeholt fühlen und eure Seite nicht direkt wieder verlassen, wenn sie nicht inklusiv gestaltet ist.

✓ Durch den vereinfachten Inhalt und das Design eurer Webseite, verschnellert sich die Ladezeit.

✓ Durch die klare Benennung von URLs, ausführliche Alternativtexte für Bilder, eine einfach nachvollziehbare Struktur, flache Hierarchien und die vereinfachte Sprache versteht auch Google den Sinn und Kontext aller Informationen auf eurer Website viel besser. Wieder ein paar SEO-Pluspunkte für euch bzw. das Ranking eurer Website.

Um das beantworten zu können, muss man in erster Linie die Frage nach eurer Zielgruppe stellen: Wer ist eure Zielgruppe? Zählen behinderte Menschen und ältere Personengruppen explizit dazu? Denn klar ist, dass barrierefreies Design auch einen gewissen Aufwand in der Programmierung und Content-Aufbereitung bedeutet. Oft kann man jedoch nicht genau herausfinden, wie viele Teile der eigenen Zielgruppe eine Behinderung haben, weil es dazu wenige aussagekräftige Zahlen gibt. Jedoch müssen, wie erwähnt, nicht alle Kriterien der Barrierefreiheit erfüllt werden. Oft helft ihr Teilen eurer Zielgruppe schon, wenn ihr einzelne Optionen anbietet, die auch mit wenig Aufwand umgesetzt werden können – vielleicht direkt beim nächsten geplanten Website-Relaunch?

Doch auch, wenn ihr nicht genau einordnen könnt, wie betroffen eure Zielgruppe von körperlichen und geistigen Behinderungen ist: Mit einem inklusiven Webdesign übernehmt ihr soziale Verantwortung und nehmt somit eine Vorreiterrolle ein. Außerdem gibt es einige SEO-Vorteile, die euch zugutekommen können. Und wer kann zu Vorteilen gegenüber der Konkurrenz schon nein sagen?

Wir hoffen, wir konnten euer Bewusstsein zum Thema barrierefreies Webdesign schärfen und einen Eindruck geben, wie viel und teilweise auch einfach ihr etwas gegen den Ausschluss behinderter Menschen tun könnt. Wir wünschen euch viel Erfolg – mit eurem vielleicht bald barrierefreien Webauftritt!