Barrierefreie Website: was das BFSG verlangt und was sich unabhängig davon lohnt
Seit dem 28.06.2025 gilt das Barrierefreiheitsstärkungsgesetz. Es betrifft vor allem Angebote, über die Verbraucher online Verträge abschließen, und nimmt sehr kleine Dienstleister unter bestimmten Voraussetzungen aus.
Kurz zusammengefasst
- Das BFSG gilt seit dem 28.06.2025 für bestimmte Produkte und Dienstleistungen, die sich an Verbraucher richten, darunter Online-Shops und Buchungs- oder Vertragsangebote im Netz.
- Eine reine Informationsseite ohne Vertragsabschluss fällt nach verbreiteter Auslegung nicht darunter.
- Ausgenommen sind Kleinstunternehmen, die Dienstleistungen erbringen: weniger als 10 Beschäftigte und ein Jahresumsatz oder eine Jahresbilanzsumme von höchstens 2 Mio. Euro.
- Als Maßstab dienen in der Praxis die WCAG, meist Stufe AA.
- Die Grundlagen helfen allen Besuchern: Sprache, Beschriftungen, Alternativtexte, Tastatur, Zoom und Kontrast.
Was das BFSG regelt
Das Barrierefreiheitsstärkungsgesetz (BFSG) setzt eine europäische Richtlinie um und schreibt für bestimmte Produkte und Dienstleistungen vor, dass Menschen mit Behinderungen sie nutzen können. Die Pflichten gelten seit dem 28.06.2025. Zu den erfassten Dienstleistungen gehören unter anderem solche im elektronischen Geschäftsverkehr, also Online-Shops und Websites oder Apps, über die Verbraucher Verträge abschließen, außerdem Telekommunikationsdienste und Bankdienstleistungen für Verbraucher. Wer unter das Gesetz fällt, muss zudem in leicht zugänglicher Form erklären, wie sein Angebot die Anforderungen erfüllt, etwa in den Geschäftsbedingungen oder auf einer eigenen Seite.
Wen es betrifft und wen nicht
Entscheidend ist, ob sich das Angebot an Verbraucher richtet und ob online ein Vertrag zustande kommt. Ein Online-Shop mit Warenkorb und Bezahlvorgang ist ein klarer Fall, ebenso eine Seite, über die man ein Zimmer verbindlich bucht oder eine Lieferung bestellt. Eine Firmenwebsite, die Leistungen vorstellt, Öffnungszeiten nennt und ein Kontaktformular anbietet, schließt keinen Vertrag und gilt deshalb nach verbreiteter Auslegung nicht als erfasst. Angebote, die sich nur an Unternehmen richten, sind ebenfalls nicht gemeint.
Dazwischen gibt es Grenzfälle. Ob eine Online-Terminbuchung bei einer Praxis oder einem Friseursalon schon als Vertragsabschluss zählt, hängt von der Ausgestaltung ab. Im Zweifel lohnt eine Klärung, statt zu raten.
Die Ausnahme für Kleinstunternehmen
Das Gesetz nimmt Kleinstunternehmen aus, die Dienstleistungen erbringen. Als Kleinstunternehmen gilt, wer weniger als 10 Personen beschäftigt und einen Jahresumsatz oder eine Jahresbilanzsumme von höchstens 2 Mio. Euro hat. Der Friseursalon mit Online-Buchung oder der kleine Handwerksbetrieb fällt deshalb in der Regel unter die Ausnahme, sofern er die Grenzen einhält. Die Ausnahme betrifft Dienstleistungen, nicht die Herstellung bestimmter Produkte. Es hilft, die eigenen Zahlen im Zweifel belegen zu können.
Auch wer ausgenommen ist, hat Gründe, sich mit dem Thema zu befassen. Viele Maßnahmen verbessern die Bedienbarkeit für alle: für ältere Menschen, für jemanden mit gebrochenem Arm, für ein Handy im grellen Sonnenlicht. Und wer mit einer Seite nicht zurechtkommt, ruft womöglich einen anderen Betrieb an.
WCAG als Maßstab
Die Web Content Accessibility Guidelines (WCAG) des W3C sind das Regelwerk, an dem sich Barrierefreiheit im Netz misst. Sie gliedern sich in vier Prinzipien: Inhalte müssen wahrnehmbar, bedienbar, verständlich und robust sein. Es gibt die Stufen A, AA und AAA, wobei AA in der Praxis als Ziel gilt. Für das BFSG dient in der Praxis die europäische Norm EN 301 549 als Bezugspunkt, die für Webinhalte auf die WCAG verweist. Die Regeln sind umfangreich, doch einige Grundlagen decken einen großen Teil des Alltags ab.
Praktische Grundlagen
Sprache der Seite
Im Kopf der Seite gehört die Angabe lang="de" für die Sprache. Ohne sie sprechen Screenreader deutsche Texte mit der falschen Stimme aus. Stehen einzelne englische Wörter oder Abschnitte auf der Seite, lassen sie sich ebenfalls markieren.
Formulare mit Beschriftung
Jedes Eingabefeld braucht eine sichtbare Beschriftung, die technisch mit dem Feld verbunden ist. Ein grauer Platzhaltertext im Feld ersetzt das nicht, denn er verschwindet beim Tippen. Fehlermeldungen sollten in Worten erklären, was fehlt, und nicht nur das Feld rot färben.
Schaltflächen und Links mit Namen
Ein Lupensymbol für die Suche, ein Pfeil im Bilderkarussell oder das Telefon-Icon in der Kopfzeile sehen eindeutig aus, sind für Vorlese-Software aber stumm, wenn kein Text dahintersteht. Sie brauchen einen sichtbaren oder hinterlegten Namen, meist über das Attribut aria-label, etwa „Suche öffnen“ oder „Jetzt anrufen“. Sonst hört ein blinder Besucher nur „Schaltfläche“ oder „Link“.
Alternativtexte für Bilder
Bilder mit Aussage bekommen einen kurzen Alternativtext, rein dekorative Bilder ein leeres Alt-Attribut, damit Screenreader sie überspringen. Wie man solche Texte schreibt, steht bei Alt-Text.
Bedienung per Tastatur
Alles, was sich mit der Maus bedienen lässt, muss auch mit der Tab-Taste gehen: Menü, Formular, Buchungskalender. Der gerade aktive Punkt muss sichtbar markiert sein, und die Reihenfolge soll der Logik der Seite folgen. Ein Terminkalender, der nur per Mausklick funktioniert, schließt Menschen aus, die auf die Tastatur angewiesen sind. Positive tabindex-Werte im Code bringen diese Reihenfolge leicht durcheinander. Besser ist eine Seite, deren Aufbau im Code schon der sichtbaren Reihenfolge entspricht.
Hauptbereich und eingebettete Inhalte
Ein main-Element markiert den eigentlichen Inhalt. Vorlese-Software springt damit an Kopfzeile und Menü vorbei direkt dorthin, statt bei jeder Unterseite die komplette Navigation vorzulesen. Eingebettete Karten, Videos oder Buchungsfenster stecken meist in einem iframe. Ein title-Attribut wie „Anfahrtskarte“ oder „Online-Terminbuchung“ sagt, was sich darin verbirgt.
Zoom und Lesbarkeit
Text muss sich auf 200 Prozent vergrößern lassen, ohne dass Inhalte oder Funktionen verloren gehen. Zusätzlich verlangt Stufe AA, dass die Seite bei einer Breite von 320 Pixeln ohne waagerechtes Scrollen auskommt, was auf einem üblichen Bildschirm etwa 400 Prozent Zoom entspricht. Das Zoomen auf dem Smartphone darf nicht gesperrt sein. Schriftgrößen werden am besten in relativen Einheiten angegeben.
Kontrast und Struktur
Text braucht ausreichenden Abstand zum Hintergrund, die Werte stehen bei Farbkontrast. Eine Information darf nie nur über Farbe vermittelt werden. Überschriften sollten die Seite logisch gliedern, ohne Stufen zu überspringen, und Linktexte wie „Mehr erfahren“ sagen allein nichts. „Preise der Reinigung ansehen“ ist verständlich, auch wenn man die Links als Liste vorgelesen bekommt.
Selbst testen
Einen ersten Eindruck verschaffen drei einfache Proben: Bedienen Sie die Seite eine Weile nur mit der Tab-Taste, vergrößern Sie sie im Browser auf 200 Prozent und hören Sie sich eine Seite mit einem Screenreader an (für Windows gibt es kostenlose Programme, Apple-Geräte haben VoiceOver eingebaut). Automatische Werkzeuge finden nur einen Teil der Probleme, weil vieles ein Urteil über Verständlichkeit verlangt.
Schnelltest für Ihre Seite
Der kostenlose Barrierefreiheits-Check liest den ausgelieferten Quelltext einer Seite. Er prüft die Sprachangabe, alt-Attribute an Bildern, Beschriftungen von Formularfeldern, Schaltflächen und Links ohne Namen, allgemeine Linktexte wie „hier“, die Reihenfolge der Überschriften, eine Zoomsperre, Titel eingebetteter Rahmen, den main-Bereich und positive tabindex-Werte. Farbkontraste misst er nicht, und ob ein Alternativtext passt oder die Tastaturbedienung funktioniert, kann er nicht beurteilen. Ob das BFSG für Ihr Angebot gilt, klärt weder der Check noch dieser Text, denn beide ersetzen keine Rechtsberatung.
Wer eine neue Website plant, findet unter Webdesign, wie Bemuar Seiten barrierearm aufbaut.
Kontakt
Erzählen Sie kurz, worum es geht. Sie bekommen eine persönliche Antwort per E-Mail oder Telefon.
[email protected]Projekt in Wolfsburg oder direkt in der Region? Für Termine vor Ort ist bemuar.de die richtige Adresse.