Barrierefreies Web

Barrierefreies Web
Jennifer Weyers- exovia Gründerin
Founder & CEO exovia Webdesign Agentur Spezialistin für Designkonzepte und responsives Webdesign
12.01.2025 09:22

Die Gewährleistung der Barrierefreiheit wird zunehmend auch für Websites und Web Apps wichtiger. Man spricht man in diesem Zusammenhang auch von dem barrierefreien Web. Doch was genau verbirgt sich dahinter? Welche Barrieren müssen beseitigt werden, und was ist nötig, um ein wirklich barrierefreies Web zu schaffen? All das erfährst Du in diesem Artikel.

Was ist das barrierefreie Web?

Das barrierefreie Web steht für ein Web, bei dem Websites, Technologien und Tools so konzipiert, gestaltet und entwickelt sind, dass das Web von allen Menschen genutzt werden kann. Inklusive Menschen mit Behinderungen, Beeinträchtigungen sowie ältere Menschen.

Sprich, dass jede Person – unabhängig von Ihren Fähigkeiten oder Einschränkungen – das Web …

  • wahrnehmen und verstehen
  • navigieren und mit ihm interagieren kann
  • sowie einen Beitrag zum Web leisten kann.

Die Stärke des Webs

Zitat - The Power of Web von Tim Barners-Lee

Tim Berners-Lee, der Erfinder des Webs, betonte bereits 1990: “The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.” Die Stärke des Webs liegt in seiner Universalität. Der Zugang für alle, unabhängig von einer Behinderung, ist ein wesentlicher Aspekt.

Und tatsächlich beseitigt das Web bereits viele Kommunikations- und Interaktionsbarrieren, mit denen Menschen in der physischen Welt konfrontiert sind. So können Menschen mit körperlichen Einschränkungen beispielsweise bequem von zu Hause aus auf Informationen zugreifen, ohne in eine Bibliothek gehen zu müssen. Es bietet hervorragende Voraussetzungen, um von möglichst vielen Menschen genutzt werden zu können – doch barrierefrei ist es derzeit noch nicht.

Warum nicht?

Die Gestaltung des Webs

Dass das Web nicht von jedem gut genutzt werden kann, liegt weniger am Web selbst oder an den Menschen, die es nutzen wollen. Vielmehr liegt es in der Art und Weise, wie das Web gestaltet ist. Das folgende Video ist zwar leider nicht in der besten Qualität, zeigt aber, wie ich finde, sehr schön, was hiermit gemeint ist.

YouTube erlauben

info

Dein Datenschutz liegt uns am Herzen. Erst mit deiner Zustimmung verbinden wir dich mit externen Servern.

DSGVO-Lösung von exovia
Webdesign Agentur

* Mit Klick auf einen YouTube-Button akzeptierst Du die Datenschutzbestimmungen von YouTube

Man spricht in diesem Zusammenhang auch von sozialer Behinderung. Eine Person ist nicht behindert, sondern wird behindert. Oder anders ausgedrückt: Die Behinderung entsteht durch die Diskrepanz zwischen dem Design und den Bedürfnissen der Person.

Wobei hierbei mit Design nicht nur die optische Gestaltung von Websites und Web-Apps gemeint, sondern auch deren Funktionalität, Inhalte, Semantik und Struktur sowie das reibungslose Zusammenspiel mit Browsern und Assistenztechnologien. Ebenso wichtig ist die Gestaltung der Browser und Assistenztechnologien selbst.

Auf die 3 wesentlichen Aspekte, auf die es für ein barrierefreies Web ankommt, gehe ich daher weiter unten noch ein. Doch zuerst möchte ich Dir einen Überblick über die häufigsten Barrieren geben, auf die Menschen mit Behinderungen und ältere Menschen im Web stoßen – und wie deren Beseitigung allen Menschen zugutekommen kann.

Welche klassischen Barrieren gibt es im Web?

Um ein barrierefreies Web zu gestalten, ist es wichtig zu verstehen, wo überall Barrieren auftreten können. Da jeder Mensch individuell ist, kann auch jeder mit unterschiedlichen Herausforderungen konfrontiert sein. Es gibt jedoch einige typische Barrieren, die immer wieder vorkommen. Schauen wir uns diese genauer an:

Visuelle Barrieren

Visuelle Barrieren im Web

Visuelle Barrieren betreffen nicht nur Menschen, die blind sind, sondern auch Personen mit eingeschränkter Sehfähigkeit oder Augenkrankheiten wie Grauem Star, Menschen mit Farbenblindheit oder diejenigen, die Farbnuancen nicht gut unterscheiden können, oder auch einfach trockene Augen haben.

Da das Web stark visuell geprägt ist, sind Barrieren in diesem Bereich oft besonders hinderlich. Stell dir vor …

  • Du musst ein Online-Formular ausfüllen, und die Pflichtfelder sind in Rot markiert – aber du kannst Rot nicht sehen.
  • Du kannst bestimmte Farben nicht unterscheiden und siehst ein Kreisdiagramm, bei dem für Dich alle Farben gleich aussehen.
  • Der Text auf einer Website ist zu klein. Du zoomst, aber dadurch wird der Text über den Bildschirmrand hinaus vergrößert, und Du musst ständig nach links und rechts scrollen, um einen Satz zu lesen. Wenn Du zurückscrollst, verlierst Du die Zeile, in der Du gerade warst.
  • Du bist blind und nutzt einen Screenreader, um Websites zu navigieren. Doch obwohl die Website optisch gut gestaltet ist, fehlen im Code wichtige Kennzeichnungen, wie z.B. Überschriften. Dadurch hast Du Schwierigkeiten, Dich zu orientieren. Diese Orientierungslosigkeit wird durch Bilder ohne Bildbeschreibungen und „mehr“-Links verstärkt, da Du nicht weißt, was Dich per Klick auf den Links erwartet.
  • Du hast ein eingeschränktes Sichtfeld und kannst nur den Fokusbereich wahrnehmen. Du willst die Schriftgröße verkleinern, um mehr auf einmal sehen zu können – doch die Einstellungen der App erlauben dies nicht.

Ich könnte mit der Liste ewig weitermachen. Doch ich denke, diese Beispiele verdeutlichen bereits, dass Menschen mit visuellen Barrieren sich wünschen, das Web so anpassen zu können, dass es ihren individuellen Bedürfnissen gerecht wird. Sie möchten nicht nur darauf angewiesen sein, dass das Design für sie passt, sondern selbstständig agieren und das Design anpassen können.

Barrierefreies Design ermöglicht genau das – durch individuelle Anpassungen wie Schriftgrößen und Farbkontraste oder durch saubere Codierung, die von Browsern und Assistenztechnologien wie Screenreadern korrekt interpretiert werden kann.

Akustische Barrieren

Akustische Barrieren im Web

Akustische Barrieren betreffen vor allem Menschen, die taub oder schwerhörig sind. Sie können aber auch zu Hindernissen für Personen werden, die sich in einer Umgebung befinden, in der kein Ton erlaubt ist, oder für die das Umfeld zu laut ist.

Klassische Barrieren im Web sind daher oft Videos, Podcasts oder auch Videokonferenzen, die beispielsweise für Besprechungen oder Lehrveranstaltungen genutzt werden.

Stell Dir vor, …

  • Du möchtest die Lautstärke anpassen, aber der Video-Player hat keinen Lautstärkeregler.
  • Es gibt ein Video zu einem spannenden Thema, doch es ist nur in Gebärdensprache verfügbar. Leider verstehst du keine Gebärdensprache, und es gibt weder ein Transkript noch Untertitel zum Video.
  • Dir wurde ein Podcast empfohlen, doch da du taub bist, kannst du ihn nicht hören.
  • Du bist taub und hast dich für ein Studium eingeschrieben. Bei Veranstaltungen vor Ort gibt es immer einen Gebärdensprachdolmetscher, doch bei den Videokonferenzen fehlt diese Unterstützung.

Alles Barrieren, die es nicht geben muss. Deshalb ist es besonders wichtig, dass …

  • Transkripte für Videos und Podcasts sowie Untertitel für Videos zur Verfügung stehen,
  • Medienplayer die Möglichkeit bieten, Untertitel anzuzeigen, Videos zu pausieren und die Lautstärke zu regulieren,
  • und idealerweise Inhalte auch in Gebärdensprache bereitgestellt werden, da Menschen, die Gebärdensprache als erste Sprache gelernt haben, oft auch Schwierigkeiten beim Lesen von Texten haben.

Sprachliche Barrieren

Sprachliche Barrieren im Web

Bei den sprachlichen Barrieren geht es weniger darum eine fremde Sprache nicht zu beherrschen, sondern eingeschränkt oder gar nicht sprechen zu können. Gründe hierfür können z.B. Mutismus, Stottern, Behandlungen wie Chemotherapien sein oder auch schlicht, weil man sich an einem Ort wie in der einer Bibliothek befinden, wo es nicht erlaubt ist laut zu sein.

Jetzt könnte man meinen, dass das Web keine sprachlichen Barrieren hat. Doch stell dir folgende Situationen vor:

  • Du möchtest eine Anfrage stellen, aber die einzige Kontaktmöglichkeit, die Du auf der Website findest, ist eine Telefonnummer.
  • Dein Ziel ist es, Informationen in einer mobilen App zu suchen, doch es gibt nur eine Sprachsuche, ohne alternative Eingabemöglichkeiten.
  • Du nimmst an einer Videokonferenz teil und möchtest eine Frage stellen, doch der Chat ist nicht freigeschaltet.

In solchen Fällen ist es wichtig, immer eine alternative Möglichkeit zur schriftlichen Kommunikation anzubieten, wie z.B. eine E-Mail-Adresse oder ein Kontaktformular für die Kontaktaufnahme.

Barrieren aufgrund Kognitiver Behinderungen oder Lernschwierigkeiten

Viele der Herausforderungen, die Menschen mit Seh-, Hör-, Körper- und Sprachbehinderungen erleben, betreffen auch Personen mit kognitiven und Lernbehinderungen.

Stell Dir vor …

  • Du suchst einen bestimmten Menü-Link oder Informationen auf einer Website, doch die Navigation und das Seitenlayout sind so komplex, dass sie schwer zu verstehen und zu nutzen sind.
  • Auf der Website befinden sich viele Anzeigen, die Videos automatisch abspielen. Du möchtest den Text lesen, wirst aber ständig abgelenkt.
  • Du liest einen juristischen Text, der aus langen, komplizierten Sätzen und Begriffen besteht, die Du normalerweise nicht verwendest. Es fällt schwer, dranzubleiben, obwohl der Inhalt wichtig ist.

Ich finde gerade bei diesen Barrieren ist es leicht nachvollziehbar, dass ihre Beseitigung nicht nur Menschen mit kognitiven und Lernbehinderungen, sondern allen zugutekommt.

Beispielsweise durch …

  • ein klares, intuitives Menü, mit dem man schnell findet, wonach man sucht.
  • Die Möglichkeit, durch responsives Design den Bildschirm kleiner zu machen, sodass weniger Inhalte auf einmal zu sehen sind und man sich besser konzentrieren kann.
  • Die Option, Videos – insbesondere im Rahmen von Werbeanzeigen – auszuschalten oder zu pausieren.
  • Verständliche Sätze sowie Bilder und Grafiken, die den Inhalt verdeutlichen.

Nicht für Assistenztechnologie geeignet

Assistenztechnologie fürs Web

Neben adaptiven Möglichkeiten wie Zoomen gibt es inzwischen großartige Assistenztechnologien, die Menschen das Web zugänglich machen. Hierzu gehören unter anderem:

  • Screenreader,
  • Text-to-Speech,
  • Sprachsteuerung,
  • Switch Control,
  • Braille-Tastaturen,
  • spezielle Keyboards,
  • (Computer-) Brillen,
  • und vieles mehr.

Damit diese Assistenztechnologien jedoch wirklich einen Mehrwert bieten, müssen Webtechnologien, Browser, Websites und Apps so gestaltet sein, dass das Zusammenspiel nahtlos funktioniert.

Stell Dir vor …

  • Dein Screenreader liest den Text nicht in der richtigen Reihenfolge vor.
  • Du verwendest Sprachsteuerung, aber der Button enthält keine Zusatzinformation, sodass unklar ist, wie du ihn per Sprache aktivieren kannst.
  • Du navigierst mit einer Braille-Tastatur oder einem speziellen Keyboard, doch das Menü lässt sich damit nicht öffnen.

All diese Barrieren müssen nicht sein. Gut strukturierte und programmierte Websites und Apps unterstützen die Nutzung von Assistenztechnologien und tragen so zu einem barrierefreien Web bei. Beispielsweise in dem die Bedienbarkeit einer Website oder Web App auch vollständig über eine Tastatur möglich ist.

Eine Barriere – verschiedene Lösungen

Es ist entscheidend zu berücksichtigen, dass verschiedene Personen vor der gleichen Barriere stehen können und trotzdem unterschiedliche Lösungen brauchen.

Nehmen wir z.B. an, dass eine Person im Alter sehr schlecht sehen kann und daher vor denselben Problemen steht wie eine Person, die von Geburt an kaum oder gar nicht sehen kann.

Selbst wenn diese ältere Person dieselben Hilfsmittel wie blinde Menschen zur Verfügung hätte, kann das Erlernen der Assistenztechnologie eine zusätzliche Hürde darstellen. Viele ältere Personen bevorzugen es daher, die Schriftgröße zu vergrößern, anstatt die Braille-Schrift zu erlernen.

Dies ist nur ein kleines Beispiel, doch für die Gestaltung des Webs ist es wichtig zu berücksichtigen, dass es nicht immer die eine Lösung für alle gibt. Flexible Anpassungsmöglichkeiten zu schaffen, wie in diesem Fall Zoomen und Braille-Kompatibilität, hilft den betroffenen Personen, ihre individuellen Bedürfnisse zu erfüllen

Wie kann ein barrierefreies Web realisiert werden?

Damit ein wirklich barrierefreies Web entsteht, müssen vor allem drei wesentliche Aspekte einwandfrei zusammenspielen: Technologien, Richtlinien und Menschen.

Doch was steckt hinter diesen drei Punkten?

Technologien

Der Begriff „Technologien“ ist hier weit gefasst und umfasst:

  • Assistenztechnologien wie Screenreader und Braille-Tastaturen,
  • Autorentools zum Erstellen und Veröffentlichen von Websites, Apps und Inhalten,
  • Bewertungstools, um sowohl die Barrierefreiheit von Websites als auch die Codequalität zu testen (z.B. HTML-Validatoren),
  • und User Agents wie Webbrowser und Mediaplayer.

Richtlinien

Richtlinien für ein barrierefreies Web

Damit weltweit barrierefreie Inhalte erstellt und für alle Menschen zugänglich gemacht werden können, sind klare Standards nötig. Das World Wide Web Consortium (W3C) hat deshalb im Rahmen der Web Accessibility Initiative (WAI) Richtlinien entwickelt, die kontinuierlich weiterentwickelt werden. Hierzu zählen:

  1. WCAG:  Die sogenannten Web Content Accessibility Guidelines bestehen derzeit aus 13 Einzelrichtlinien inklusive Erfolgskriterien. Sie legen fest, wie Webinhalte barrierefrei gestaltet werden können. Zu diesen Inhalten zählen insbesondere klassische Inhalte wie Texte, Bilder, Videos und Audio, aber auch Code, Markup, Struktur und Präsentation.
  2. ATAG: Die Authoring Tool Accessibility Guidelines definieren, wie Autorenwerkzeuge barrierefrei gestaltet werden können, und legen fest, wie Autoren mit diesen Tools barrierefreie Webinhalte erstellen, die den WCAG entsprechen. Autorenwerkzeuge umfassen zum Beispiel Software zur Erstellung von Websites sowie Content-Management-Systeme (CMS), Blogs und Social Media, um Inhalte barrierefrei zu veröffentlichen.
  3. UAAG: Die User Agent Accessibility Guidelines bieten eine Anleitung zur barrierefreien Gestaltung von User Agents, also z.B. Browsern, Browser-Erweiterungen, Mediaplayern und Screenreadern.

Diese Richtlinien basieren auf den grundlegenden technischen Spezifikationen des Webs, wie HTML und CSS. Sie inkludieren außerdem spezielle Spezifikationen wie die WAI-ARIA (Accessible Rich Internet Applications Suite) mit ein, die sich direkt auf Barrierefreiheit beziehen.

Personen

Der Aspekt „Personen“ ist nicht zu unterschätzen. Hierzu zählen nicht nur diejenigen, die von Barrieren betroffen sind, sondern auch diejenigen, die zur Gestaltung des Webs beitragen. Auf beiden Seiten muss Wissen aufgebaut und angewendet werden, um ein barrierefreies Web zu schaffen und zu nutzen.

So müssen Programmierer, Designer, Content-Ersteller und Qualitätstester z.B. über das Know-how verfügen, barrierefreie Websites zu gestalten, zu testen und zu optimieren. Gleichzeitig müssen z.B. behinderte Personen wissen, wie sie einen Browser an ihre Bedürfnisse anpassen oder mit einer Braille-Tastatur den Inhalt einer Website lesen können.

Auch Unternehmer spielen eine wichtige Rolle. Sie müssen die Relevanz eines barrierefreien Webs verstehen und in ihrem Unternehmen fördern, damit sowohl ihre Angestellten als auch externe Partner Produkte und Dienstleistungen tatsächlich barrierefrei gestalten.

Das Zusammenspiel

Alle drei – Technologien, Richtlinien und Personen – spielen eine entscheidende Rolle, um das Web barrierefrei zu gestalten und zugänglich zu machen. Doch nur wenn alle drei Bereiche harmonisch zusammenwirken, kann ein barrierefreies Web tatsächlich Wirklichkeit werden.

Fazit – das barrierefreie Web

Das barrierefreie Web ist aktuell noch eine Zukunftsvision, doch eine, die schrittweise realer wird. Vor allem durch Personen und Unternehmen, die sich aus den unterschiedlichsten Gründen weltweit für ein barrierefreies Web starkmachen und Lösungen hierzu entwickeln. Aber auch Gesetze, die staatliche Institutionen und private Website-Betreiber zur Barrierefreiheit verpflichten, tragen dazu bei.

Welche Gründe es gibt, Websites barrierefrei zu gestalten, und wie die gesetzliche Lage dazu in Deutschland aussieht, erfährst du in den nächsten Artikeln.

Hast du Fragen zum barrierefreiem Web oder benötigst Unterstützung bei der Umsetzung einer barrierefreien Website oder Web-App? Dann nimm gerne Kontakt mit uns auf.

Mehr Themen