Onlineshops sind nicht irgendein Anwendungsfall des Barrierefreiheitsstärkungsgesetzes, sie sind sein Kernfall: Dienstleistungen im elektronischen Geschäftsverkehr stehen ausdrücklich im Gesetz, und ein Shop schließt mit jeder Bestellung genau den Verbrauchervertrag, um den es geht. Gleichzeitig ist ein Shop das anspruchsvollste Barrierefreiheits-Projekt unter den Website-Typen, weil Formulare, Varianten, Fremddienste und Zeitdruck zusammenkommen.
Diese Seite geht den Shop entlang der Kaufstrecke durch. Die allgemeine Pflichtenlage samt Kleinstunternehmen-Ausnahme steht in BFSG-Pflichten, die technischen Kriterien in WCAG-Grundlagen.
Warum der Shop der kritische Fall ist
Bei einer Informationsseite bedeutet eine Barriere Unbequemlichkeit. Bei einem Shop bedeutet sie, dass der Kauf nicht zustande kommt: Ein Variantenwähler, der nur per Maus bedienbar ist, eine Fehlermeldung, die nicht angekündigt wird, ein Zahlungsdialog, der den Fokus verliert, jede dieser Stellen bricht die Kette. Barrierefreiheit im Shop ist deshalb kein Compliance-Thema neben dem Geschäft, sie ist Konversionsoptimierung für eine Kundengruppe, die bisher an der Kasse abgewiesen wird.
Dazu kommt die rechtliche Seite: Verstöße in der Kassenstrecke sind die wahrscheinlichsten Gegenstände von Beschwerden und Abmahnungen, weil sie den Kern des Gesetzes treffen und leicht zu belegen sind. Die Risikoeinordnung steht in BFSG-Abmahnung und Sanktionen.
Die Kaufstrecke im Einzelnen
Produktliste und Suche
Filter und Sortierung müssen per Tastatur bedienbar sein und ihre Wirkung ankündigen: Wenn nach dem Setzen eines Filters die Trefferliste neu lädt, muss ein Hilfsmittel das erfahren, sonst bedient der Nutzer eine Seite, von der er nicht weiß, dass sie sich geändert hat. Preisspannen-Schieberegler sind der Klassiker der Unbedienbarkeit; ein Zahlenfeld daneben löst das robust.
Die Produktseite
Hier entscheidet sich die Wahrnehmbarkeit des Angebots:
- Produktbilder brauchen Alternativtexte, die das Produkt beschreiben, nicht den Dateinamen oder die Artikelnummer wiederholen. Bei Bildergalerien braucht jedes Bild mit eigener Information einen eigenen Text. Die Formeln stehen in Alt-Texte schreiben.
- Varianten als echte Formularelemente. Größen- und Farbwähler aus anklickbaren Kacheln ohne Semantik sind für Hilfsmittel unsichtbar. Es muss erkennbar sein, was ausgewählt ist und was nicht verfügbar ist, und zwar nicht nur über Farbe.
- Preis, Verfügbarkeit und Lieferzeit als Text, nicht als Grafik, und Änderungen (etwa nach Variantenwahl) angekündigt.
- Text nicht in Aktionsbanner backen. Rabattaktionen als Bild mit eingebettetem Text sind unleserlich und unauffindbar. Was auf der Produktseite außerdem verkäuferisch zählt, steht in Produktseiten optimieren.
Warenkorb und Kasse
Die Kasse ist ein Formular-Marathon, und für Formulare sind die Regeln klar: jedes Feld mit echter, verknüpfter Beschriftung, Pflichtfelder als solche benannt, die Bildschirmtastatur passend zum Feldtyp, keine Zeitbegrenzung, die eine Sitzung unangekündigt beendet.
Zwei Punkte verdienen besondere Sorgfalt:
Fehlermeldungen. Die Meldung muss benennen, welches Feld betroffen ist und was zu tun ist, sie muss angekündigt werden, und der Fokus sollte zum ersten fehlerhaften Feld springen. Eine rote Umrandung allein ist doppelt mangelhaft: nicht wahrnehmbar für Screenreader, nicht erkennbar für Menschen mit Farbsinnstörung.
Redundante Eingaben. Die WCAG 2.2 verlangen, bereits eingegebene Daten im selben Vorgang nicht erneut abzufragen. Die Übernahme der Lieferadresse als Rechnungsadresse per Vorbelegung ist genau dieses Kriterium.
Zahlungsdienste und andere Fremdkomponenten
Eingebettete Zahlungsdialoge, Adressvalidierer und Consent-Banner sind Teil der Dienstleistung, auch wenn sie von Dritten stammen. Der Betreiber haftet für die Strecke als Ganzes. Praktisch heißt das: Die Zahlungsarten mit Tastatur und Screenreader einmal vollständig durchspielen, und bei der Auswahl der Anbieter Barrierefreiheit als Kriterium mitführen. Welche Zahlungsarten ohnehin ins Sortiment gehören, steht in Zahlungsarten im Shop.
Bestellbestätigung und E-Mails
Die Bestätigungsseite muss den Abschluss ankündigen, nicht nur anzeigen. Und die Transaktions-E-Mails gehören zur Dienstleistung dazu: echte Textinhalte statt reiner Bild-Mails, sinnvolle Struktur, lesbare Kontraste.
Systemwahl: was das Shopsystem beiträgt
Moderne gehostete Plattformen und aktuelle Shop-Themes haben in Barrierefreiheit spürbar investiert, die Unterschiede zwischen Themes desselben Systems sind aber größer als die zwischen den Systemen. Vor dem Kauf eines Themes lohnt der Zehn-Minuten-Test: Demo-Shop mit Tastatur bedienen, Variantenwahl prüfen, Kasse durchtabben, ein Prüfwerkzeug über die Produktseite laufen lassen. Ein Theme, das hier durchfällt, wird durch keine spätere Konfiguration gut. Der Systemvergleich mit den jeweiligen Kipppunkten steht in Shopsysteme im Vergleich.
Umsetzen in der richtigen Reihenfolge
- Kassenstrecke testen und reparieren. Tastatur, Screenreader, Zoom, ein kompletter Testkauf. Das ist der Bereich mit Rechtsrisiko und Umsatzwirkung zugleich.
- Produktseiten-Vorlage in Ordnung bringen. Varianten, Preisdarstellung, Galerie, ein Fehler in der Vorlage betrifft jedes Produkt.
- Produktdaten nachziehen. Alternativtexte und Beschreibungen für das Sortiment, beginnend mit den umsatzstärksten Artikeln.
- Flächige Verstöße beheben: Kontraste, Fokus-Sichtbarkeit, Linktexte, nach dem Ablauf in Barrierefreiheit testen.
- Informationen zur Barrierefreiheit veröffentlichen, ehrlich und mit Stand, nach der Gliederung in Barrierefreiheitserklärung.
- In den Betrieb übernehmen: Prüfung nach Theme-Updates und neuen Apps, Alternativtexte als Pflichtfeld im Produktanlage-Prozess.
Der letzte Punkt entscheidet über die Dauerhaftigkeit: Ein Shop ändert sich wöchentlich, und Barrierefreiheit, die nicht im Prozess verankert ist, erodiert mit jedem neuen Produkt.