Barrierefreiheit im Online-Shop: Den Kaufweg prüfen

Muss mein Online-Shop barrierefrei sein?

Das BFSG erfasst seit dem 28. Juni 2025 bestimmte Verbraucherdienstleistungen einschließlich des elektronischen Geschäftsverkehrs. Ein Online-Shop, über den Verbraucher Verträge abschließen, ist das typische Beispiel.

Für Dienstleistungen von Kleinstunternehmen mit weniger als zehn Beschäftigten und höchstens zwei Millionen Euro Jahresumsatz oder Jahresbilanzsumme besteht eine Ausnahme. Shops, die sich tatsächlich nur an Unternehmen richten, sind gesondert zu bewerten. Details erklärt der Beitrag zur BFSG-Pflicht. Auch ohne Pflicht lohnt sich die Arbeit: Ein Kaufweg, der mit Tastatur, Vergrößerung und Screenreader funktioniert, ist meist auch für alle anderen klarer. Ordne dein konkretes Angebot anhand des Gesetzes ein und kläre offene Rechtsfragen fachlich; dieser Beitrag ist keine Rechtsberatung.

Welche Anforderungen gelten für Online-Shops?

Die Verordnung zum BFSG verlangt in § 12, dass Websites und Apps wahrnehmbar, bedienbar, verständlich und robust gestaltet sind. § 19 BFSGV ergänzt für den elektronischen Geschäftsverkehr: Identifizierungs-, Authentifizierungs-, Sicherheits- und Zahlungsfunktionen müssen ebenso zugänglich sein.

Außerdem musst du Informationen zur Barrierefreiheit der verkauften Produkte bereitstellen, soweit der verantwortliche Wirtschaftsakteur, etwa der Hersteller, sie zur Verfügung stellt. Entspricht die Dienstleistung harmonisierten Normen, die im Amtsblatt der EU veröffentlicht sind, wird nach § 4 BFSG vermutet, dass sie die davon abgedeckten Anforderungen erfüllt. Als praktische Arbeitsgrundlage für Shop-Teams eignet sich WCAG 2.2 auf Stufe AA.

Wie prüfst du den Kaufweg Schritt für Schritt?

Nutze ein Produkt mit Varianten, eine typische Versandadresse und eine echte verfügbare Zahlungsart in einer geeigneten Testumgebung. Prüfe sowohl den Gastkauf als auch die Anmeldung, sofern dein Shop beides anbietet.

Wiederhole den Durchlauf mit der Tastatur, mit 200 Prozent Vergrößerung, auf einem Smartphone und mit einem Screenreader. Notiere für jede Station, ob die Aufgabe gelingt, nur mit Umweg gelingt oder scheitert.

• Produktsuche und Filter: Bedienbarkeit, verständliche Bezeichnungen und erkennbare Änderungen der Trefferliste.
• Produktseite: Aussagekräftige Bildbeschreibungen, zugängliche Varianten und Verfügbarkeit.
• Warenkorb: Mengen ändern, Produkte entfernen und Summen nachvollziehen.
• Checkout: Feldbeschriftungen, Fehlerkorrektur und verständliche Pflichtangaben.
• Zahlung und Bestätigung: Externe Weiterleitungen, Rückkehr zum Shop und erkennbarer Abschluss.

Wo scheitern Kaufwege besonders oft?

1. 1Farb- oder Größenauswahl als kleine Felder ohne Textnamen: Mit Screenreader hört man nur „Button“.
2. 2Filter, die die Trefferliste ändern, ohne die neue Anzahl anzukündigen, etwa „24 Produkte gefunden“.
3. 3Plus- und Minus-Schaltflächen für die Menge ohne Beschriftung.
4. 4Ein Warenkorb, der sich aktualisiert, ohne dass Screenreader die Änderung ankündigen.
5. 5Ein Cookie-Banner oder fixierter Header, der das fokussierte Element verdeckt (WCAG 2.4.11).
6. 6Zu kleine Klickziele auf dem Smartphone unterhalb von 24 × 24 CSS-Pixeln ohne ausreichenden Abstand (WCAG 2.5.8).
7. 7Fehlermeldungen im Checkout, die nur durch einen roten Rahmen erkennbar sind.
8. 8Ein CAPTCHA bei Anmeldung oder Bestellung ohne zugängliche Alternative.
9. 9Hinweise zu Versandkosten oder Lieferzeit, die nur beim Überfahren mit der Maus erscheinen.
10. 10Eine Reservierungszeit im Warenkorb, die abläuft, ohne dass sie sich verlängern lässt.

Was gehört auf eine zugängliche Produktseite?

Produktbilder brauchen Alternativtexte, die relevante Eigenschaften zeigen, etwa Farbe, Material oder einen besonderen Verschluss. Preis, Grundpreis, Lieferzeit und Verfügbarkeit stehen als echter Text auf der Seite, nicht nur in einer Grafik.

Größentabellen gehören in eine echte HTML-Tabelle mit Kopfzellen. Produktvideos brauchen Untertitel. Liefert der Hersteller Angaben zur Barrierefreiheit eines Produkts, etwa bei einem E-Book-Reader, gehören sie in die Beschreibung. Varianten sollten als Auswahlfelder mit Namen umgesetzt sein, damit „Farbe: Dunkelblau, ausgewählt“ angesagt wird. Hinweise wie „Nur noch 2 Stück“ oder ein Rabatt sollten nicht nur über Farbe oder ein Symbol erkennbar sein.

Wie gehst du mit Zahlungsanbietern und Plugins um?

Zahlungsdialoge, Bewertungswidgets und Consent-Banner gehören zum praktischen Nutzerweg. Das BFSG nimmt Inhalte Dritter aus, die du weder finanzierst noch entwickelst noch kontrollierst. Verlass dich bei Komponenten, die du bewusst in deinen Kaufweg einbaust, nicht ungeprüft auf diese Ausnahme.

Teste externe Komponenten mit und dokumentiere Probleme. Frage den Anbieter nach Informationen zur Barrierefreiheit und vergleiche bei Bedarf Alternativen. Achte besonders auf Weiterleitungen zur Bank oder zum Zahlungsdienst: Landet der Fokus nach der Rückkehr an einer sinnvollen Stelle, und ist die Bestellbestätigung erkennbar? Biete wenn möglich mehrere Zahlungsarten an. Scheitert eine, bleibt so ein anderer Weg zum Abschluss. Ein zusätzliches Widget kann einen unzugänglichen Checkout nicht pauschal reparieren.

Welche Informationen zur Barrierefreiheit musst du bereitstellen?

Nach § 14 und Anlage 3 BFSG beschreibst du die Dienstleistung, erklärst ihre Durchführung, legst dar, wie sie die Anforderungen erfüllt, und nennst die zuständige Marktüberwachungsbehörde. Die Bundesfachstelle Barrierefreiheit empfiehlt, die Angaben etwa über einen Link „Barrierefreiheit“ im Kopf- oder Fußbereich leicht auffindbar zu machen. Die Informationen müssen selbst barrierefrei sein. Beschreibe konkret, was du umgesetzt hast, etwa Tastaturbedienung, Kontraste, Formulare und Zahlungsarten, statt nur einen Standard zu nennen.

Halte die Angaben aktuell, wenn du Checkout, Theme oder Zahlungsarten änderst. § 14 Absatz 3 BFSG verlangt, Veränderungen bei der Erbringung der Dienstleistung gebührend zu berücksichtigen.

Was kann ein automatischer Check im Shop leisten?

Der Accessonaut BFSG-Check prüft eine öffentlich erreichbare Seite automatisch und zeigt Fundstellen nach Wichtigkeit. Prüfe nach der Startseite auch Produktseite, Kategorieseite und Formulare. Schritte hinter Warenkorb und Zahlung testest du manuell. Wiederhole den Check nach Theme- und Plugin-Updates, weil sich dabei Vorlagen ändern können. Ein gutes Ergebnis ist kein Nachweis der BFSG-Konformität.