Seit dem 28. Juni 2025 gilt in Deutschland das Barrierefreiheitsstärkungsgesetz (BFSG). Was nach bürokratischem Amtsdeutsch klingt, hat reale Konsequenzen für Website-Betreiber – besonders im E-Commerce. Ich erkläre dir, was das Gesetz bedeutet, wen es betrifft und was du konkret tun musst.

Was ist das BFSG überhaupt?

Das BFSG setzt die europäische Richtlinie zum European Accessibility Act (EAA) in deutsches Recht um. Ziel: Digitale Produkte und Dienstleistungen sollen für alle Menschen nutzbar sein – auch für die knapp acht Millionen Menschen mit Schwerbehinderung, die laut Statistischem Bundesamt in Deutschland leben. Und für alle, die situativ eingeschränkt sind: schlechtes Licht, kaputte Maus, müde Augen nach einem langen Tag.

Das Gesetz betrifft nicht nur öffentliche Stellen (die waren schon vorher in der Pflicht), sondern erstmals auch private Unternehmen. Konkret geht es um digitale Dienstleistungen im Bereich E-Commerce, Banking, Telekommunikation und Personenbeförderung.

Kurz gesagt: Wenn du online Produkte oder Dienstleistungen verkaufst, bist du sehr wahrscheinlich betroffen. Die Übergangsfristen sind abgelaufen – das Gesetz gilt jetzt.

Wen betrifft das BFSG konkret?

Das Gesetz richtet sich an Unternehmen, die digitale Produkte oder Dienstleistungen anbieten. Im Web-Kontext sind das vor allem:

  • Online-Shops – jeder E-Commerce-Auftritt fällt unter das BFSG
  • Dienstleistungen mit Online-Buchung – Terminbuchung, Reservierungssysteme, Online-Formulare
  • Banking und Finanzdienstleistungen – Online-Banking, Versicherungsportale
  • Telekommunikationsdienste – Webportale von Mobilfunkanbietern, E-Mail-Services

Eine Ausnahme gibt es für Kleinstunternehmen mit weniger als zehn Beschäftigten und höchstens 2 Millionen Euro Jahresumsatz oder Bilanzsumme – allerdings nur bei Dienstleistungen, nicht bei Produkten (§ 3 Abs. 3 BFSG). Und selbst wenn du unter diese Ausnahme fällst: Barrierefreiheit umzusetzen ist trotzdem eine gute Idee.

Wichtig für die Einordnung: Eine reine Präsentations-Website – Leistungen, Team, Anfahrt, Kontaktformular – fällt nach Auskunft der Bundesfachstelle Barrierefreiheit nicht unter das BFSG. Entscheidend ist, ob über die Website ein Vertrag mit Verbrauchern zustande kommt: Online-Shop, verbindliche Terminbuchung, Bestellung. Für Verträge, die vor dem 28. Juni 2025 geschlossen wurden, gilt eine Übergangsfrist bis spätestens 27. Juni 2030 (§ 38 BFSG). Ich bin kein Anwalt und das hier ist keine Rechtsberatung – im Zweifel lohnt der Blick in den Gesetzestext oder ein Gespräch mit deinem Rechtsbeistand.

Was bedeutet „barrierefrei" für eine Website?

Barrierefreiheit im Web orientiert sich an den Web Content Accessibility Guidelines (WCAG), aktuell in Version 2.2. Die WCAG definieren vier Prinzipien – deine Website muss wahrnehmbar, bedienbar, verständlich und robust sein.

In der Praxis bedeutet das:

  • Ausreichende Kontraste – Text muss sich klar vom Hintergrund abheben (Kontrastverhältnis mindestens 4,5:1 für normalen Text)
  • Tastaturnavigation – jede Funktion muss ohne Maus erreichbar sein
  • Alt-Texte für Bilder – Screen-Reader brauchen Bildbeschreibungen
  • Semantisches HTML – korrekte Überschriften-Hierarchie, sinnvolle Formular-Labels, ARIA-Attribute wo nötig
  • Fokus-Indikatoren – sichtbar machen, welches Element gerade ausgewählt ist
  • Untertitel und Transkripte – für Videos und Audio-Inhalte
  • Keine reinen Farbinformationen – Fehlermeldungen nicht nur rot markieren, sondern auch textlich kennzeichnen

Tipp: Teste deine Website mit der Tastatur. Drücke Tab und navigiere durch die Seite. Wenn du irgendwo hängen bleibst oder nicht siehst, wo du bist – hast du ein Barrierefreiheitsproblem.

Was passiert, wenn du nichts tust?

Das BFSG sieht Bußgelder von bis zu 100.000 Euro vor (§ 37 BFSG). Seit September 2025 hat die Marktüberwachungsstelle der Länder für Barrierefreiheit (MLBF) in Magdeburg ihre Arbeit aufgenommen und prüft die Einhaltung. Die Behörden können Maßnahmen anordnen – von der Nachbesserung bis zum Verbot des Inverkehrbringens.

Aber mal ehrlich: Die Bußgelder sind nicht der Hauptgrund, warum du dich darum kümmern solltest. Barrierefreiheit ist ein Wettbewerbsvorteil. Barrierefreie Websites sind für alle Besucher leichter zu bedienen, verlieren weniger Nutzer an Frust – und profitieren, das wird oft unterschätzt, bei Google. Denn vieles, was für Barrierefreiheit gut ist, ist auch gut für SEO: saubere Struktur, schnelle Ladezeiten und gute Core Web Vitals, klare Navigation.

Die häufigsten Fehler, die ich sehe

Wenn ich Websites auditiere, tauchen immer wieder die gleichen Probleme auf:

  • Fehlende Alt-Texte – der Klassiker. Jedes Bild braucht eine Beschreibung (dekorative Bilder bekommen ein leeres alt="")
  • Zu schwache Kontraste – heller Grautext auf weißem Hintergrund sieht elegant aus, ist aber für viele Menschen unlesbar
  • Keine Fokus-Styles – outline: none im CSS ohne Alternative ist ein direkter WCAG-Verstoß
  • Falsche Überschriften-Hierarchie – H1 für den Titel, dann direkt H4 für Zwischenüberschriften – das verwirrt Screen-Reader
  • Formulare ohne Labels – Placeholder-Text ist kein Ersatz für ein echtes Label-Element
  • Nicht-tastaturzugängliche Custom-Elemente – selbstgebaute Dropdowns, Slider oder Modals, die nur per Maus funktionieren

Viele dieser Punkte überschneiden sich mit den typischen Webdesign-Fehlern, die ich bei Betrieben aus dem Sauerland und dem Märkischen Kreis immer wieder sehe. Das ist kein Zufall: Eine Website, die für Screen-Reader-Nutzer schwer zugänglich ist, ist meistens auch für alle anderen anstrengend – und verkauft entsprechend schlechter.

Was du jetzt konkret tun kannst

Du musst nicht alles auf einmal umsetzen. Aber du solltest anfangen. Hier ist ein pragmatischer Fahrplan:

  • Schritt 1: Ist-Zustand prüfen – Lass einen Accessibility-Audit machen. Tools wie WAVE, axe DevTools oder Lighthouse geben einen ersten Überblick. Ein manueller Test (Tastaturnavigation, Screen-Reader) deckt die Probleme auf, die Tools übersehen.
  • Schritt 2: Quick Wins umsetzen – Alt-Texte ergänzen, Kontraste anpassen, Fokus-Styles hinzufügen. Das sind oft kleine Änderungen mit großer Wirkung.
  • Schritt 3: Struktur verbessern – Semantisches HTML, korrekte Überschriften, Formular-Labels. Wenn du einen Baukasten nutzt, prüfe, ob der das überhaupt sauber umsetzt (Spoiler: viele tun es nicht). Mehr dazu im Vergleich Website selber bauen oder machen lassen?
  • Schritt 4: Barrierefreiheitserklärung veröffentlichen – Dokumentiere den Stand deiner Barrierefreiheit auf deiner Website. Das zeigt guten Willen und ist bei öffentlichen Stellen sogar Pflicht.
  • Schritt 5: Regelmäßig testen – Barrierefreiheit ist kein einmaliges Projekt. Jeder neue Inhalt, jedes Update kann neue Probleme einführen.

BFSG-Schnellcheck: 10 Punkte, die du heute prüfen kannst

Du brauchst kein Tool und keinen Entwickler, um einen ersten Eindruck zu bekommen. Nimm dir zwanzig Minuten und geh diese zehn Punkte auf deiner Startseite und deiner wichtigsten Unterseite durch. Jeder Punkt, der durchfällt, ist ein konkreter Arbeitsauftrag – und zusammen ergeben sie ein ehrliches Bild davon, wo deine Website steht:

  1. Kontrast: Prüfe Fließtext gegen Hintergrund mit dem kostenlosen Kontrast-Checker von WebAIM. Normaler Text braucht mindestens 4,5:1, große Überschriften 3:1. Hellgrau auf Weiß fällt fast immer durch.
  2. Tastaturbedienung: Maus weg, nur Tab, Shift+Tab und Enter. Erreichst du Menü, Buttons, Formular und Cookie-Banner? Bleibst du irgendwo hängen, hast du eine Tastaturfalle.
  3. Alt-Texte: Rechtsklick auf ein Bild, „Untersuchen" – steht im img-Tag ein sinnvoller alt-Text? Dekorative Bilder bekommen ein leeres alt="", keine Beschreibung.
  4. Formular-Labels: Klick auf den Beschriftungstext eines Eingabefelds. Springt der Cursor ins Feld, ist das Label korrekt verknüpft. Passiert nichts, fehlt es.
  5. Fokus-Sichtbarkeit: Während du mit Tab durchgehst – siehst du immer einen Rahmen oder eine Markierung auf dem aktiven Element? Wenn nicht, hat jemand outline entfernt.
  6. Überschriftenstruktur: Genau eine H1 pro Seite, danach H2 und H3 in logischer Reihenfolge ohne Sprünge. Die Browser-Erweiterung HeadingsMap zeigt dir das als Baum.
  7. Untertitel: Hat jedes Video Untertitel oder ein Transkript? Läuft Audio automatisch los? Autoplay mit Ton ist ein doppeltes Problem – für Screen-Reader-Nutzer und für alle im Großraumbüro.
  8. Zoom 200 %: Drücke Strg und Plus, bis der Browser 200 Prozent anzeigt. Bleibt alles lesbar und bedienbar, ohne dass Text abgeschnitten wird oder sich Elemente überlagern?
  9. Verständliche Sprache: Kurze Sätze, klare Buttons („Angebot anfordern" statt „Hier klicken"), keine Fachwörter ohne Erklärung, Fehlermeldungen, die sagen, was zu tun ist.
  10. Barrierefreiheitserklärung: Gibt es eine Seite, die den Stand deiner Barrierefreiheit beschreibt und einen Kontakt für Rückmeldungen nennt? Für BFSG-pflichtige Angebote ist das Pflicht, für alle anderen ein Vertrauenssignal.

Einordnung: Fallen mehr als drei Punkte durch, liegt das Problem meist nicht an einzelnen Inhalten, sondern am Fundament – Theme, Baukasten oder ein Design, das nie auf Bedienbarkeit geprüft wurde. Dann lohnt sich der Blick auf die Struktur statt Flickwerk an der Oberfläche.

Baukasten vs. Custom Code: Was ist barrierefreier?

Die ehrliche Antwort: Es kommt darauf an. Moderne Baukästen wie Squarespace oder Shopify haben in den letzten Jahren viel verbessert. Aber sie haben auch Grenzen – du bist an das gebunden, was der Baukasten kann. Und viele Themes und Plugins werfen zusätzliche Barrierefreiheitsprobleme auf. Wenn du gerade darüber nachdenkst, deinen Baukasten hinter dir zu lassen, findest du im Artikel Raus aus dem Baukasten: Von Wix oder Jimdo zur eigenen Website wechseln, worauf du beim Umzug achten musst.

Bei handgeschriebenem Code hast du die volle Kontrolle. Du entscheidest, welches HTML-Element wo steht, wie die Fokus-Reihenfolge aussieht und ob ARIA-Attribute korrekt gesetzt sind. Das erfordert Wissen, aber das Ergebnis ist sauberer. Ich baue alle meine Projekte so, dass Barrierefreiheit von Anfang an eingeplant ist – nicht als nachträgliches Overlay. Wie so eine professionell erstellte Website aufgebaut ist und was sie von einem Baukasten unterscheidet, habe ich auf einer eigenen Seite zusammengefasst.

Mein Rat: Vermeide Accessibility-Overlays (diese „Barrierefreiheits-Widgets", die man per Script einbindet). Die meisten lösen keine echten Probleme – sie übertünchen sie nur und schaffen teilweise neue.

Was kostet Barrierefreiheit nachträglich – und warum ist sie im Neubau günstiger?

Barrierefreiheit ist im Neubau am günstigsten, weil sie dann kein eigener Posten ist, sondern Teil der normalen Arbeit. Wer sauberes, semantisches HTML schreibt, Labels und Fokus-Reihenfolge von Anfang an mitdenkt und beim Farbkonzept die Kontraste einplant, produziert barrierearme Seiten quasi nebenbei. Genau deshalb kalkuliere ich sie bei meinen Festpreis-Paketen zwischen 990 und 2.690 Euro nicht extra – der genaue Preis steht nach dem kostenlosen Erstgespräch fest, aber Barrierefreiheit gehört bei mir zum Standard und nicht auf die Aufpreisliste.

Anders sieht es bei der Nachrüstung aus. Da hängt der Aufwand davon ab, wie die Seite gebaut wurde. Bei einem sauberen Code-Projekt sind fehlende Alt-Texte, Fokus-Styles und ein paar Label-Korrekturen schnell erledigt. Bei einem Baukasten-Theme oder einem älteren WordPress-Projekt mit zwanzig Plugins wird es schwierig: Kontraste stecken im Theme, Slider und Menüs kommen aus fremdem Code, den du nicht anfassen kannst, und jedes Plugin-Update kann deine Korrekturen wieder überschreiben. Dann läuft es oft auf einen Teil-Relaunch hinaus. Solche Nachrüstungen kalkuliere ich individuell nach Aufwand – eine Einordnung, was ein Relaunch grundsätzlich kostet, findest du im Artikel Website-Relaunch: Was kostet es, eine bestehende Website erneuern zu lassen?.

Meine Faustregel: Ist deine Website ohnehin älter als fünf Jahre, läuft mobil nicht sauber oder wirkt neben aktuellen Webdesign-Standards aus der Zeit gefallen, ist der Neubau fast immer der wirtschaftlichere Weg. Du bekommst dann Barrierefreiheit, Geschwindigkeit und modernes Design in einem Schritt – statt drei Baustellen nacheinander, die sich gegenseitig ausbremsen.

FAQ: Häufige Fragen zum BFSG und zur Barrierefreiheit von Websites

Die Antworten geben meine Praxiserfahrung als Webdesigner wieder und ersetzen keine Rechtsberatung. Verbindliche Auskunft zu deinem Einzelfall bekommst du bei einem Anwalt oder der kostenlosen Beratung der Bundesfachstelle Barrierefreiheit.

Gilt das BFSG für meine kleine Handwerker-Website?

In den meisten Fällen nicht direkt. Das BFSG greift bei Dienstleistungen im elektronischen Geschäftsverkehr – also dann, wenn Verbraucher über deine Website einen Vertrag abschließen können, etwa in einem Online-Shop oder über eine verbindliche Buchung. Eine reine Präsentations-Website mit Leistungen, Referenzen und Kontaktformular fällt nach Einschätzung der Bundesfachstelle Barrierefreiheit nicht darunter. Zusätzlich sind Kleinstunternehmen mit weniger als zehn Beschäftigten und höchstens 2 Millionen Euro Jahresumsatz oder Bilanzsumme bei Dienstleistungen ausgenommen. Trotzdem rate ich dir, die Grundlagen umzusetzen: Kontraste, Tastaturbedienung, Alt-Texte und saubere Formulare kosten im Neubau kaum extra, helfen jedem Besucher und stärken nebenbei dein Google-Ranking. Und falls du später einen Shop oder eine Online-Buchung ergänzt, musst du nicht bei null anfangen. Das ist keine Rechtsberatung – im Zweifel frag deinen Anwalt oder die Bundesfachstelle.

Reicht ein Overlay-Plugin, um meine Website barrierefrei zu machen?

Nein. Overlays sind Skripte, die nachträglich ein Bedienpanel einblenden – Schriftgröße, Kontrastmodus, Vorlesefunktion. Sie ändern aber nichts am eigentlichen HTML: Fehlende Alt-Texte bleiben leer, ein Formular ohne Label bleibt für den Screen-Reader stumm, ein Dropdown, das nur per Maus funktioniert, bleibt per Tastatur unerreichbar. Viele Nutzer von Hilfstechnologien schalten solche Overlays sogar bewusst ab, weil sie mit ihren eigenen, gewohnten Werkzeugen kollidieren. Aus meiner Sicht ist ein Overlay bestenfalls Kosmetik und schlimmstenfalls ein Grund für zusätzliche Beschwerden – es signalisiert nach außen „Wir haben etwas gemacht", ohne die Probleme zu lösen. Echte Barrierefreiheit entsteht im Code: semantische Struktur, sinnvolle Fokus-Reihenfolge, ausreichende Kontraste, ARIA nur dort, wo natives HTML nicht reicht. Das ist der Weg, den ich bei jedem Projekt gehe – ohne Zusatz-Widget.

Was ist eine Barrierefreiheitserklärung und brauche ich sie?

Eine Barrierefreiheitserklärung ist ein öffentlich zugänglicher Text auf deiner Website, in dem du beschreibst, wie deine Dienstleistung die Anforderungen an Barrierefreiheit erfüllt – und wo sie es noch nicht tut. Für Dienstleistungen, die unter das BFSG fallen, ist diese Information Pflicht: § 14 BFSG verlangt, dass Dienstleistungserbringer die Angaben nach Anlage 3 erstellen und barrierefrei veröffentlichen, in den AGB oder an anderer deutlich wahrnehmbarer Stelle. Öffentliche Stellen kennen die Erklärung schon länger aus der BITV. Für eine reine Präsentations-Website ist sie nicht vorgeschrieben – aber sie schadet auch nicht: Sie zeigt, dass du dich mit dem Thema beschäftigst, und gibt Nutzern eine Kontaktmöglichkeit, wenn sie auf eine Barriere stoßen. Ich lege sie in meinen Projekten als eigene Unterseite an, verlinkt aus dem Footer neben Impressum und Datenschutz.

Wie prüfe ich meine Website selbst auf Barrierefreiheit?

Fang mit drei kostenlosen Werkzeugen an: Der Lighthouse-Report in Chrome liefert einen ersten Accessibility-Score, die Browser-Erweiterungen WAVE und axe DevTools markieren Kontrastprobleme, fehlende Alt-Texte und Formularfehler direkt auf der Seite. Danach kommt der Teil, den kein Tool ersetzt: Leg die Maus weg und bediene deine Website nur mit Tab, Enter und den Pfeiltasten. Kommst du überall hin? Siehst du immer, wo du bist? Zoome den Browser auf 200 Prozent und prüfe, ob Inhalte abgeschnitten werden. Wenn du magst, starte den in Windows eingebauten Screen-Reader Narrator oder VoiceOver auf dem Mac und höre dir deine Startseite an. Nach einer halben Stunde weißt du mehr über deine Website als nach jedem automatischen Report. Und wenn du eine zweite Meinung willst: Ich schaue mir das im kostenlosen Erstgespräch mit an.

Fazit: Barrierefreiheit ist kein Bonus – sie ist Standard

Das BFSG macht Barrierefreiheit zur Pflicht für viele Unternehmen. Aber auch wenn du (noch) nicht direkt betroffen bist: Eine barrierefreie Website ist eine bessere Website. Sie ist schneller, klarer, benutzerfreundlicher – und sie bringt Eigenschaften mit, die Google ohnehin belohnt.

Wenn du wissen willst, wie es um die Barrierefreiheit deiner aktuellen Website steht, meld dich bei mir. Ich mache einen kostenlosen Kurz-Check und zeige dir, wo du stehst und was sich am schnellsten verbessern lässt – ohne Verkaufsgespräch, mit einem klaren nächsten Schritt.