ZURÜCK

Barrierefreie Websites

Christopher Schäfer
Aktualisiert: 06.11.2023

Ist von Barrierefreiheit im Internet die Rede, sind digitale Angebote gleichberechtigt für alle User zugänglich und sollten ohne Einschränkungen genutzt werden können. Auf einer barrierefreien Website sind demnach Voraussetzungen geschaffen, die es jedem Besucher Deiner Website erlaubt, Inhalte einer Seite ohne technische Barrieren wahrnehmen und lesen zu können. Da das Barrierefreiheitsstärkungsgesetz ab Mitte 2025 in Kraft tritt, wird es Zeit sich mit dem Thema näher zu beschäftigen, zumal es Dir auch einen Wettbewerbsvorteil sichern kann. Welche Aspekte es bei der Umsetzung einer barrierefreien Website zu beachten gilt, haben wir Dir in diesem Blogartikel zusammengestellt.

Definition:

Eine barrierefreie Website ist eine Seite, die für alle Besucher ausnahmslos, d. h. auch für Menschen mit physischen und psychischen Einschränkungen, alle Informationen zugänglich“ macht. Blinde Menschen benötigen beispielsweise zusätzliche auditive Elemente, um den Inhalt zu verstehen. Eine Website sollte aber auch generell unabhängig von technischen Einschränkungen (Barrieren) für jeden nutzbar sein. Wichtig ist, dass keine zusätzlichen Installationen notwendig sind, um die jeweilige Website nutzen zu können, denn auch dies würde eine Barriere darstellen.

Mit welchen Barrieren ist zu rechnen?

Grundsätzlich bedeutet barrierefrei, dass alle Nutzer uneingeschränkt den Content deiner Website konsumieren können. Dies jedoch reicht durchaus weiter, als Du es Dir im ersten Moment vielleicht vorstellen kannst. Nachfolgend gehen wir daher auf die größten Herausforderungen ein:

  • Einschränkungen des Hörvermögens

Wer nur teilweise oder überhaupt nichts hört, muss den Inhalten dennoch problemlos folgen können, beispielsweise durch eine zusätzliche Transkription von Audioinhalten.

  • Einschränkungen des Sehvermögens

Hierzu gehört nicht nur die Blindheit, sondern auch das eingeschränkte Sehen und die Farbenblindheit. In diesen Fällen müssen Farbanpassungen möglich sein und die Inhalte auf andere Weise (beispielsweise als Audioversion) konsumierbar sein.

  • Körperliche Einschränkungen

Körperliche Einschränkungen müssen nicht unbedingt von Dauer sein. Schon eine gebrochene Hand könnte ausreichen, damit Inhalte nicht mehr optimal genutzt werden können.

Neben diesen persönlichen Gründen gibt es auch technische Einschränkungen, die nicht bestehen sollten. Funktioniert die Website beispielsweise nicht mit einem alten Browser, ist dies eine Barriere, die es abzubauen gilt.

Webseite nicht erreichbar Screenshot

Quelle: https://www.netzwelt.de/news/159808-webseite-aufgerufen-tun.html

Barrierefreie Website – Pflicht oder Eigenverantwortung?

Mitte Juni 2025 tritt das Barrierefreiheitsstärkungsgesetz (BFSG) in Kraft. Die Umsetzung von Barrierefreiheit in verschiedenen Bereichen, zum Beispiel dem Onlinehandel oder bei Telekommunikationsdienstleistungen, wird für Unternehmen somit verpflichtend. Darunter fällt auch die Gestaltung von Websites und Webshops. Noch ist genug Zeit, diese solltest Du eigenverantwortlich nutzen, um Mitte 2025 die rechtlichen Anforderungen zu erfüllen und Deine Website ohne Barriere, für alle Deine Besucher zugänglich zu machen. 

Bei der Ausrichtung einer barrierefreien Website kannst Du Dich an der folgenden in Deutschland geltenden Verordnung orientieren oder Dir einen umfassenden Überblick aus dem Barrierefreiheitsstärkungsgesetz verschaffen. 

Gesetz zur Gleichstellung von Menschen mit Behinderungen (Behindertengleichstellungsgesetz – BGG)

§ 3 Menschen mit Behinderungen

„Menschen mit Behinderungen im Sinne des Gesetzes sind Menschen, die langfristige körperliche, seelische, geistige oder Sinnesbeeinträchtigungen haben, welche sie in Wechselwirkung mit einstellungs- und umweltbedingten Barrieren an der gleichberechtigten Teilhabe an der Gesellschaft hindern können. Als langfristig gilt ein Zeitraum, der mit hoher Wahrscheinlichkeit länger als sechs Monate andauert.“

Das BGG legt fest, dass Inhalte von Web-Angeboten barrierefrei zu gestalten sind. Das Ziel dahinter ist es, die Benachteiligung von Menschen mit Behinderungen zu beseitigen und zu verhindern sowie ihre gleichberechtigte Teilhabe am Leben in der Gesellschaft zu gewährleisten und ihnen eine selbstbestimmte Lebensführung zu ermöglichen. Dabei wird ihren besonderen Bedürfnissen Rechnung getragen (https://www.gesetze-im-internet.de/bgg/BJNR146800002.html)

Ergänzend zu diesem Gesetz ist die BITV 2.0 (seit 2011 in Kraft) zu verstehen. Sie dient in erster Linie dazu, eine umfassend und grundsätzlich uneingeschränkt barrierefreie Gestaltung moderner Informations- und Kommunikationstechnik zu ermöglichen und zu gewährleisten (https://www.gesetze-im-internet.de/bitv_2_0/BJNR184300011.html)

Für öffentliche Stellen gilt da allerdings eine Ausnahme. Seit 2016 sind diese laut der EU-Richtline 2016/2102 zur Bereitstellung eines barrierefreien Zugang zu Websites und mobilen Anwendungen verpflichtet. Seitdem müssen alle Webinhalte, Office-Dokumente und PDFs barrierefrei zugänglich und bedienbar sein. Ab dem Jahr 2025 soll zudem die EU-Richtlinie EN 2019/88 durch das Barrierefreiheitsbestärkungsgesetz (BSFSG) in Kraft treten. Danach soll ein einheitlicher Standard für die Zugänglichkeit von Produkten und Dienstleistungen im Web ermöglicht werden.


Achtung:

Auch wenn private und kommerzielle Websites hiervon nicht betroffen sind, gelten die Regeln, die teilweise auch auf EU-Ebene bestehen, auf jeden Fall für öffentliche Web-Angebote des Bundes. Hierdurch soll sichergestellt werden, dass jede*r Bürger*in sich jederzeit umfassend informieren kann.

So kannst Du Deine barrierefreie Website gestalten – Checkliste:

Damit Deine Website als barrierefrei im Sinne der aktuellen Richtlinien gilt, solltest Du Dich an der nachfolgenden barrierefreie Website Checkliste orientieren:

  • Verschiedene Varianten der Website

Heutzutage konsumieren viele Nutzer Inhalte einer Website nicht mehr über den PC, sondern beispielsweise über das Tablet oder Smartphone. Auf allen Geräten sollten die Webseiteninhalte deshalb einwandfrei dargestellt werden können.

  • Design, Struktur und Inhalte trennen

Dies ist sinnvoll, damit die einzelnen Elemente unabhängig voneinander aktualisiert werden können. Willst Du also etwas am Design Deiner Website verändern, wirkt sich dies nicht automatisch auch auf die Struktur oder den Inhalt Deiner Seite aus.

  • Optimale Strukturierung von Überschriften

Jede Webseite sollte nur eine einzige h1-Überschrift haben. Alle weiteren Überschriften sind nach der Hierarchie h2 – h6 usw. zu verwenden.

  • Einfache Navigation:

Die Navigation durch eine Website kann beispielsweise mit oder ohne Maus erfolgen. Daher ist es wichtig, dass sie einfach funktioniert.

  • Optimale Größe

Einige Nutzer sind darauf angewiesen, die Inhalte der Website durch Anpassungen im Browser zu vergrößern. Es ist wichtig, dass auch bei einer sehr hohen Vergrößerung von beispielsweise 200 Prozent sämtliche Inhalte noch gut dargestellt und uneingeschränkt lesbar sind.

  • Kontrast

Menschen mit einer Sehschwäche haben oft Probleme, Farben erkennen zu können. Deshalb ist es wichtig, auf einen hohen Kontrast zu setzen. So sollten sich beispielsweise textliche Inhalte stark von der gewählten Hintergrundfarbe absetzen.

Farbkontrast auf Webseite Beispiel

Wir nutzen dazu beispielsweise eine dunkle Schriftfarbe auf einem schlichten weißen Hintergrund. Somit ist für ausreichend Kontrast und optimale Lesebedingungen gesorgt. 

  • HMTL

Um verschiedene Styles zu verwenden, solltest Du mit gängigen HTML-Begriffen arbeiten.

  • Leicht verständliche Sprache

Alle textlichen Inhalte sollten auf Hochdeutsch und in kurzen Sätzen übersichtlich verfasst werden. Dies macht es Vorleseprogrammen einfacher, die Inhalte korrekt wiederzugeben.

Tipp:

Ist es notwendig, Fachbegriffe zu verwenden oder beispielsweise einen Dialekt zu benutzen, füge am besten eine Art Lexikon zur Begriffserklärung hinzu.

  • Verwendung von Metadaten und Alternativtexten

Generell solltest Du einen aussagekräftigen Titel sowie eine verständliche Beschreibung verwenden. Außerdem ist es wichtig, dass bei allen Bildern oder Formularen Alternativtexte hinterlegt werden, damit ein Vorleseprogramm die jeweilige Abbildung beschreiben kann.

Verwendung Meta Daten und Alt Text auf Webseiten

Es ist insgesamt also wichtig, dass Deine Website alle Anforderungen erfüllt, damit Screenreader, Sprachassistenten oder bestimmte Tastatursteuerungen damit klarkommen.

Ist meine Website barrierefrei?

Wenn Du testen möchtest, ob Deine Website barrierefrei ist, kannst Du unterschiedliche Tools nutzen. Einige werden kostenlos angeboten, für andere musst Du bezahlen.

Eine kostenlose, sehr zuverlässige Variante, die Dir einen ersten Überblick gibt, ist das Tool Lighthouse. Du findest es innerhalb der Chrome Developer Tools. Eine ebenfalls praktische und schnelle Variante bietet die WAVE-Toolbar.

Legst Du Wert auf einen umfangreichen Check, kannst Du eine Prüfung nach Anforderungen der Barrierefreie-Informationstechnik-Verordnung (BITV) durchführen lassen.

Fazit

Barrierefreie Websites sorgen dafür, dass jeder Nutzer die vorhandenen Inhalte uneingeschränkt konsumieren kann und diese auch von technischen Hilfsmitteln erfasst werden können. Ab Mitte 2025 tritt dann das Barrierefreiheitsstärkungsgesetz in Kraft: Wer über eine Website elektronische Dienstleistungen anbietet – sei es z.B. eCommerce oder die Kontaktaufnahme für ein Kundengespräch –, ist ab dem Moment dazu verpflichtet, seine Website barrierefrei im Sinne des Gesetzes zu gestalten. In Eigenverantwortung empfiehlt es sich, das Thema schon jetzt anzugehen, um Mitte 2025 die rechtlichen Anforderungen zu erfüllen. Die Gestaltung einer barrierefreien Website, solltest Du demnach konsequent umsetzen. Da dies jedoch Fachkenntnisse erfordert, solltest Du am besten einen Profi ans Werk lassen oder eine Unterstützung hinzuziehen.

DU MÖCHTEST MEHR ZUM THEMA BARRIEREFREIE WEBSITE WISSEN? WIR BERATEN DICH GERN!

JETZT KONTAKT AUFNEHMEN
Christopher Schäfer

Als Wahlhamburger bin ich 2016 zur Hanseranking GmbH gekommen und leite aktuell die SEO Abteilung. Mit großer Begeisterung teile ich mein Wissen für das Team und für unsere Kunden.