Eine barrierefreie Website war lange ein „Nice-to-have“, das in Angeboten gerne als Erstes gestrichen wurde. Mit dem Barrierefreiheitsstärkungsgesetz (BFSG), das seit dem 28. Juni 2025 anzuwenden ist, hat sich das für einen Teil der Unternehmen grundlegend geändert: Wer bestimmte digitale Dienstleistungen für Verbraucher anbietet, muss sie barrierefrei gestalten. Für viele Auftraggeber ist unklar, ob sie betroffen sind, und viele Freelancer werden plötzlich mit Fragen konfrontiert, die über Farbkontraste weit hinausgehen.
In diesem Artikel erfährst du, wen das BFSG tatsächlich betrifft, welche technischen Standards dahinterstehen und wie eine barrierefreie Website in der Praxis entsteht. Am Ende findest du eine Checkliste, die du als Auftraggeber für dein Briefing oder als Freelancer für deine Qualitätssicherung nutzen kannst.
Hinweis: Dieser Artikel ersetzt keine Rechtsberatung. Ob dein Unternehmen unter das BFSG fällt, hängt vom Einzelfall ab. Lass dich im Zweifel von einer Fachanwältin oder einem Fachanwalt beraten.
Was ist das BFSG überhaupt?
Das Barrierefreiheitsstärkungsgesetz setzt den European Accessibility Act (Richtlinie (EU) 2019/882) in deutsches Recht um. Ziel ist, dass Menschen mit Behinderungen bestimmte Produkte und Dienstleistungen genauso nutzen können wie alle anderen. Für Websites bedeutet das: Inhalte müssen wahrnehmbar, bedienbar, verständlich und robust sein, also auch mit Screenreader, Tastatur oder Vergrößerung funktionieren.
Den Gesetzestext findest du auf gesetze-im-internet.de. Für Websites relevant sind vor allem die Regelungen zu „Dienstleistungen im elektronischen Geschäftsverkehr“ und die zugehörige Verordnung (BFSGV), die die Anforderungen konkretisiert.
Wer ist vom BFSG betroffen?
Das BFSG gilt nicht für jede Website. Entscheidend ist, ob über die Website eine erfasste Dienstleistung für Verbraucher angeboten wird. Die wichtigsten Fälle für Webdesign-Projekte:
- Online-Shops und Buchungsstrecken, über die Verbraucher Verträge abschließen, also etwa Produkte kaufen, Termine kostenpflichtig buchen oder Tickets erwerben
- Bankdienstleistungen für Verbraucher
- E-Books und die dafür genutzte Software
- Personenbeförderung (zum Beispiel Buchung und Informationen im Bahn-, Bus-, Luft- oder Schiffsverkehr)
- Telekommunikationsdienste
Eine reine Informations- oder Visitenkartenwebsite ohne Vertragsabschluss mit Verbrauchern fällt nach verbreiteter Auffassung nicht direkt unter das Gesetz. Ebenso ist reines B2B-Geschäft nicht erfasst. Die Grenzen sind aber nicht immer scharf: Ein Kontaktformular allein macht noch keinen E-Commerce, ein Buchungstool mit Online-Bezahlung dagegen schon eher.
Ausnahme für Kleinstunternehmen
Kleinstunternehmen, die Dienstleistungen erbringen, sind von den Anforderungen ausgenommen. Als Kleinstunternehmen gilt, wer weniger als zehn Personen beschäftigt und entweder höchstens 2 Millionen Euro Jahresumsatz oder höchstens 2 Millionen Euro Jahresbilanzsumme hat. Das betrifft viele kleine Shops und Solo-Selbstständige. Wichtig: Die Ausnahme gilt für Dienstleistungen, nicht automatisch für Produkte. Und sie ist kein Argument, Barrierefreiheit komplett zu ignorieren – dazu gleich mehr.
Übergangsfristen
Für Dienstleistungen, die bereits vor dem 28. Juni 2025 mit bestimmten Produkten erbracht wurden, sieht das Gesetz Übergangsfristen vor, die teils bis 2030 reichen. Neu gestartete Shops oder Relaunches profitieren davon in aller Regel nicht. Wer 2026 oder später einen Shop neu baut, sollte ihn von Anfang an barrierefrei planen.
Welche Standards gelten: WCAG 2.1 AA und EN 301 549
Das BFSG selbst schreibt keine einzelnen Pixelwerte vor. In der Praxis orientieren sich Behörden und Fachleute an der harmonisierten europäischen Norm EN 301 549. Deren Web-Kapitel verweist auf die Web Content Accessibility Guidelines (WCAG) 2.1 des W3C, und zwar auf die Konformitätsstufe AA.
Die WCAG basieren auf vier Prinzipien:
| Prinzip | Bedeutung | Typische Beispiele |
|---|---|---|
| Wahrnehmbar | Inhalte müssen erfassbar sein | Alternativtexte, Untertitel, ausreichender Kontrast |
| Bedienbar | Alles muss steuerbar sein | Tastaturbedienung, sichtbarer Fokus, keine Zeitfallen |
| Verständlich | Inhalte und Bedienung sind nachvollziehbar | klare Sprache, verständliche Fehlermeldungen, konsistente Navigation |
| Robust | Technisch sauber umgesetzt | valides HTML, korrekte Rollen und Namen für Bedienelemente |
Stufe AA umfasst alle A- und AA-Erfolgskriterien, insgesamt rund 50. Die neuere WCAG 2.2 ergänzt einige Kriterien, etwa zu Zielgrößen und Fokus-Sichtbarkeit. Wer ohnehin neu baut, kann sich gleich an 2.2 orientieren, ohne etwas falsch zu machen.
Neben der technischen Umsetzung verlangt das BFSG, dass Anbieter Informationen darüber bereitstellen, wie ihre Dienstleistung die Barrierefreiheitsanforderungen erfüllt. Viele Shops veröffentlichen dafür eine eigene Seite mit einer Erklärung zur Barrierefreiheit, die im Footer verlinkt ist.
Was passiert, wenn eine Website nicht barrierefrei ist?
Die Durchsetzung liegt bei der Marktüberwachung der Länder. Die Behörden können Mängel beanstanden, die Beseitigung verlangen und im Extremfall die Einstellung der Dienstleistung anordnen. Zusätzlich sieht das Gesetz Bußgelder vor. Daneben diskutieren Juristen, ob Verstöße auch wettbewerbsrechtlich abgemahnt werden können. Wie sich die Praxis entwickelt, ist noch offen, deshalb lohnt es sich, nicht auf eine lasche Kontrolle zu spekulieren.
Unabhängig von Sanktionen gibt es handfeste wirtschaftliche Gründe: Barrierefreie Seiten sind meist auch schneller, sauberer strukturiert und für Suchmaschinen besser lesbar. Viele Anforderungen überschneiden sich mit dem, was ohnehin gute Praxis ist, etwa eine logische Überschriftenstruktur, sprechende Linktexte und responsives Webdesign.
Wie setzt man eine barrierefreie Website um?
Barrierefreiheit ist kein Plugin, das man am Ende installiert. Sogenannte Overlay-Tools, die per Skript eine „Barrierefreiheits-Leiste“ einblenden, beheben die eigentlichen Probleme im Code nicht und werden von vielen Fachleuten und Betroffenen kritisch gesehen. Nachhaltig ist nur die saubere Umsetzung im Design und im Code.
Im Design
- Kontraste: Normaler Text braucht ein Kontrastverhältnis von mindestens 4,5:1, großer Text und Bedienelemente-Grafiken mindestens 3:1. Prüfe Farbpaletten schon im Designtool, nicht erst im Browser.
- Nicht nur Farbe: Fehler in Formularen oder Pflichtfelder dürfen nicht allein über Rot markiert werden. Ergänze Text oder Symbole.
- Fokus-Zustände: Jeder Link und jeder Button braucht einen gut sichtbaren Fokus-Stil. Das häufige
outline: noneohne Ersatz ist ein Klassiker. - Zoom und Umbruch: Die Seite muss bei 200 % Zoom und bei schmalen Viewports ohne horizontales Scrollen nutzbar bleiben.
- Klickflächen: Ausreichend große Touch-Ziele erleichtern die Bedienung für alle.
Im Code
- Semantisches HTML:
buttonstatt klickbaremdiv, echte Überschriften-Hierarchie, Landmarks wieheader,nav,mainundfooter. - Alternativtexte: Informative Bilder brauchen einen beschreibenden
alt-Text, rein dekorative ein leeresalt="". - Formulare: Jedes Feld hat ein sichtbares, verknüpftes
label. Fehlermeldungen werden dem Feld zugeordnet und für Screenreader angekündigt. - Tastaturbedienung: Menüs, Modals, Slider und Cookie-Banner müssen komplett per Tastatur bedienbar sein, inklusive sinnvoller Fokus-Reihenfolge und Escape zum Schließen.
- ARIA sparsam einsetzen: ARIA ergänzt Semantik, ersetzt sie aber nicht. Falsch eingesetzte ARIA-Attribute verschlechtern die Zugänglichkeit oft.
- Sprache auszeichnen:
lang="de"im HTML-Element, fremdsprachige Passagen gesondert.
Im Content
Auch Redakteure tragen Verantwortung. Klare Sprache, aussagekräftige Linktexte statt „hier klicken“, Untertitel für Videos und barrierearme PDFs gehören dazu. Wenn du als Freelancer ein CMS übergibst, lohnt sich eine kurze Schulung, damit die Seite nach dem Launch nicht wieder Barrieren ansammelt.
Checkliste: Barrierefreie Website prüfen
Diese Checkliste ersetzt keinen vollständigen WCAG-Audit, deckt aber die häufigsten Fehler ab:
- Lässt sich die gesamte Seite nur mit der Tastatur (Tab, Shift+Tab, Enter, Leertaste, Escape) bedienen?
- Ist der Fokus jederzeit sichtbar?
- Gibt es einen „Zum Inhalt springen“-Link am Seitenanfang?
- Erfüllen alle Texte und Bedienelemente die Kontrastanforderungen?
- Haben alle informativen Bilder sinnvolle Alternativtexte?
- Ist die Überschriftenstruktur logisch (eine H1, keine übersprungenen Ebenen)?
- Haben alle Formularfelder sichtbare Labels und verständliche Fehlermeldungen?
- Funktioniert der Checkout von Anfang bis Ende mit einem Screenreader?
- Bleibt die Seite bei 200 % Zoom nutzbar?
- Haben Videos Untertitel und lassen sich automatisch startende Inhalte stoppen?
- Ist eine Erklärung zur Barrierefreiheit veröffentlicht und verlinkt?
- Ist der Cookie-Banner barrierefrei und blockiert er nicht die Tastaturbedienung?
Automatische Prüftools wie Lighthouse oder Browser-Erweiterungen finden nur einen Teil der Probleme. Plane zusätzlich manuelle Tests ein, mindestens mit Tastatur und einem Screenreader wie NVDA (Windows) oder VoiceOver (macOS, iOS).
Was bedeutet das BFSG für Webdesign-Freelancer?
Für Freelancer ist das BFSG vor allem eine Chance. Viele Shopbetreiber brauchen Audits, Nachbesserungen oder einen Relaunch. Wer Barrierefreiheit beherrscht, kann sich damit klar positionieren und höhere Preise begründen.
Gleichzeitig solltest du dein Risiko begrenzen:
- Leistung klar definieren: Schreib ins Angebot, welcher Standard gilt (zum Beispiel „WCAG 2.1 Stufe AA für die vom Auftragnehmer erstellten Templates“) und was nicht dazugehört, etwa Inhalte, die der Kunde später selbst einpflegt, oder Drittanbieter-Plugins.
- Aufwand ehrlich kalkulieren: Barrierefreiheit kostet in der Konzeption und im Testing Zeit. Als grobe Faustregel planen viele Freelancer einen spürbaren Aufschlag auf den Entwicklungsaufwand ein, bei nachträglichen Korrekturen oft mehr als bei einem Neubau.
- Keine Garantie auf Rechtskonformität: Du kannst eine technische Umsetzung nach Standard zusagen, aber keine rechtliche Bewertung abgeben. Das gehört in deinen Freelancer-Vertrag.
- Tests dokumentieren: Halte fest, was du wie geprüft hast. Das hilft bei der Abnahme und bei späteren Rückfragen.
Als Auftraggeber solltest du Barrierefreiheit von Beginn an ins Webdesign-Briefing schreiben. Nachrüsten ist fast immer teurer als von Anfang an richtig bauen, besonders bei einem Website-Relaunch, bei dem ohnehin Templates neu entstehen.
Fazit: Barrierefreiheit gehört ins Pflichtenheft
Das BFSG betrifft nicht jede Website, aber jeden Shop und jede Buchungsstrecke für Verbraucher, sofern das Unternehmen kein Kleinstunternehmen ist. Maßstab in der Praxis ist WCAG 2.1 AA über die EN 301 549. Wer das früh einplant, bekommt eine Website, die mehr Menschen erreicht, technisch sauberer ist und rechtlich auf der sicheren Seite steht. Und wer als Freelancer Barrierefreiheit sicher beherrscht, hat ein Thema, das auf absehbare Zeit gefragt bleibt.
Du suchst Unterstützung für einen barrierefreien Shop oder Relaunch? In unserem Freelancer-Verzeichnis findest du Webdesigner aus ganz Deutschland. Und wenn du selbst Freelancer bist und Barrierefreiheit anbietest: Lass dich kostenlos eintragen.