Häufig werde ich angefragt, ob ich eine bestehende Website barrierefrei umgestalten kann und was das kostet. Oder ob ich bei einem neuen Web-Projekt den Punkt Barrierefreiheit ins Budget mit einplanen könnte. Dabei ist vielen nicht ganz klar, was mit diesem Schlagwort eigentlich gemeint ist und mit welchen Kosten sie rechnen müssen.
Das deutsche Behindertengleichstellungsgesetz (BGG) schreibt vor, dass öffentlich zugängliche Websites und mobile Anwendungen barrierefrei gestaltet sein müssen, um Menschen mit Behinderungen den gleichberechtigten Zugang zu den Inhalten zu ermöglichen. Dies gilt sowohl für staatliche als auch für private Anbieter*innen. Zudem ist Deutschland seit 2009 Vertragsstaat der UN-Behindertenrechtskonvention, die eine uneingeschränkte Teilhabe von Menschen mit Behinderungen an der Gesellschaft fordert, auch im Bereich digitaler Angebote.
Ok, ihr seid überzeugt und möchtet das Thema Barrierefreiheit endlich angehen. Doch was kostet nun eine barrierefreie Website? Wie immer: Es kommt darauf an. Handelt es sich um eine bestehende Seite oder wird sie neu erstellt? Möchtet ihr generell Barrieren abbauen oder müsst ihr spezielle Richtlinien erfüllen?
Was bedeutet überhaupt Barrierefreiheit bei Websites?
Auch im Internet wird Barrierefreiheit immer wichtiger, denn jeder sollte die Möglichkeit haben, auf Webinhalte zuzugreifen, unabhängig von seinen körperlichen oder geistigen Fähigkeiten.
Barrierefreiheit bezieht sich auf die Gestaltung von Websites, die es Menschen mit Behinderungen ermöglicht, sie ohne Einschränkungen zu nutzen. Dazu zählen beispielsweise Sehbehinderungen, Hörbehinderungen, motorische Einschränkungen oder kognitive Beeinträchtigungen.
Der Begriff „Barrierefreiheit“ ist jedoch nicht ganz korrekt, da es kaum möglich ist, eine Website vollständig barrierefrei zu gestalten. Es geht vielmehr darum, Barrieren zu minimieren und den Zugang so einfach wie möglich zu gestalten. Deshalb wird oft der Begriff „Barrierearmut“ verwendet. Noch treffender ist jedoch der englische Begriff „Accessibility“, da hiermit die Möglichkeit zur Zugänglichkeit und Nutzbarkeit beschrieben wird.
Typische Barrieren auf Websites
- Einschränkungen des Sehens:
Für Menschen mit Sehbehinderungen kann es schwierig sein, kleine oder unleserliche Schriften zu erkennen oder Inhalte ohne alternative Beschreibungen oder Textversionen wahrzunehmen. Eine barrierefreie Website sollte daher eine klare und gut lesbare Schriftart, angemessene Schriftgrößen und Farbkontraste sowie alternative Textversionen und Beschreibungen für Bilder und Grafiken anbieten. - Einschränkungen des Hörens:
Menschen mit Hörbehinderungen können Schwierigkeiten haben, Audioinhalte wie Videos oder Podcasts zu hören oder zu verstehen. Eine barrierefreie Website sollte daher Untertitel oder Transkripte für Audioinhalte bereitstellen, um sicherzustellen, dass die Inhalte für alle zugänglich sind. - Motorische Einschränkungen:
Menschen mit motorischen Einschränkungen haben möglicherweise Schwierigkeiten beim Navigieren auf einer Website oder beim Klicken auf kleine Schaltflächen oder Links. Eine barrierefreie Website sollte daher eine klare und intuitive Navigation, leicht zu klickende Schaltflächen und eine Tastaturbedienbarkeit anbieten, um sicherzustellen, dass alle Nutzer*innen die Website problemlos verwenden können. - Technische Einschränkungen:
Die Inkompatibilität mit älteren Browsern oder das Fehlen von Lautsprechern können ebenfalls Barrieren darstellen. Eine barrierefreie Website sollte daher auf Kompatibilität achten und alternative Optionen bieten, um den Zugang zu Audioinhalten zu ermöglichen.
Durch die Berücksichtigung dieser Barrieren könnt ihr sicherstellen, dass die Website für alle zugänglich und benutzerfreundlich ist, unabhängig von möglichen Einschränkungen.
Veränderung einer bestehenden Website
Overlay-Tools
Overlay-Tools sind Softwarelösungen, die dazu dienen, bestehende Websites barrierefreier zu machen. Diese Tools werden als Overlay bezeichnet, da sie sich als Schicht über die bestehende Website legen und so die Barrierefreiheit durch Funktionen wie automatische Textvergrößerung oder alternative Beschreibungen von Bildern und Grafiken verbessern.
Die Verwendung von Overlay-Tools hat den Vorteil, dass sie schnell und einfach zu implementieren sind, ohne dass die ursprüngliche Website überarbeitet werden muss. Dadurch können Barrieren schnell und unkompliziert beseitigt werden.
Es gibt jedoch auch Kritik, da sie oft nicht alle Aspekte der Barrierefreiheit abdecken und nicht immer zuverlässig funktionieren. Insbesondere bei komplexen Websites kann es vorkommen, dass sie nicht in der Lage sind, alle Barrieren zu identifizieren und zu beseitigen.
Bekannte Anbieter von Overlay-Tools sind beispielsweise UserWay, accessiBe oder AudioEye. Diese Anbieter bieten verschiedene Optionen für die Implementierung von Overlay-Tools an, darunter eine Integration durch das Einbetten eines Skripts in die Website oder durch die Verwendung von Browser-Erweiterungen.
Audit & Anpassung
Ein Accessibility-Audit wird durchgeführt, um Barrieren auf einer Website zu identifizieren und Maßnahmen zur Verbesserung der Barrierefreiheit zu empfehlen. Dabei werden die Website-Struktur, die Navigation, die Farben, die Schriftarten, die Bilder und alle anderen Elemente, die die Benutzerfreundlichkeit beeinträchtigen könnten, überprüft. Ein Accessibility-Audit ist in der Regel zeitaufwendiger und arbeitsintensiver als die Verwendung von Overlay-Tools, da manuelle Anpassungen an der Website vorgenommen werden müssen.
Kostenlose Tools für einen ersten Überblick
Es gibt einige kostenlose Tools, mit denen man automatisiert ein Accessibility-Audit durchführen kann. Diese Tools scannen die Website und geben in der Regel eine Liste von Problemen und Empfehlungen aus. Hier sind einige Beispiele:
- Wave – Dies ist ein Online-Tool, das eine Vielzahl von Tests durchführt, um sicherzustellen, dass die Website den gängigen Standards entspricht.
- Axe – Dieses kostenlose Browser-Plugin für Chrome bietet eine schnelle und einfache Möglichkeit, um die Barrierefreiheit eurer Website zu testen.
- AChecker – Ein Online-Tool, das eine Vielzahl von Tests durchführt, um sicherzustellen, dass die Website barrierefrei ist.
- BITV Selbsttest – Etwas sperrig und nur eine Seite wird geprüft
Es ist jedoch wichtig zu beachten, dass automatisierte Tests nicht immer alle Probleme auf einer Website erkennen können. Daher sollte man diese Tools nur als Ausgangspunkt betrachten.
Manueller Check eurer Website
Sind erst einmal die wichtigsten Probleme ausgebügelt, geht es an die Feinheiten. Und wie immer, ab diesem Punkt werden die Maßnahmen sehr individuell. Als Tipp generell gilt, schaut euch die Website aus fremden Augen an. Seid neugierig! Versucht mit der Tab-Taste eine bestimmte Info zu erreichen. Probiert einen Screen Reader aus. Beachtet auch die Logik von Navigation und Inhalt.
Hier ein paar konkrete Vorschläge:
- Gibt es eine klare und konsistente Navigation? Gibt es mehrere Wege, um an die wichtigen Informationen zu gelangen?
- Testet eure Website mit einem Screen Reader. Prüft, ob alle Inhalte, Navigationsleisten und Formulare lesbar sind.
- Versucht die Kontaktmöglichkeit mit der Tab-Taste zu erreichen.
- Haben alle Links beschreibende Texte und sind sie in einer logischen Reihenfolge angeordnet?
- Haben alle relevanten Bilder und Grafiken eine alternative Beschreibung? Sind Schmuckelemente mit einem leeren Alt-Text versehen?
- Auch wenn Farbkombinationen einen bestimmten Mindest-Kontrast aufweisen, können sie schwer zu lesen sein. Überprüft eure Website unter erschwerten Bedingungen wie z.B. auf kleinen Geräten oder in der Sonne.
- Testet die Website auf älteren Browsern.
Barrierefreiheit bei einer neuen Website
Wenn die Barrierefreiheit von Anfang an im Fokus steht, können hohe Kosten vermieden werden. Hierfür sollten bereits bei der Gestaltung der Website bestimmte Aspekte berücksichtigt werden, zum Beispiel eine lesbar gestaltete Schrift und ausreichend hohe Kontraste. Auch die Verwendung von Farben sollte überlegt sein, da manche Farbkombinationen für Menschen mit Sehbehinderungen schwierig zu erkennen sind. Durch die Einhaltung bestimmter Standards, wie zum Beispiel der WCAG 2.1, kann eine barriereärmere Website erstellt werden. Das Achten auf Barrierefreiheit bei der Erstellung von Websites ist nicht nur für bestimmte Gruppen von Nutzern wichtig, sondern für alle. Eine barrierefreie Website führt zu einer besseren Benutzererfahrung für alle und kann die Ladezeit reduzieren.
Darauf solltet ihr bei der Erstellung achten:
- HTML-Struktur:
Eine Website sollte die grundlegenden HTML-Strukturen verwenden, um eine korrekte und verständliche Lesereihenfolge sicherzustellen. Dies ist besonders wichtig für Menschen mit Sehbehinderungen, die auf Vorleseprogramme angewiesen sind. - Struktur:
Eine gut strukturierte Website erleichtert es Menschen mit Behinderungen, den Inhalt zu verstehen und zu navigieren. Verwendet beispielsweise Überschriften, Listen und Absätze, um den Inhalt zu strukturieren. - Strikte Trennung von Inhalt und Design:
Eine klare Trennung von Inhalt und Design erleichtert es Menschen mit Behinderungen, auf die Website zuzugreifen. Es ermöglicht auch eine einfachere Wartung und Aktualisierung der Website. - Navigation:
Eine klare und einfache Navigation hilft allen Benutzer*innen, sich auf der Website zurechtzufinden. Dies kann auch durch die Verwendung von Zugänglichkeitsfunktionen wie Tastatursteuerung und Breadcrumbs verbessert werden. - Skalierbarkeit und Responsivität:
Eine barrierefreie Website sollte auf allen Geräten und Bildschirmgrößen gut funktionieren. Ein responsives Design ermöglicht eine flexible Anpassung der Inhalte an verschiedene Bildschirmgrößen. Eine Skalierungsfunktion erleichtert die Vergrößerung des Inhalts für Menschen mit Sehschwächen. - Design: Schriften und Farben sollten so gewählt werden, dass sie für alle Benutzer*innen gut lesbar sind. Menschen mit Sehschwächen können bestimmte Farben nicht gut unterscheiden. Bei Menschen mit Lese-Rechtschreib-Schwäche sind ähnliche Buchstaben problematisch. Die Verwendung von Kontrasten und klaren Schriften kann die Lesbarkeit verbessern.
Nachher kostet es immer mehr
Wenn ihr die Barrierefreiheit eurer Website erst im Nachhinein anpassen müsst, können die Kosten höher ausfallen, da größere Änderungen am Design, Layout und der Struktur der Website vorgenommen werden müssen, um den Standards für Barrierefreiheit zu entsprechen. Außerdem kann es sein, dass ihr mehr Zeit für die Überarbeitung aufwenden müsst, was wiederum höhere Kosten verursacht.
Wenn ihr die Barrierefreiheit von Anfang an in den Entwicklungsprozess einbezieht, könnt ihr die Kosten niedrig halten, da ihr von Anfang an die entsprechenden Standards befolgt und somit später weniger Änderungen notwendig sind. Durch die Einhaltung von Barrierefreiheitsstandards könnt ihr eine breitere Zielgruppe erreichen und somit auch potenzielle Einnahmen generieren.