Barrierefreiheit: Checkliste zur Überprüfung Ihrer Website

Von Olena Petrenko, Swen Greif · 07.05.2024

Im Juni 2025 tritt das Barrierefreiheitsförderungsgesetzt (BFSG) in Deutschland in Kraft. Unter gewissen Voraussetzungen müssen ab dann Websites für Menschen mit Behinderungen bedienbar sein. Was ist damit gemeint und welche Auswirkungen hat das für Ihre Website? Hier erfahren Sie mehr. Außerdem finden Sie eine Checkliste, mit der Sie die wichtigsten Anforderungen überprüfen können.

Was ist eine barrierefreie Website?

Barrierefreie Websites sind solche, die sicherstellen, dass alle Nutzerinnen und Nutzer die Inhalte und Funktionen der Website in vollem Umfang nutzen können, unabhängig von ihren Fähigkeiten, Einschränkungen oder technischen Voraussetzungen.

Nach dem Barrierefreiheitsförderungsgesetz (BFSG) müssen Unternehmen in Deutschland ab dem 28. Juni 2025 barrierefreie Websites haben, wenn sie Dienstleistungen wie einen Shop oder ein Buchungstool anbieten. Ausgenommen sind Kleinstunternehmen mit weniger als 10 Mitarbeitern und einem Jahresumsatz von maximal 2 Millionen Euro.

Achtung: Unter Dienstleistungen im elektronischen Geschäftsverkehr fallen auch automatische bzw. vollständig elektronisch erbrachte Bestätigungen, Terminbuchungen etc.

Elemente die nicht Barrierefrei sein müssen:

aufgezeichnete zeitbasierte Medien, die vor dem 28. Juni 2025 veröffentlicht wurden (Video und Audio-datein)

Dateiformate von Büro-Anwendungen, die vor dem 28. Juni 2025 veröffentlicht wurden; der Blog oder Shop muss dann aber deaktiviert sein (quasi nur ein Archiv)

Online-Karten und Kartendienste, sofern bei Karten für Navigationszwecke wesentliche Informationen barrierefrei zugänglich in digitaler Form bereitgestellt werden;

Inhalte von Dritten, die von dem betreffenden Wirtschaftsakteur weder finanziert noch entwickelt werden noch dessen Kontrolle unterliegen, ausdrücklich nicht erfasst ist Drittwerbung (Banner, Popups, etc.) und Drittanwendungen (Cookie-Consent-Tools, interaktive Funktionen)

Inhalte von Webseiten und mobilen Anwendungen, die als Archive gelten, da ihre Inhalte nach dem 28. Juni 2025 weder aktualisiert noch überarbeitet werden.

• Gilt nur im B2C nicht im B2B Bereich, wenn klar ersichtlich ist, dass nicht an (End)Verbraucher verkauft wird

Auch der elektronische Geschäftsverkehr ist vom BFSG betroffen. Das heißt auch Verkauf oder Erwerb von Waren oder Dienstleistungen über das Internet.

Welche Websites müssen barrierefrei sein?

Das BFSG macht die Einhaltung der WCAG 2.1 AA-Kriterien in Zukunft verpflichtend. Die Einhaltung des BFSG soll durch ein Monitoring-System sichergestellt werden und bei Verstößen und Nicht-Einhalten werden Bußgelder verhängt. Aber ist Ihre Website nun davon betroffen?

1. Webseiten von Banken, Online-Banking, Bankdienstleistungen;
2. Personenbeförderungsdiensten im Luft-, Bus-, Schienen- und Schiffsverkehr (ausgenommen ist hier nur der Regionalverkehr);
3. Telekommunikationsdiensten;
4. Online-Shops und E-Commerce – auch wenn die verkauften Produkte selbst nicht in den Anwendungsbereich des BFSG fallen –
5. Online-Terminbuchungen wie etwa Hotel- und Reisebuchungen oder Terminbuchungen.

Übergangsfristen:

1. Dienstleistungen, die nur mithilfe von Produkten, die in den Anwendungsbereich des BFSG fallen, erbracht werden können, dürfen bis zum 27. Juni 2030 weiterhin mit diesen Produkten erbracht werden (5 Jahre).
2. Nicht barrierefreie Selbstbedienungsterminals bleiben bis zum Ende ihrer wirtschaftlichen Nutzungsdauer bestehen – maximal jedoch bis 2040 (15 Jahre).
3. Webseiten und Online-Shops fallen nicht unter diese Übergangsfristen und müssen ab dem 28. Juni 2025 barrierefrei gestaltet sein.
4. Online-Shops und Webseiten fallen nicht unter "Dienstleistungen unter dem Einsatz von Produkten".

Checkliste: Anforderungen an die Barrierefreiheit von Websites

Unser Experte Swen hat eine Checkliste für einen ersten Schnelltest für barrierefreie Websites erstellt.

"Die folgenden „Prinzipien der Zugänglichkeit" wurden für barrierefreie Webinhalte durch das "World Wide Web Consortium" (W3C) definiert. Sie sollten allen Elementen einer Webseite zu Grunde liegen." - Swen Greif, Experte für Barrierefreiheit bei Pagemachine

Wahrnehmbar:

Alle Inhalte und Benutzeroberflächen müssen so präsentiert werden, dass Nutzende sie auch wahrnehmen können. Dabei darf nicht nur von uneingeschränkten Menschen ausgegangen werden.

Bsp.: Kann ein blinder Mensch die Informationen dieses Elements wahrnehmen?

Bedienbar:

Benutzeroberflächen und interaktive Elemente müssen für Nutzende bedienbar sein. Das bedeutet z.B., die Bedienbarkeit ohne Maus muss möglich sein

Bsp.: Ist dieses Element über Tastatur (an)steuerbar?

Verständlich:

Die Inhalte und die Bedienung der Benutzeroberflächen müssen verständlich sein. Das beinhaltet die Fokusreihenfolge dieser Elemente aber beispielsweise auch deren Lesbarkeit.

Bsp.: Folgt die Fokusreihenfolge dieser Elemente der Leserichtung? Ist die Funktion eines interaktiven Elements für jeden ersichtlich?

Robust:

Der Inhalt muss möglichst von allen Nutzeragenten (z.B. Browsern, Screenreadern) und Assistenztechnologien dargestellt werden. Es sollten also Methoden/Techniken/Module genutzt werden, welche getestet wurden und eine hohe Kompatibilität aufweisen. Dies ist am einfachsten durch Aktualität der verwendeten Technik zu gewährleisten.

Bsp.: Funktioniert das auch in anderen Browsern? Sind die Informationen dieses Elements auch nutzbar, wenn die restlichen „Funktionen" oder „Stylings" nicht funktionieren?

In der Praxis gelten diese Kriterien für fast alle Teile einer Website:

• Gestaltung:
  • Page Titel ist simpel und selbsterklärend für jede Unterseite
  • Bilder haben Alternativtext (alt-Tag)
  • Überschriftenhierarchie wird beachtet (h1>h2>...)
  • Jedes Element hat ein Kontrastverhältnis( „Contrast ratio") von mindestens = 4,5:1
  • Text vergrößerbar ohne zu überlappen oder abzuschneiden
• Steuerung (Tastaturzugang (= Keyboard Access))
  • Alle interaktiven Elemente anwählbar
  • Alle interaktive Elemente können auf gleichem Weg verlassen werden, wie sie ausgewählt wurden
  • Tab-Reihenfolge folgt der Leserichtung
  • Visueller Fokus für ausgewählte Elemente (z.B. Farbänderung oder Rahmen)
  • Alle Mausfunktionen müssen auch für Tastaturnavigation verfügbar sein (z.B. "Hover" Kontextmenüs)
  • Drop-Down steuerbar über "Enter" und Pfeiltasten
  • (Bild-)Links müssen anwählbar und fokussierbar sein
• Formulare
  • Tastaturzugang
  • Formularfelder müssen einen -Tag haben
  • Pflichtfelder müssen eine Kennzeichnung als solche haben.
  • Error Handling, also klare Anweisungen für Nutzende bei Fehlern.
  • Fehlerfreie Felder sollten nicht neu ausgefüllt werden müssen.
• Inhalt
  • Blinken, Bewegen, Scrollen sollte vermieden oder wenigstens pausierbar/ausblendbar sein
  • Automatisch aktualisierende Inhalte sollten pausierbar und die Frequenz anpassbar sein
  • Blinken oder Aufblitzen von Elementen sollte nicht länger als 2x pro Sekunde auftreten
  • Video- und Audioalternative anbieten, damit Informationen auf alternativem Weg wahrgenommen werden können
  • Zugänglichkeit der Media-Player-Steuerelemente (Play, Pause, etc.)
  • Auto-Start von Medien vermeiden, oder maximal für 3 Sekunden
  • HTML-Code sollte der Leserichtung entsprechen

Fazit

Prüfen Sie rechtzeitig z.B. anhand unserer Checkliste, ob Ihre Website schon die grundlegenden Anforderungen an Barrierefreiheit erfüllt.

Sie können sich auch gerne an uns wenden und wir prüfen, was Sie tun müssen, um alle Anforderungen zu erfüllen.