Ratgeber · Stand: 02.11.2026 · Mit KI-Unterstützung erstellt und von Hafenklick geprüft

WooCommerce barrierefrei machen: ein Leitfaden für Agenturen

Hinweis: Dieser Ratgeber ist eine technische Orientierung, keine Rechtsberatung und keine Garantie für BFSG-Konformität. Ob das BFSG für ein Unternehmen gilt, klärt verbindlich nur eine Rechtsanwältin oder ein Rechtsanwalt (Orientierung: Gilt das BFSG für meinen Shop?).

Seit dem 28. Juni 2025 gilt das Barrierefreiheitsstärkungsgesetz (BFSG). Viele Shop-Kunden fragen deshalb ihre Agentur, ob ihr WooCommerce-Shop „BFSG-fertig“ ist. Dieser Leitfaden zeigt, wo die technischen Barrieren in WooCommerce-Projekten meist sitzen und wie Sie Prüfung, Angebot und Umsetzung strukturieren können. Technischer Maßstab ist in der Praxis die EN 301 549, die für Web-Inhalte auf die WCAG-Kriterien der Stufe AA verweist; wir prüfen nach WCAG 2.2 AA, die WCAG 2.1 AA vollständig enthält.

Warum WooCommerce selbst selten das Problem ist

WordPress hat ein eigenes Barrierefreiheits-Team und verbindliche Barrierefreiheits-Standards für den Core. Barrieren entstehen in Kundenprojekten meist durch die Schichten darüber: das Theme, den Page Builder, Plugins für Filter, Varianten, Cookie-Banner oder Pop-ups, Zahlungsanbieter und eigene Template-Anpassungen. Ein „barrierefrei“ beworbenes Theme garantiert deshalb noch keinen barrierefreien Shop.

Die 6 häufigsten Baustellen in WooCommerce-Projekten

Bereich	Typische Barriere	WCAG 2.2
Checkout	Felder nur mit Platzhalter statt sichtbarem Label, Fehlermeldungen nur farbig oder nicht mit dem Feld verknüpft	1.3.1, 3.3.1, 3.3.2
Page Builder	Klickbare `div`-Elemente statt Buttons oder Links, falsche Überschriften-Reihenfolge	2.1.1, 4.1.2, 1.3.1
Varianten und Filter	Farbauswahl nur als Farbfeld ohne Text, Filter laden per AJAX ohne Statusmeldung	1.1.1, 1.4.1, 4.1.3
Pop-ups und Cookie-Banner	Fokus wird nicht in den Dialog gesetzt oder bleibt darin gefangen, kein Schließen per Escape	2.1.2, 2.4.3
Mini-Cart und Off-Canvas-Menü	Öffnet sich, ohne dass Screenreader es erfahren; Fokus bleibt hinter dem Overlay	4.1.2, 2.4.11
Design	Zu geringer Kontrast bei Preisen, Sale-Badges und Buttons; unsichtbarer Fokus	1.4.3, 1.4.11, 2.4.7

Ein konkretes Beispiel mit Code-Korrekturen für mehrere dieser Muster zeigt unser Beispielbericht.

So strukturieren Sie die Prüfung

Kaufpfad festlegen: Startseite, Kategorie, Produkt mit Varianten, Warenkorb, Checkout, Bestellbestätigung. Shopify verlangt im Theme Store ebenfalls, dass der „kritische Pfad“ von der Startseite bis zum Checkout mit Hilfstechnologien bedienbar ist – ein guter Maßstab auch für WooCommerce.
Automatisch vorfiltern: axe-core oder Lighthouse finden nur einen Teil der Probleme und melden auch Fehlalarme. Nutzen Sie sie als Startpunkt, nicht als Nachweis.
Manuell prüfen: kompletter Tastatur-Durchlauf, Barrierefreiheitsbaum (Name, Rolle, Wert), Fehlerzustände im Checkout, Zoom 200 % und ein Durchlauf mit NVDA oder VoiceOver.
Nach Wirkung priorisieren: Alles, was den Kauf blockiert (z. B. nicht erreichbare Buttons), zuerst. Kosmetisches danach.
Dokumentieren: Befunde mit Seite, WCAG-Kriterium und Korrektur festhalten. Das hilft auch beim Erstellen der Informationen zur Barrierefreiheit (§ 14 BFSG mit Anlage 3), die Ihr Kunde veröffentlichen muss, wenn das Gesetz für ihn gilt.

Angebot an den Shop-Kunden: drei Bausteine

Stichprobe: 2–3 kritische Seiten oder Prozessschritte, um den Aufwand abzuschätzen.
Audit: alle relevanten Seitentypen mit priorisiertem Maßnahmenplan.
Umsetzung und Nachtest: Korrekturen im Theme-Code oder per Child-Theme, danach erneute Prüfung.

Overlay-Plugins, die per Skript „Barrierefreiheit auf Knopfdruck“ versprechen, ersetzen keine Korrektur im Code; die Probleme im HTML bleiben bestehen.

Quellen

Häufige Fragen

Ist WooCommerce barrierefrei?

WordPress verfolgt eigene Barrierefreiheits-Standards für den Core. Ob ein konkreter Shop barrierefrei ist, hängt vor allem von Theme, Page Builder, Plugins und eigenen Anpassungen ab. Das lässt sich nur am Shop selbst prüfen.

Reicht ein Barrierefreiheits-Plugin oder Overlay für das BFSG?

Nein, als technische Einschätzung: Overlays ändern das Problem im HTML-Code nicht. Barrieren müssen im Theme oder Template behoben werden. Eine rechtliche Bewertung ist das nicht.

Welche Seiten sollte eine Agentur zuerst prüfen?

Den Kaufpfad: Startseite, Kategorie, Produkt mit Varianten, Warenkorb und Checkout. Dort blockieren Barrieren direkt den Umsatz.

Nach welchem Standard wird geprüft?

In der Praxis nach EN 301 549, die für Web-Inhalte auf WCAG-Kriterien der Stufe AA verweist. Wer nach WCAG 2.2 AA prüft, deckt WCAG 2.1 AA mit ab.

Weiterlesen

Unterstützung gesucht?

Für Agenturen: manueller Check von bis zu 3 Seiten für 490 €, Kurzbericht in 5 Werktagen. Für Shops: Audit nach WCAG 2.2 / EN 301 549, Pilotpreis 990 € (regulär 1.490 €). Gem. §19 UStG wird keine Umsatzsteuer berechnet.

Check für Agenturen ansehen