WordPress barrierefrei machen: Was Sie wissen müssen

Auf einen Blick:

• WordPress-Core ist eine gute Basis. Die eigentlichen Probleme entstehen durch Themes, Plugins und Page Builder.
• Theme-Wahl ist der größte Hebel. Ein Theme ohne semantisches HTML lässt sich kaum nachträglich reparieren.
• Page Builder: Gutenberg + barrierefreies Block-Theme ist der sicherste Weg. Bricks liefert den saubersten Code, braucht aber ARIA-Handarbeit. Elementor funktioniert, erfordert aber ständige Kontrolle.
• Overlay-Tools (AccessiBe, UserWay) sind keine Lösung. Sie beheben keine strukturellen Barrieren und werden von Fachleuten und Behörden nicht als BFSG-konform anerkannt.
• Kosten: WordPress-Umstellungen liegen typischerweise 20–30 % unter proprietären Systemen. Für eine KMU-Site mit 20–50 Seiten: 4.000–12.000 €.

Ist WordPress von Haus aus barrierefrei?

Kurze Antwort: Nein. Aber WordPress bietet eine der besten Ausgangspositionen unter allen CMS.

Der WordPress-Core hat Barrierefreiheit als offizielles Entwicklungsziel. Seit Version 6.8 orientiert sich das Projekt an WCAG 2.2 AA. Allein in den letzten drei Major-Releases (6.7–6.9) wurden über 250 Barrierefreiheits-Tickets geschlossen. Core-Blöcke geben sauberes, semantisches HTML aus: Überschriften als <h1>–<h6>, Listen als <ul>/<ol>, Absätze als <p>.

Das Problem liegt nicht im Core. Es liegt in den drei Schichten, die darüber kommen: Theme, Plugins und Page Builder. Eine Standard-WordPress-Installation mit einem beliebigen Theme aus dem Repository ist fast nie BFSG-konform.

Wo entstehen die Barrieren?

Themes: Das Fundament entscheidet

Ein Theme bestimmt die HTML-Struktur Ihrer gesamten Website. Fehlt hier die Basis, hilft kein Plugin.

Typische Theme-Probleme:

• Fehlende Landmarks. Ohne <header>, <nav>, <main> und <footer> können Screenreader-Nutzer nicht zwischen Seitenbereichen springen.
• Deaktivierte Fokus-Indikatoren. Viele Themes setzen outline: none aus Designgründen. Tastaturnutzer sehen nicht mehr, wo sie sich befinden.
• Falsche Überschriften-Hierarchie. Wenn H-Tags fürs Styling statt für die Struktur genutzt werden (z. B. H4 vor H2), verliert die Seite ihre logische Gliederung.
• Unzureichende Kontraste. Hellgrauer Text auf Weiß ist ein Klassiker. WCAG verlangt mindestens 4,5:1 für normalen Text.

Unsere Empfehlung: Suchen Sie im WordPress-Repository nach Themes mit dem Tag „accessibility-ready”. Dieses Label ist ein Startpunkt, keine Garantie. Prüfen Sie zusätzlich manuell: Navigieren Sie nur mit der Tab-Taste. Sehen Sie, wo der Fokus liegt?

Wenn Sie ein neues Projekt starten: Nutzen Sie ein Block-Theme (Twenty Twenty-Five, GeneratePress, Kadence). Diese bringen Landmarks, Skip-Links und barrierefreie Farbpaletten von Haus aus mit.

Wenn Sie ein bestehendes Theme haben: Prüfen Sie die HTML-Struktur. Fehlen Landmarks komplett? Dann ist ein Theme-Wechsel oder Relaunch oft günstiger als die Reparatur.

Plugins: Die unsichtbaren Barrieren

Slider, Pop-ups und Kontaktformulare sind die häufigsten Fehlerquellen.

Slider sind oft nicht pausierbar und für Screenreader nicht lesbar. Pop-ups erzeugen „Keyboard Traps”: Der Nutzer bleibt mit der Tab-Taste im Hintergrund hängen, während das Overlay im Vordergrund liegt. Formulare nutzen häufig Placeholder statt echte <label>-Elemente. Sobald der Nutzer tippt, verschwindet die Feldbeschreibung.

Wenn Sie Plugins evaluieren: Testen Sie jedes Plugin einzeln mit der Tastatur. Kommen Sie überall hin? Können Sie alles bedienen, ohne die Maus zu berühren? Wenn nicht: ersetzen oder konfigurieren.

Welcher Page Builder ist am besten für Barrierefreiheit?

Die Wahl des Builders bestimmt, wie viel Nacharbeit Sie für BFSG-Konformität brauchen. Der Equalize Digital Page Builder Accessibility Report 2025 hat 19 Builder mit über 200 Stunden automatisierter und manueller Tests verglichen.

Gutenberg: Der sicherste Weg

Block-Themes wie Twenty Twenty-Five oder Kadence bringen Landmarks, Skip-Links und barrierefreie Farbpaletten automatisch mit. Da WordPress-Core ein dediziertes Accessibility-Team hat, profitieren Gutenberg-Nutzer von kontinuierlichen Verbesserungen.

Schwäche: Sie können Block-Elementen keine semantischen HTML5-Tags (<section>, <article>) zuweisen. Für komplexe Layouts brauchen Sie Add-ons wie Kadence Blocks (Platz 1 im Equalize Digital Report).

Bricks: Der sauberste Code, aber Handarbeit

Bricks erzeugt das schlankste HTML aller Builder. Jedes Element kann manuell mit dem korrekten HTML-Tag versehen werden. Der Menu Builder erlaubt volle Kontrolle über aria-expanded-Zustände und Tastatur-Events.

Aber: Komplexe Widgets wie Akkordeons, Tabs und Slider haben keine ARIA-Rollen. Das Button-Element nutzt <span> statt <button>, und Formulare fehlt <fieldset>/<legend>-Gruppierung. Bricks ist ein mächtiges Werkzeug, verlangt aber einen Entwickler, der die ARIA-Lücken kennt und schließt.

Wenn Sie Bricks einsetzen: Planen Sie Budget für ARIA-Nachrüstung ein. Die Standard-Templates sind nur „durchschnittlich” (Equalize Digital), der Builder selbst bietet aber alle Werkzeuge für eine vollständig barrierefreie Umsetzung.

Elementor: Funktioniert, aber braucht Disziplin

Elementor rangiert im Equalize Digital Report auf Platz 4 von 19. Die „Optimized DOM Output”-Option reduziert verschachtelte Container deutlich. Die Ally-Erweiterung (ehemals One Click Accessibility) erkennt über 180 Probleme.

Risiken: Das „Full Width”-Layout entfernt alle semantischen Landmarks. JavaScript-basierte Widgets (Slider, Modale) verwalten den Fokus oft nicht korrekt. Elementors Accessibility Statement referenziert nur WCAG 2.0, nicht die vom BFSG geforderte Version 2.1 AA.

Wenn Sie Elementor nutzen: Verwenden Sie immer das „Default”-Seitenlayout, nie „Full Width” oder „Elementor Canvas”. Setzen Sie semantische HTML-Tags manuell in den erweiterten Einstellungen.

Warum Accessibility-Overlays keine Lösung sind

Tools wie AccessiBe, UserWay oder Eye-Able Widgets versprechen BFSG-Konformität per JavaScript-Snippet. Das ist irreführend.

Overlays legen eine Korrekturschicht über die Website, reparieren aber den Code nicht. Fehlende Alt-Texte, nicht-navigierbare Formulare und kaputte Seitenstruktur bleiben bestehen. In WebAIM-Umfragen bewerten 72 % der betroffenen Nutzer Overlays als unwirksam. Im April 2025 wurde AccessiBe von der US-Handelsbehörde FTC zu einer Strafe von 1 Million Dollar wegen irreführender Werbung verurteilt.

Zwei weitere Probleme: Overlays laden externe Skripte, die die Ladezeit verschlechtern. Und viele Menschen mit Behinderung haben ihren Browser bereits optimal konfiguriert. Ein Overlay überschreibt diese Einstellungen ungefragt.

Unsere Position: Wir listen in unserem Verzeichnis keine reinen Overlay-Anbieter. Wir empfehlen ausschließlich Agenturen, die den tatsächlichen Code Ihrer Website barrierefrei machen.

Welche Plugins helfen wirklich?

Drei Plugins, die den bestehenden Code verbessern, statt ihn zu überdecken:

WP Accessibility (Joe Dolson) ist der Goldstandard für Basis-Fixes. Kostenlos, 60.000+ aktive Installationen, aktuell Version 2.3.2. Fügt Skip-Links hinzu, repariert Fokus-Management, erzwingt Alt-Text-Felder. Ersetzt kein barrierefreies Theme, aber behebt häufige Lücken.

Equalize Digital Accessibility Checker scannt Ihre Inhalte beim Speichern auf über 40 WCAG-2.2-Kriterien. Funktioniert wie ein SEO-Plugin, aber für Barrierefreiheit. Die kostenlose Version prüft Seiten und Beiträge. Pro (ab 145 USD/Jahr) scannt die gesamte Website und exportiert Berichte.

Sa11y ist ein unterschätztes Tool: 80+ Checks mit visuellen Tooltips direkt im Frontend, Überschriften-Hierarchie-Visualisierung, Kontrast-Prüfung. Nur 300+ Installationen, aber perfekte 5-Sterne-Bewertung.

Wenn Sie nur ein Plugin installieren: WP Accessibility. Es löst die häufigsten technischen Probleme und ist kostenlos.

Wenn Sie ein Redaktionsteam haben: Equalize Digital Accessibility Checker. Es zeigt Redakteuren Barrieren direkt beim Schreiben.

Was können Sie selbst tun, wo brauchen Sie eine Agentur?

Konkreter Aktionsplan

Phase 1 (sofort, Eigenleistung): Installieren Sie WP Accessibility. Navigieren Sie Ihre Website nur mit der Tab-Taste. Notieren Sie, wo Sie nicht hinkommen oder den Fokus verlieren. Prüfen Sie die 10 meistbesuchten Seiten mit WAVE oder Lighthouse.

Phase 2 (1–4 Wochen, Eigenleistung + Agentur): Beauftragen Sie eine Experten-Kurzanalyse (490–1.200 €). Beheben Sie Content-Barrieren selbst: Alt-Texte, Überschriften, Linktexte. Details zu den Kosten einer barrierefreien Website.

Phase 3 (1–3 Monate, Agentur): Theme-Struktur bereinigen oder Builder korrekt konfigurieren. ARIA-Landmarks, Fokus-Management, Formular-Zugänglichkeit. Barrierefreiheitserklärung erstellen.

Phase 4 (laufend): Redaktionsteam schulen. Neue Inhalte von Anfang an barrierefrei erstellen. Jährlicher Re-Audit (700–2.500 €).

Prüfen Sie zuerst, ob Sie vom BFSG überhaupt betroffen sind. Falls Sie einen Online-Shop betreiben, gelten verschärfte Anforderungen für Checkout und Produktfilter.

Wie dringend ist das?

Das BFSG gilt seit dem 28. Juni 2025. Es gibt keine Übergangsfrist für Websites und Online-Shops.

Seit Januar 2026 führt die Marktüberwachungsstelle MLBF in Magdeburg (ca. 70 Mitarbeiter) aktive Kontrollen durch. Bußgelder reichen bis 100.000 €. Stand März 2026 sind keine öffentlichen Bußgelder bekannt, die Kontrollintensität steigt aber.

Parallel dazu läuft seit August 2025 eine Abmahnwelle. Eine Kanzlei verschickt pauschale Abmahnungen an Online-Shops (ca. 595 € pro Fall). Die Rechtmäßigkeit ist umstritten, erste Gerichtsurteile werden 2026 erwartet. Mehr dazu unter BFSG-Abmahnung: Was tun?.

Häufige Fragen

Reicht ein Accessibility-Plugin, um meine WordPress-Seite BFSG-konform zu machen?

Nein. Plugins wie WP Accessibility beheben häufige technische Probleme (Skip-Links, Fokus-Indikatoren, Alt-Text-Felder). Strukturelle Barrieren im Theme, fehlerhafte ARIA-Implementierung in Page Buildern und nicht-zugängliche Formulare können sie nicht reparieren. Ein Plugin ist ein Baustein, keine Gesamtlösung.

Was kostet es, eine WordPress-Website barrierefrei zu machen?

Das hängt vom Ausgangszustand ab. Ein Audit kostet 490–8.000 €, die Umsetzung für eine KMU-Website (20–50 Seiten) liegt bei 4.000–12.000 €. Wenn ein Relaunch ansteht, kostet Barrierefreiheit nur 10–15 % mehr als ein Standard-Relaunch. Details und Fördermöglichkeiten unter Barrierefreie Website: Kosten 2026.

Ist Elementor barrierefrei?

Elementor kann BFSG-konform konfiguriert werden, ist es aber nicht automatisch. Im Equalize Digital Report 2025 rangiert Elementor auf Platz 4 von 19 Buildern. Voraussetzung: „Default”-Seitenlayout verwenden (nicht „Full Width”), semantische HTML-Tags manuell setzen, und JavaScript-Widgets auf Fokus-Management prüfen. Ohne diese Schritte erzeugt Elementor tief verschachtelte <div>-Strukturen, die assistiven Technologien keine Kontextinformationen bieten.

Gilt das BFSG auch für kleine Unternehmen mit WordPress-Website?

Die Kleinstunternehmen-Ausnahme greift nur bei weniger als 10 Beschäftigten und weniger als 2 Mio. € Jahresumsatz, und nur für Dienstleistungen. Sobald Sie 10 oder mehr Mitarbeiter haben, gilt das BFSG vollständig. Für Online-Shops gibt es keine Größenausnahme, da sie unter die Produktregelungen fallen. Mehr unter BFSG-Pflicht: Bin ich betroffen?.

Macht eine automatische Vorlesefunktion meine Website BFSG-konform?

Nein. Menschen, die auf Vorlesefunktionen angewiesen sind, nutzen bereits eigene Screenreader (NVDA, VoiceOver, JAWS), die wesentlich leistungsfähiger sind als jede Website-eigene Sprachausgabe. Das BFSG fordert die Zugänglichkeit für assistive Technologien des Nutzers, nicht die Bereitstellung eigener Tools.