Barrierefreies Webdesign

Barrierefreie Webinhalte

Barrierefreiheit im Internet ist ein wichtiges Thema, um sicherzustellen, dass alle Nutzer unabhängig von ihren individuellen Fähigkeiten und Einschränkungen auf Webinhalte zugreifen können. Eine barrierefreie Webseite erleichtert den Zugang und die Navigation für alle Nutzer und gewährleistet somit eine höhere Nutzerzufriedenheit. Erfahren Sie, wie Sie die Barrierefreiheit Ihrer Webseite verbessern können, um eine inklusive und zugängliche Erfahrung für alle Besucher zu schaffen.

Inhaltsverzeichnis:

1. Was ist Barrierefreiheit im Web?

2. Welche Voraussetzungen muss eine barrierefreie Webseite erfüllen?

2. Warum sollte meine Webseite barrierefrei sein?

3. Was sollte ich tun, um die Zugangsmöglichkeiten zu meiner Website zu verbessern?

4. Gibt es Tools, die mir bei diesem Prozess helfen können?

5. Welche Vorteile bietet eine barrierefreie Webseite?

1. Was ist Barrierefreiheit im Web?

Mit „Barrierefreiheit“ im Internet ist gemeint, dass eine Website so gestaltet wird, dass sie allen Menschen ohne fremde Hilfe zugänglich ist und deren Inhalte wahrnehmbar und erfassbar sind. Um Menschen, die von bestimmten Einschränkungen betroffen sind, die Inhalte verfügbar zu machen, gibt es Unterstützungstechnologien wie Vorlesefunktionen, akustische Bildbeschreibungen, Untertitel oder die Ausgabe in Blindenschrift.

Webentwickler, Programmierer und Designer können sich dabei an Richtlinien für barrierefreie Webinhalte orientieren. International durchgesetzt haben sich die Web Content Accessibility Guidelines (WCAG) in deren Entwicklung zahlreiche Empfehlungen von Verbänden und Experten eingeflossen sind. Sie werden vom World Wide Web Consortium (W3C) herausgegeben. Das W3C ist ein international besetztes Gremium, um die im World Wide Web verwendeten Techniken zu standardisieren. Mit ihren Richtlinien zur Barrierefreiheit werden Webseiten für Menschen mit einer Beeinträchtigung wie beispielsweise Blindheit, eine starke Sehbehinderung, Gehörlosigkeit, kognitive Behinderungen, aber auch Sprachbehinderungen sowie eine eingeschränkte Bewegungsfähigkeit durch eine körperliche Behinderung so aufbereitet, dass sie möglichst vollständig genutzt werden können.

2. Welche Voraussetzungen muss eine barrierefreie Webseite erfüllen?

Die WACG, übersetzt Richtlinien für barrierefreie Webinhalte, sind ein internationaler Standard und in zahlreichen Ländern die Vorlage für gesetzliche Vorgaben. Seit 2008 liegen sie in ihrer zweiten Version WACG 2.0 vor und wurden dabei an die aktuellen Entwicklungen im Webdesign angepasst. Die erste Version WACG 1.0 wurde bereits 1999 veröffentlicht und war durch die rasante Entwicklung des Internets und der mobilen Nutzung nicht mehr zeitgemäß. Die neue Version wurde deshalb technikneutral formuliert, ist als ein System angelegt und wesentlich weiter gefasst. Neben den gestalterischen Aspekten umfasst sie nun auch Prozesse (beispielsweise eine Abfolge von Aktionen bei einem Online-Kauf) und vor allem multimediale Darstellungsformen.

Die aktuellen WACG 2.0 umfassen die vier Ebenen: Prinzipien, Richtlinien, Erfolgskriterien und Techniken. Werden die Vorgaben dieser Richtlinie erfüllt, gilt eine Webseite als WCAG 2.0 konform. Diese Konformität wird in drei Stufen ausgedrückt (A, AA und AAA), denn eine Webseite muss nicht alle Kriterien der Richtlinie erfüllen.

Als niedrigste Erfüllungsstufe gilt die A-Konformität. Sie ist erreicht, wenn alle Kriterien der Stufe A berücksichtigt wurden oder diese auf einer alternativen Webseite umgesetzt wurden. Als mittlere Erfüllungsstufe gilt AA, bei der alle Kriterien der ersten Stufe erfüllt sein müssen, und die Kriterien der Stufe AA. Die höchstmögliche Entsprechung hat eine Webseite, wenn sie die Kriterien der vorherigen Stufen erfüllt und zusätzlich die AAA-Kriterien, oder eine alternative Webseite zur Verfügung stellt, auf der die Vorgaben umgesetzt wurden. Dabei kann eine Webseite sowohl nach WCAG 1.0 und auch nach WCAG 2.0 konform sein. Allerdings muss eine Webseite die Konformität insgesamt erfüllen. Werden die Kriterien nur in einzelnen Abschnitten umgesetzt, so gilt die gesamte Webseite als nicht konform.

Basis der Richtlinie sind vier grundlegende Prinzipien der Webseitengestaltung. Dabei werden jedem Prinzip mehrere Richtlinien und Kriterien zugeordnet, deren Berücksichtigung Einfluss auf die Konformität der Webseite hat. Die vier Prinzipien sind:

Das Prinzip Wahrnehmung:

Eine Webseite muss so gestaltet sein, dass sie für alle Nutzer wahrnehmbar ist. Das wird erreicht, in dem für alle Bilder, Grafiken, Videos und Audio-Inhalte ein beschreibender Text zur Verfügung steht. Dabei ist zu beachten, dass die alternative Darstellung nicht zu Verlusten bei den Inhalten führt. Außerdem müssen sie in ihrer Gestaltung deutlich von den anderen Inhalten der Webseite unterscheidbar sein.

Das Prinzip Bedienbarkeit:

Diese Interaktion wird durch eine definierte Benutzerschnittstelle, mit der ein Zugriff alle Inhalte möglich ist. Als übliche Benutzerschnittstelle gilt dabei eine Tastatur in Kombination mit einer Maus oder einem Touchpad. Außerdem müssen sogenannte Tastaturfallen vermieden werden. Als Tastaturfalle gelten Bereiche, die nicht mit den üblichen Bedienmustern verlassen werden können. Dazu gehört auch eine Navigation, die schnell erfassbar und mühelos zu bedienen ist. Extreme visuelle Reize sollten reduziert werden, um mögliche Krampfanfälle zu vermeiden.

Das Prinzip Verständlichkeit:

Alle Bereiche einer Webseite sollten in ihrer Bedienbarkeit nachvollziehbar sein und ihre Inhalte für jedermann verständlich. Das wird durch ein durchschnittliches Leseniveau erreicht und die Vermeidung von nicht geläufigen Fremdwörtern, Abkürzungen und Mehrdeutigkeiten. Damit Webseiten flüssig genutzt werden können, sollte der Aufbau von Inhalten und Bedienung zu vorhersehbaren Ereignissen führen. Insbesondere bei Interaktionen in Online-Shopping oder beim Online-Banking müssen Fehlerquellen bei der Eingabe vermieden werden.

Das Prinzip Robustheit: 

Ein Webseite gilt dann als robust, wenn sie die Nutzung möglichst vieler Webstandards ermöglicht. Das bedeutet die verlustfreie Nutzung von Webbrowsern, Dokumenten und Formularen sowie multimediale Techniken. Dabei sollte sowohl eine Abwärtskompatibilität gewährleistet sein wie auch eine Nutzung zukünftiger Techniken.

2. Warum sollte meine Webseite barrierefrei sein?

Die Idee des Internets ist es, für alle Menschen zugänglich zu sein. Eine barrierefreie Webseite schafft diese Möglichkeit auch für Menschen mit Beeinträchtigungen. Rund 15 bis 20 Prozent der Weltbevölkerung sind teilweise auf barrierefreie Inhalte angewiesen. Immerhin 3 Prozent der Weltbevölkerung haben starke Beeinträchtigungen der Sehfähigkeit oder sind sogar blind. Ebenso viele Menschen haben motorische Einschränkungen und können nur schwer eine Tastatur oder eine Maus bedienen.

Hinzu kommt eine zunehmend älter werdende Gesellschaft in nahezu allen Industrieländern. Viele der älter werdenden Menschen sind in den vergangenen zwanzig Jahren mit der Nutzung des Internet vertraut gewesen. Im Alter schränken sich allerdings bestimmte Fähigkeiten ein, beispielsweise werden die Augen schlechter. Der Anteil der Menschen, die auf barrierefreie Inhalte angewiesen ist, wird demnach voraussichtlich weiter steigen.

Zudem spielt Barrierefreiheit bereits jetzt und mit steigender Tendenz eine wichtige Rolle für den Erfolg einer Webseite. Diese kann nur erfolgreich sein, wenn sie auch gefunden wird. Suchmaschinenanbieter wie Google haben diesen Trend längst erkannt und berücksichtigen die barrierefreie Gestaltung einer Webseite für ihre Suchergebnisse. Experten rechnen damit, dass Barrierefreiheit neben gutem Content zukünftig ein immer wichtigerer Rankingfaktor wird.

Wenn eine Webseite von einer Institution des öffentlichen Sektors betrieben wird, ist Barrierefreiheit verpflichtend. Die Richtlinie (EU) 2016/2102 des Europäischen Parlaments gilt seit dem 23. September 2020 für alle Webseiten und mobile Anwendungen in den Ländern der Europäischen Union. Sie basiert auf dem WACG-Standard und gilt für alle staatlichen Einrichtungen und im staatlichen Auftrag erbrachte Dienstleistungen.

3. Was sollte ich tun, um die Zugangsmöglichkeiten zu meiner Website zu verbessern?

Der erste Schritt auf dem Weg zu einer barrierefreien Webseite ist die Entrümpelung. Alle Inhalte, die nicht zum Kern einer Webseite gehören und den Besuchern keinen zusätzlichen Nutzen bieten, sollten von der Webseite verschwinden. So entsteht eine klarere Struktur, die es Menschen mit Beeinträchtigung – und nicht nur denen – erleichtert, die Inhalte zu nutzen. Diese Struktur sollte sich dann auch in der Navigation wiederfinden und dem Besucher jederzeit darüber informieren, wo genau er sich auf der Webseite befindet. Hilfreich ist auch eine klare Benennung der URL, also der Adresse einer Webseite oder eines Beitrags. Eine sogenannte sprechende URL verrät bereits den Inhalt der Seite und wird zudem von Google als Rankingfaktor gewertet.

Die gesamte Struktur einer Webseite sollte so aufgebaut sein, dass mit wenigen Klicks (max. 3) das gewünschte Ziel erreicht wird. Je deutlicher diese Struktur erkennbar ist, umso leichter findet sich ein Besucher zurecht. Wenn die Inhalte dann noch in verständlicher Sprache geschrieben sind und die Schrift in ihrer Größe anpassbar ist, sind weitere Punkte auf dem Weg zu einer barrierefreien Webseite erfüllt.

Die alternative Beschreibung von Bildern, Grafiken, Videos oder eingebetteten Social-Media-Inhalten sollte ebenfalls zur Grundausstattung einer zeitgemäßen Webseite gehören. Damit werden nicht nur Kriterien der Barrierefreiheit erfüllt, sondern Google belohnt dieses Vorgehen mit einem besseren Ranking.

Gibt es Tools, die mir bei diesem Prozess helfen können?

Das erste und einfachste Tool ist der Browser. Mit ihm lässt sich die Logik einer Webseite überprüfen. Das geht am einfachsten, wenn im Browser die grafischen Elemente ausgeblendet werden. Dafür können die sogenannten CSS-Styles im Browser deaktiviert werden. Die Webseite erscheint im Textmodus und entlarvt sofort logische Fallen.

Mit der Tastatur lässt sich die Barrierefreiheit ebenfalls überprüfen. Einfach mit der Tabulatortaste durch die Webseite klicken. Wenn nicht alle Navigationsbereiche erreichbar sind, ist die Webseite nicht barrierefrei.

Der Farbmodus der Webseite spielt ebenfalls eine Rolle für die Barrierefreiheit, vor allem für farbenblinde oder sehbehinderte Menschen. Mit speziellen Browsererweiterungen lässt sich eine Webseite mühelos in einen Graustufen-Modus verwandeln. Sind dann einzelne Elemente nicht mehr sichtbar, werden die Kriterien nicht erfüllt. Ob der Kontrast ausreichend ist, lässt sich auch mit dem WCAG Contrast Checker überprüfen. Diesen gibt es als Erweiterung für einige Browser. Mit wenigen Klicks lässt sich Konformität der Webseite nach WCAG 2.0 in diesem Punkt feststellen.

Ob die Inhalte für Webseiten-Besucher mit einer Hörbehinderung zu nutzen ist, lässt sich einfach mit der Sprachfunktion auf dem PC überprüfen. Inhalte der Webseite können auch mit Browser-Erweiterungen vorgelesen werden. Sind diese dann immer noch verständlich und die Navigation funktioniert über direkte Kommunikation, sind weitere Kriterien erfüllt.

Mit der Bowser-Erweiterung Lighthouse lassen sich verschiedene Tests für eine Webseite durchführen. Lighthouse ist fester Bestandteil von Google Chrome und wird mit der Taste F12 und einem Klick auf weitere Tools aufgerufen. Lighthouse führt dann einen Test der Webseite durch und gibt am Ende eine Übersicht aus, in der alle nicht konformen Elemente aufgeführt werden und in einem Score-Wert zusammengefasst sind. Je höher dieser Wert ist, umso näher ist er an der WCAG 2.0-Konformität.

Ganze Webseiten lassen sich auch mit dem BITV-Testverfahren überprüfen. Grundlage für den Test ist die Barrierefreie-Informationstechnik-Verordnung (BITV 2.0), die bereits die neuesten WCAG 2.1-Anforderungen enthält. Mithilfe einer 60 Punkte umfassenden Checkliste kann die eigene Webseite umfassend und zuverlässig überprüft werden. Jeder Prüfschritt des Accessibility Audits wird ausführlich erläutert. Maximal sind hundert Punkte zu erreichen.

Die WAVE-Toolbar ist eine Online-Anwendung zur Überprüfung von Webseiten. Um die eigene Webseite überprüfen zu lassen, gibt man unter WebAIM.org die URL ein. Nach einer schnellen Überprüfung werden die Ergebnisse sofort mit Erläuterungen angezeigt.

Welche Vorteile bietet eine barrierefreie Webseite?

Barrierefreie Webseiten sind nur für behinderte Menschen, ist ein weit verbreitetes Missverständnis von Barrierefreiheit im Internet. Zum einen ist es ein Gebot der Fairness, eine Webseite möglichst vielen Menschen zugänglich zu machen. Der Gedanke der Inklusion ist inzwischen in unserer Gesellschaft fest verankert. Zum anderen gibt es weitere Gründe, eine Webseite so aufzubauen, dass sie den WCAG 2.0-Anforderungen genügt. Beispielsweise ist ein barrierefreier, logisch nachvollziehbarer Kaufvorgang bei einem Online-Shop für jeden Besucher ein Vorteil. Niemand möchte sich mühevoll durch eine Webseite navigieren, um etwas zu kaufen.

Zudem fordert der Umgang mit der Barrierefreiheit einen schonungslosen Blick auf die eigene Webseite und die zugrunde liegende Logik. Wenn eine Webseite klar strukturiert ist und die Absicht des Anbieters deutlich wird, dann fühlen sich alle Besucher angesprochen. Diese Klarheit führt oft auch zu besseren UX Designkonzepten und den Verzicht auf überflüssige Buttons und Animationen.

Als dritten und nicht unwichtigsten Grund gilt es auch die Auffindbarkeit zu beachten. Für die großen Suchmaschinenbetreiber wie Google und Bing gehört Barrierefreiheit zu den Rankingfaktoren. Ihre Bedeutung wird voraussichtlich noch weiter zunehmen.

Dieser Text wurde als SEO-Content für eine Marketingagentur geschrieben.