WordPress barrierefrei machen nach BFSG: Anleitung

Seit dem 28.06.2025 ist das Barrierefreiheitsstärkungsgesetz (BFSG) in Kraft. Und seit Anfang 2026 ist die zuständige Marktüberwachungsstelle der Länder (MLBF) in der aktiven Kontrollphase: Am 29.01.2026 hat sie ihre Marktüberwachungsstrategie beschlossen — reaktiv auf Beschwerden (nach eigener Darstellung priorisiert) plus systematische, teils automatisierte Kontrollen (Presseschleuder, Juli 2026). Wer jetzt seine WordPress-Seite barrierefrei machen will (BFSG-konform), sollte eines nicht tun: ein Overlay-Plugin installieren. Genau das kann später gegen dich verwendet werden. Warum, und was stattdessen wirklich hilft, steht in dieser Anleitung.
Das ist eine Einordnung, keine Rechtsberatung. Ich bin Entwickler, kein Anwalt. Wo etwas juristisch umstritten ist, kennzeichne ich das ausdrücklich. Für eine verbindliche Bewertung deines Einzelfalls sprich mit einer Fachanwältin.
Kurz & ehrlich: Bist du überhaupt betroffen?
Bevor du irgendetwas umbaust — prüf in drei Schritten, ob dich das BFSG überhaupt trifft:
- Schließt du online Verträge mit Verbrauchern ab? Also Online-Shop, Terminbuchung, Ticketing, Bankdienste, Telekommunikation, E-Books? Dann bist du grundsätzlich in der Pflicht. Der Auslöser ist der elektronische Vertragsabschluss.
- Bist du Kleinstunternehmen? Befreit ist nur, wer weniger als 10 Beschäftigte UND höchstens 2 Mio. EUR Jahresumsatz hat — beide Bedingungen gleichzeitig (Händlerbund). Achtung: Diese Ausnahme gilt nur für Dienstleistungen. Wer online Produkte in Verkehr bringt, bleibt trotzdem verpflichtet.
- Reine Info-/Image-Seite? Eine Website ohne Online-Vertragsabschluss fällt grundsätzlich nicht unter das BFSG.
Der Graubereich, den die meisten Ratgeber verschweigen: Sobald du eine digitale Dienstleistung anbietest oder aktiv auf einen Vertragsschluss hinwirkst, kann die Pflicht greifen. Wo genau ein unverbindliches Angebotsformular aufhört und ein „Vertragsanbahnung"-Formular anfängt, ist juristisch nicht abschließend geklärt (HÄRTING Rechtsanwälte). B2B ist grundsätzlich nicht erfasst. Im Zweifel: lieber sauber bauen, als auf die Auslegung hoffen.
Das Gesetz in 5 Minuten
Das BFSG ist die deutsche Umsetzung des European Accessibility Act (Richtlinie (EU) 2019/882), konkretisiert durch die BFSG-Verordnung (BFSGV). Der technische Maßstab ist die Norm EN 301 549, die für Web-Inhalte auf WCAG 2.1 Konformitätsstufe AA verweist. Wichtig: Gefordert ist AA, nicht AAA. AAA ist Kür.
Vier Grundprinzipien (POUR): wahrnehmbar, bedienbar, verständlich, robust. Alles, was du gleich umsetzt, zahlt auf eines davon ein.
Drei Zahlen, die du kennen solltest:
- Fristen (§ 38 BFSG): Es gibt keine generelle Schonfrist für Websites. Die Pflicht gilt seit 28.06.2025. Die oft zitierten 2030er-Fristen betreffen nur weiterlaufende Altverträge (vor dem 28.06.2025 geschlossen, längstens bis 27.06.2030) und vor dem Stichtag genutzte Produkte/Selbstbedienungsterminals — nicht deine Website (§ 38 BFSG, Taylor Wessing).
- Bußgelder (§ 37 BFSG): bis zu 100.000 EUR fürs Anbieten nicht-barrierefreier Dienstleistungen, bis zu 10.000 EUR für Informations-/Kennzeichnungsverstöße. Die Behörde kann Nachbesserung anordnen oder das Angebot untersagen (§ 37 BFSG). Stand Juli 2026 sind allerdings keine Einzelbußgelder öffentlich dokumentiert — kein Grund für Panikverkauf.
- Barrierefreiheitserklärung: Pflicht nach Anlage 3 zu §§ 14, 28 BFSG. Gehört wie Impressum und Datenschutz gut auffindbar auf die Seite — und ist eines der ersten Dinge, die Prüfstellen kontrollieren.
Nicht verwechseln: BFSG ≠ BITV. Die BITV 2.0 gilt für öffentliche Stellen, das BFSG für die Privatwirtschaft.
Der teure Irrweg zuerst: kein Overlay-Plugin
Ich repariere Code, ich klebe kein Widget drüber. Das ist keine Ideologie, das ist Faktenlage.
Overlay-Tools (accessiBe, UserWay, Eye-Able, auch die „One Click Accessibility"-Toolbar) versprechen, deine Seite per JavaScript-Schicht „automatisch konform" zu machen. Sie beheben den zugrunde liegenden Code aber nicht — sie überdecken Barrieren. Die Belege:
- Die US-Behörde FTC verhängte gegen accessiBe 1 Mio. USD (Vergleich im Januar 2025, finaler Beschluss April 2025). Vorwurf: accessiBe habe irreführend und unbelegt behauptet, sein KI-Widget könne jede Website WCAG-konform machen. Dazu kamen als unabhängig getarnte Bewertungen und Artikel, deren Verbindung zu accessiBe verschwiegen wurde (FTC).
- In WebAIM-Umfragen bewerten 72 % der Nutzer assistiver Technik Overlays als nicht bzw. kaum wirksam. 2024 betrafen laut UsableNet rund 25 % (über 1.000) der mehr als 4.000 ADA-Digitalklagen Seiten, die bereits ein Overlay einsetzten.
- Das Overlay Fact Sheet wurde von mehreren hundert Fachleuten unterzeichnet — Mitwirkende an WCAG/ARIA/HTML, Experten von Google, Microsoft, Apple.
- Die deutschen Überwachungsstellen raten offiziell ab. Pikant: Die MLBF selbst nutzte kurzzeitig das Overlay Eye-Able, was der Verein Digitale Barrierefreiheit e.V. scharf kritisierte (digitalebarrierefreiheit.org).
Kernsatz: Ein Overlay schützt dich nicht vor Prüfung oder Abmahnung. Es kostet Geld und verschleiert die Mängel, die eine Prüfstelle im Zweifel trotzdem findet.
Was automatisch prüfbar ist — und was nicht
Bevor du loslegst, die ehrliche Erwartungssteuerung: Kein Tool macht deine Seite barrierefrei. Nur rund 30 % der WCAG-Erfolgskriterien lassen sich überhaupt voll automatisiert prüfen, ein kleiner weiterer Teil teilautomatisiert — der große Rest (grob 60–70 %) bleibt reine Handarbeit. Und selbst nach Fehlervolumen fängt eine starke Engine wie axe-core nur etwa 57 % der real gefundenen Fehler ab (Deque).
| Automatisch prüfbar (~30 %) | Nur manuell prüfbar (~60–70 %) | |---|---| | Fehlende Alt-Attribute | Ist der Alt-Text sinnvoll? | | Kontrastwerte | Tastatur-Bedienbarkeit komplett | | Fehlende Formular-Labels | Screenreader-Verständlichkeit | | Doppelte IDs, leere Links | Logische Fokus-Reihenfolge | | Sprachauszeichnung (lang) | Kognitive Verständlichkeit |
Ein grüner Lighthouse-Score von 100 heißt also nicht „barrierefrei". Tastatur- und Screenreader-Test bleiben Pflicht.
Schritt-für-Schritt: WordPress barrierefrei umsetzen
1. Fundament — ein barrierefreies Theme
Im offiziellen Theme-Verzeichnis gibt es den Filter „Feature → Accessibility ready" (rund 100 Themes erfüllen das). Block-/FSE-Themes wie Twenty Twenty-Five und Twenty Twenty-Four bringen Skip-Links, Landmarks und kontraststarke Paletten ab Werk mit. Twenty Twenty-Two war das erste „accessibility-ready" Standard-Block-Theme (Lightweb Media). Weitere solide Optionen: GeneratePress, Astra, Kadence, Blocksy, Ollie, Reykjavik.
Page-Builder-Warnung: Der native Block-Editor (Gutenberg) ist für Barrierefreiheit am unproblematischsten. Elementor erzeugt historisch aufgeblähtes Markup mit mehr Risiken — wenn du frei wählen kannst, nimm Blocks. Vergleich: der „Equalize Digital Page Builder Accessibility Report".
2. Farbkontraste (4.5:1)
Die konkreten Werte (WCAG 2.1 AA):
- 4,5:1 für normalen Text (SC 1.4.3)
- 3:1 für großen Text (ab 18 pt bzw. 14 pt fett)
- 3:1 für Nicht-Text-Kontrast — UI-Komponenten, Formularfeld-Ränder, aussagekräftige Grafiken (SC 1.4.11)
Prüf jede Farbkombi mit dem WebAIM Contrast Checker und fixe die Werte direkt in der Theme-Palette, nicht per Umschalt-Button. Zu geringe Kontraste sind laut Monitoringstellen einer der häufigsten Fehler überhaupt.
3. Alt-Texte und Medien
WordPress speichert Alt-Texte pro Bild in der Mediathek. Regel:
- Aussagekräftige Bilder: Alt-Text beschreibt Funktion/Information — kurz, kein Keyword-Spam.
- Rein dekorative Bilder: leeres
alt="". Sonst quatscht der Screenreader Unsinn. - Video/Audio: Untertitel und Transkripte.
4. Tastatur-Bedienbarkeit & sichtbarer Fokus
Zieh die Maus weg und navigier deine Seite nur mit Tab, Shift+Tab, Enter, Leertaste. Erreichst du alles? Ist der Fokus immer sichtbar (SC 2.4.7 Focus Visible, Pflicht)? Häufige Stolperfallen: Dropdown-Menüs, Slider, Pop-ups — und der Cookie-Banner, den fast jede DSGVO-pflichtige Seite hat und der oft eine reine Maus-Falle ist. Wenn du den Consent-Layer nicht per Tastatur schließen kannst, ist er eine harte Barriere direkt beim Seitenaufruf.
5. Formulare
Sichtbare <label> für jedes Feld (kein reines Placeholder-Label), verständliche Fehlermeldungen und Pflichtfeld-Kennzeichnung nicht nur über Farbe — Rot allein sehen Farbfehlsichtige nicht. Ergänze ein Symbol oder Text.
6. Überschriften-Hierarchie & Landmarks
Eine H1 pro Seite, keine Ebenen-Sprünge (nicht von H2 direkt zu H4). Nutze semantische Landmarks (header, nav, main, footer). Und: ARIA nur sparsam. „No ARIA is better than bad ARIA" — falsch gesetzte ARIA-Attribute verschlechtern die Barrierefreiheit. Zuerst sauberes HTML, ARIA nur ergänzend.
7. Verlinkte PDFs
Der blinde Fleck fast aller WordPress-Guides: Ein verlinktes, nicht barrierefreies PDF (Preisliste, Formular, Speisekarte) ist eine eigenständige Barriere und Teil deines Angebots. Es muss getaggt und PDF/UA-konform sein — mit korrekter Lesereihenfolge und Alternativtexten. Prüf das mit dem kostenlosen PAC. Oft ist die ehrlichere Lösung: das PDF durch eine HTML-Seite ersetzen.
Die richtigen Plugins (echte Fixes statt Overlay)
Diese Plugins beheben oder finden echte Probleme — sie sind keine Overlays:
- WP Accessibility (Joe Dolson, kostenlos): Basis-Fixes wie Skip-Links, Warnungen bei fehlenden Alt-Texten.
- Equalize Digital Accessibility Checker: scannt Beiträge/Seiten gegen WCAG 2.2 direkt im Editor.
- Sa11y: visuelle Hinweise im Frontend.
Sie ersetzen kein sauberes Theme, keine Alt-Texte, keine Untertitel. Ausdrücklich meiden: Overlay-/Toolbar-Plugins (One Click Accessibility, UserWay, accessiBe, Eye-Able). Mehr dazu: barrierefreies.design.
Kostenlose Prüf-Tools
- **WAVE** (WebAIM): visuelle Fehleranzeige im Browser.
- axe DevTools (Deque): wissenschaftlich fundiert, Basis vieler Profi-Tools.
- Google Lighthouse: in Chrome DevTools integriert, Accessibility-Score.
- WebAIM Contrast Checker: Farbkontraste.
- NVDA: kostenloser Screenreader für Windows. Installier ihn, schließ die Augen und versuch, deine Startseite zu bedienen — 10 Minuten, die mehr zeigen als jeder Score.
- PAC: für PDF/UA-Prüfung.
Merksatz: Tools finden nur ~20–40 % der Fehler. Die manuelle Prüfung bleibt.
Zwischenstand — und wo es ehrlich anstrengend wird
Theme, Kontraste, Alt-Texte und Formulare bekommst du mit dieser Anleitung selbst hin. Der Teil, der Erfahrung braucht, ist der manuelle: die vollständige Tastatur- und Screenreader-Prüfung, verschachtelte Menüs, der Consent-Layer, PDFs. Genau da entstehen die Mängel, die eine Prüfstelle findet.
Wenn du wissen willst, wo deine WordPress-Seite konkret steht, statt zu raten: Ich mache einen **kostenlosen Barrierefreiheits-Check — ein strukturierter Befund gegen WCAG 2.1 AA, automatisiert und** manuell geprüft, mit klarer Priorisierung. Kein Widget, keine Angstmache, sondern eine belastbare Liste, was zu tun ist. Auf Wunsch setze ich es anschließend im Code um.
Rechtlicher Hinweis
Dieser Artikel ist Stand Juli 2026 und stellt den Rechtsrahmen dar, wie er sich aus BFSG, BFSGV und EN 301 549 ergibt. Gesichert sind Geltung, technischer Maßstab (WCAG 2.1 AA), Bußgeldrahmen und die aktive Kontrollphase der MLBF. Umstritten ist unter anderem, ob BFSG-Verstöße wettbewerbsrechtlich abmahnfähig sind (i.S.d. UWG) — das ist höchstrichterlich noch nicht geklärt, auch wenn Kanzleien seit Anfang 2026 eine zunehmende Abmahnwelle melden. Die EU-Kommission richtete im März 2026 eine (ergänzende) mit Gründen versehene Stellungnahme an Deutschland wegen unzureichender EAA-Umsetzung (EU-Kommission, 11.03.2026). Das ist eine Einordnung, keine Rechtsberatung — für deinen Einzelfall hol dir anwaltlichen Rat.
Häufige Fragen
Ist meine WordPress-Seite überhaupt vom BFSG betroffen?
Grundsätzlich nur, wenn du online Verträge mit Verbrauchern abschließt (Shop, Buchung, Ticketing usw.). Reine Info-/Image-Seiten fallen grundsätzlich nicht darunter, B2B ebenfalls nicht. Der Graubereich: Schon ein Angebots- oder Buchungsformular kann die Pflicht auslösen — die genaue Abgrenzung ist juristisch nicht abschließend geklärt. Das ist eine Einordnung, keine Rechtsberatung.
Macht ein Barrierefreiheits-Plugin wie accessiBe oder UserWay meine Seite BFSG-konform?
Nein. Overlay-Widgets beheben den zugrunde liegenden Code nicht, sondern überdecken Barrieren. 72 % der Nutzer assistiver Technik bewerten sie als nicht oder kaum wirksam, die FTC hat accessiBe für irreführende WCAG-Versprechen mit 1 Mio. USD belegt, und die deutschen Überwachungsstellen raten offiziell ab. Ein Overlay schützt dich weder vor Prüfung noch vor Abmahnung.
Reicht ein grüner Lighthouse- oder WAVE-Score von 100?
Nein. Automatisierte Tools decken nur rund 30 % der WCAG-Erfolgskriterien voll ab (nach Fehlervolumen etwa 57 %). Ein guter Score garantiert keine Konformität. Tastatur-Bedienung und ein Screenreader-Test (z. B. mit dem kostenlosen NVDA) bleiben unverzichtbar.
Als Kleinstunternehmen bin ich doch befreit, oder?
Nur teilweise. Die Ausnahme gilt für weniger als 10 Beschäftigte UND höchstens 2 Mio. EUR Umsatz gleichzeitig — und nur für Dienstleistungen. Wer online Produkte in Verkehr bringt, bleibt trotz Kleinstunternehmens-Status verpflichtet.
Gilt für Websites nicht eine Übergangsfrist bis 2030?
Nein. § 38 BFSG enthält keine generelle Schonfrist für Websites — die Pflicht gilt seit dem 28.06.2025. Die 2030er-Fristen betreffen nur vor dem Stichtag geschlossene Altverträge (längstens bis 27.06.2030) und bereits genutzte Produkte bzw. Selbstbedienungsterminals.
Welche Farbkontraste verlangt das BFSG konkret?
Nach WCAG 2.1 AA: 4,5:1 für normalen Text, 3:1 für großen Text (ab 18 pt bzw. 14 pt fett) und 3:1 für Nicht-Text-Kontraste wie UI-Elemente und Formularfeld-Ränder. Gefordert ist Stufe AA, nicht AAA. Prüfen kannst du das kostenlos mit dem WebAIM Contrast Checker.
Prüf deine Website in 60 Sekunden — kostenlos
Der Barrierefreiheits-Check zeigt dir sofort, wo deine Startseite gegen WCAG/BFSG verstößt — mit klaren Handlungsempfehlungen statt Overlay-Widget.
Jetzt kostenlos prüfen