Barrierefreie Website Checkliste: In 9 Schritten zur Barrierefreiheit (BFSG)

Barrierefreiheit im Internet ist längst kein Randthema mehr – sie ist essenziell für moderne und nutzerfreundliche Websites. Die digitale Barrierefreiheit ist von großer Bedeutung, um allen Nutzern uneingeschränkten Zugang zu Webangeboten zu ermöglichen. Eine barrierefreie Website erfüllt nicht nur die gesetzlichen Anforderungen des Barrierefreiheitsstärkungsgesetzes (BFSG), sondern verbessert auch die Nutzerfreundlichkeit der Website.

Wichtig: Der Stichtag für die Umsetzung ist der 28. Juni 2025! Unsere Checkliste bietet einen Überblick über die wichtigsten Aspekte, die es beim BFSG zu beachten gilt und hilft Schritt für Schritt bei der rechtzeitigen Umsetzung.

Hinweis: Unsere Checkliste stellt keine rechtliche Beratung dar, sondern dient als praxisorientierte Hilfestellung.

Was ist das Barrierefreiheitsstärkungsgesetz (BFSG) ?

Das BFSG legt fest, dass digitale Angebote für alle Menschen uneingeschränkt zugänglich sein müssen. Grundlage sind die Richtlinien der Web Content Accessibility Guidelines (WCAG), die internationale Standards für Webinhalte definieren. Bereits seit 2019 gibt es die Barrierefreie-Informationstechnik-Verordnung (BITV 2.0) in Deutschland, die Vorgaben dazu macht, wie Informationen barrierefrei aufbereitet werden.

Wer ist von dem BFSG betroffen?

• Unternehmen, die Produkte oder Dienstleistungen für Verbraucher anbieten.
• Ausgenommen sind Kleinstunternehmen mit weniger als 10 Mitarbeitern und einem Jahresumsatz unter 2 Mio. Euro, sofern sie keine Produkte herstellen oder vertreiben.
• Stichtag: 28. Juni 2025 – bis dahin sollten Websites barrierefrei sein.

Was sind die rechtlichen Konsequenzen?

• Es drohen Bußgelder und Abmahnungen.
• Sperrung der Website: Im schlimmsten Fall muss die Website offline genommen werden.
• Eine Nichteinhaltung könnte dem Image der Marke schaden.

Verpflichtende Maßnahmen bei der Umsetzung

• Regelmäßige Prüfungen sind verpflichtend durchzuführen.
• Es muss dokumentiert werden, welche Maßnahmen zur Barrierefreiheit umgesetzt worden sind und wie die Barrierefreiheit geleistet wird.
• Erklärungen zur Barrierefreiheit müssen leicht zugänglich bereitgestellt werden.
• Nutzer müssen die Möglichkeit haben, Feedback zu geben und Barrieren zu melden.

Checkliste: Die zentralen Inhalte und Ziele des BSFG als Checkliste

1. Farben, Kontraste und Design

Nicht jeder Mensch nimmt Farben gleich wahr. Menschen mit Sehbeeinträchtigungen oder Rot-Grün-Schwäche haben Schwierigkeiten, bestimmte Farbkombinationen zu erkennen. Um die Designvorgaben der Barrierefreiheit zu gewährleisten, beachte folgende Regeln:

• Hoher Farbkontrast zwischen Schrift und Hintergrund (mindestens 4,5:1), am besten mit einem Kontrast-Checker überprüfen.
• Gut lesbare Schriften: Serifenlos, keine verschnörkelten Schriften und gut lesbare Schriftgrößen verwenden.

2. Klare Seitenstruktur und HTML-Nutzung

Eine barrierefreie Website ist logisch aufgebaut und verwendet eine korrekte HMTL-Struktur.

• Inhalte werden mit <header>, <footer>, <article>, etc. deklariert, um Screenreadern die Verarbeitung der Inhalte zu erleichtern.
• Überschriften geben der Website eine nachvollziehbare Gliederung und sind im Quelltext mit <h1>, <h2>, <h3>, … gekennzeichnet (auch wichtig für SEO).
• Zusätzlich werden alle Inhaltsabschnitte durch eine Überschrift eingeleitet.
• Listen statt lange Absätze (<ul>, <ol>, <dl>) verwenden.
• Zitate werden mit <blockquote> und <cite> eingebunden.
• Die Website bleibt auch bei 200 % Vergrößerung ohne Einschränkung.

3. Uneingeschränkte Tastaturnavigation & Bedienbarkeit

Für eine barrierefreie Nutzung der Website ist es wichtig, dass die Nutzer problemlos durch die Seite navigieren können. Stelle sicher, dass die Website auch ohne der Maus bedient werden kann.

• Alle Funktionen sind per Tastatur erreichbar.
• Berücksichtige Eingabemethoden wie Touchscreens oder Sprachsteuerung.
• Sichtbar markieren, welches Element gerade ausgewählt ist.
• Vermeide es, zeitlich begrenzte Inhalte zu verwenden, jeder Nutzer sollte in seiner Geschwindigkeit den Inhalt konsumieren.

4. Alternativtexte für Bilder

In der Wahrnehmbarkeit der Website ist es ein zentraler Aspekt, dass für Nicht-Text-Inhalte, also vor allem Bilder, eine Textalternative bereitgestellt wird. Dabei ist zu beachten:

• Alle relevanten Bilder haben sinnvolle Alt-Texte (Tipps für SEO-optimierte Alt-Texte).
• Diagramme und komplexe Grafiken mit ausführlicher Textalternative bereitstellen.
• Dekorative Bilder mit aria-hiden=“true“ deklarieren und Alt-Attribut leer lassen (damit Screenreader diese ignorieren).

5. Barrierefreie Video- und Audioinhalte

Es ist wichtig, dass Audio- und Video-Inhalte zu jeder Zeit uneingeschränkt konsumiert werden können.

• Untertitel für Videos bereitstellen.
• Transkripte für Podcasts und Audiodateien veröffentlichen.
• Keine störenden Hintergrundgeräusche bei Audiodateien.
• Bewegende Elemente müssen pausiert werden können (Slideshow).
• Elemente, die öfter als 3-Mal in der Sekunde blitzen, müssen entfernt werden.
• Videos und Audios, die länger als 3 Sekunden dauern, müssen einen Stoppschalter eingebaut haben.

6. Benutzerfreundliche Formulare verwenden

Kontakt- und Anfrageformulare sind ein wichtiger Bestandteil einer Website. Es ist wichtig, dass die korrekt in die Website integriert werden, um allen Nutzern eine Kontaktmöglichkeit zu bieten.

• Formularfelder sind sinnvoll beschriftet (<label>-Tags verwenden).
• Übersichtlicher und logischer Formularaufbau.
• Platzhaltertexte sind keine Labels! Labels müssen sichtbar sein.
• Verwende keinen grafischen Captchas (Alternative).
• Warnung bei Unterbrechung der Eingabe, wenn eine Gefahr des Datenverlusts besteht.
• Auf fehlerhafte und leere Felder klar hinweisen, am besten direkt eine Ausfüllhilfestellung mitgeben.

7. Korrekte und verständliche Sprache

Es sollte bereits vorausgesetzt sein, dass die Sprache auf der Website klar und leicht verständlich ist. Komplexe Begriffe und Fachwörter sollten erklärt werden.

• HTML-Sprache korrekt angeben (<html lang=“de“>).
• Fremdsprachige Inhalte auszeichnen (<blockquote lang=“en“>).
• Abkürzungen beim ersten Vorkommen ausschreiben und mit <abbr> kennzeichnen.

8. Die Website ist mobil optimiert

Mobile Optimierung ist ein entscheidender Faktor für eine bessere Nutzererfahrung auf allen Endgeräten. Immer mehr Nutzer greifen über mobile Endgeräte auf die Website zu, daher muss die Barrierefreiheit auch für mobile Geräte gewährleistet sein.

• Responsives Design nutzen, damit sich die Inhalte an die verschiedenen Bildschirmgrößen anpassen.
• Navigationsmenü an die Bildschirmgrößen anpassen.
• Mobile Tests mit Screenreadern durchführen.

Eine mobil optimierte Website ist ein entscheidender Faktor der Suchmaschinenoptimierung (SEO)!

9. SEO-Basics für eine barrierefreie Website

Die Maßnahmen für eine barrierefreie Website sind nicht nur wichtig für die Einhaltung des BFSG, sondern gehen Hand in Hand mit SEO-Optimierungen. Hier sind die wichtigsten Umsetzungen einer barrierefreien Website, die für SEO relevant sind:

• Überschriften Struktur: Eine stringente H-Struktur ist ein wichtiger Bestandteil einer SEO-optimierten Website (h1 > h2 > h3). Sie hilft Suchmaschinen wie Google, Inhalte besser zu verstehen und verbessert die Navigation für Screenreader-Nutzer.
• Alternativtexte für Bilder sind Pflicht! Alt-Attribute sind nicht nur für blinde und sehbehinderte Nutzer eine Hilfe, sondern unterstützen auch Suchmaschinen beim Crawlen der Website.
• Klare URL-Struktur und Breadcrumbs: Eine logische Struktur mit sprechenden URLs (z.B.: https://eminded.de/leistungen/seo/seo-beratung/) und Breadcrumbs verbessert die Nutzerführung.
• Mobile First: Die Anpassung der Inhalte an mobile Endgeräte ist essentiell für die Barrierefreiheit und ein direkter Ranking-Faktor bei Google.
• Optimierte Ladezeit: Schnell ladende Websites sind sind für SEO und Barrierefreiheit wichtig – bei einer Ladezeit über 2,5 Sekunden ist die Gefahr hoch, dass Nutzer abbrechen.
• User Experience (UX): Die Inhalte sollen gut verständlich aufbereitet sein, um die Nutzererfahrung zu verbessern. So wird die Absprungrate reduziert, welche ein wichtiger SEO-Faktor ist.

So lassen sich die Anforderungen der Checkliste für eine barrierefreie Website umsetzen

Barrierefreiheit ist weit mehr als eine gesetzliche Pflicht! Eine Website, die für alle zugänglich ist, verbessert nicht nur die Bedienbarkeit für Menschen mit Einschränkungen, sondern kommt allen Nutzern zugute. Klare Strukturen, gut lesbare Texte und eine einfache Navigation machen eine Website allgemein ansprechender.

Schaffe Bewusstsein im Team! In einem Zeitalter voller Chatbots und Künstlicher Intelligenz (KI) dürfen wir nicht vergessen, dass am Ende Menschen sind, die eine Website nutzen – nicht Maschinen. Eine Barrierefreie Website entsteht nicht aus dem Nichts, sondern erfordert grundlegendes Verständnis und Engagement im Team. Interne Schulungen für Barrierefreiheit helfen dabei, nachhaltiges Bewusstsein zu schaffen und Barrierefreiheit langfristig in die digitale Strategie zu etablieren.

Unsere Checklist gibt einen Überblick, um die wichtigsten Vorgaben des BFSG zu erfüllen und langfristig eine barrierefreie Website zu gestalten. Wer seinen Nutzern ein optimales Erlebnis bieten und für den 28. Juni 2025 gewappnet sein möchte, sollte sich zeitnah mit dem Thema auseinandersetzen.

Unsere Empfehlung: Jetzt aktiv werden!

Eine barrierefreie Website bedeutet zufriedene Nutzer, bessere Usability, bessere SEO Performance und eine rechtssichere digitale Präsenz.

Wir als SEO-Agentur unterstützen Dich gerne beim Umstellen auf eine barrierefreie Website. Nimm jetzt Kontakt auf!

Über den Autor

Sarah Vente

Sarah Vente war als Werkstudentin bei eMinded tätig und hat in den unterschiedlichsten Bereichen unterstützt. Ihre Freizeit verbringt sie am liebsten mit sportlichen Aktivitäten wie Volleyball oder Skifahren in ihrer Heimat Tirol.

Weitere Artikel von Sarah