Barrierefreiheit in Shopware 6: die acht häufigsten Fehler

Aus unseren Messungen an deutschen Online-Shops: acht Befunde, die in Shopware-Storefronts immer wieder auftauchen — und was sie technisch verursacht.

Die gute Nachricht: Keiner dieser acht Punkte ist ein Architekturproblem. Es sind Theme-Variablen, fehlende Attribute und Redaktionsprozesse. Wer sie einmal sauber löst, hat den größten Teil der automatisch prüfbaren Anforderungen im Griff.

1. Kontrast im dunklen Theme

Black-Friday-Banner und graue Sekundärtexte fallen unter 4,5:1. Prüfen Sie die Theme-Variablen für Text- und Hintergrundfarben, nicht die einzelnen Komponenten — sonst kehrt das Problem beim nächsten Plugin zurück.

2. aria-label auf Buy-Buttons

Ein zusätzliches aria-label am „In den Warenkorb"-Button, das nicht mit dem sichtbaren Text übereinstimmt, ist der häufigste Befund in unseren Messungen. Entweder Label entfernen oder exakt gleich formulieren.

3. Zu kleine Klickziele

Mengen-Stepper und Entfernen-Buttons im Warenkorb liegen oft bei 20 × 20 Pixeln. WCAG 2.2 verlangt 24 × 24. Ein min-width/min-height plus Innenabstand im Theme löst das ohne Layout-Umbau.

4. Alternativtexte aus der Medienverwaltung

Shopware übernimmt den Dateinamen, wenn kein Alternativtext gepflegt ist. Setzen Sie das Feld im Produkt-Medien-Tab und machen Sie es für Redakteurinnen zur Pflicht — technisch ist es ein Ein-Zeilen-Fix, organisatorisch der eigentliche Aufwand.

5. Checkout-Erweiterungen ohne Labels

Zahlungs- und Adress-Plugins rendern häufig Platzhalter statt <label>. Platzhalter verschwinden beim Tippen; Screenreader-Nutzer verlieren die Feldbeschreibung.

6. Fokus-Sichtbarkeit im Theme

Viele Themes setzen outline: none auf Links und Buttons. Tastaturnutzer sehen dann nicht, wo sie sind. Ein :focus-visible-Stil gehört in die Basis-CSS des Themes, nicht in jedes Plugin.

7. Skip-Link und Landmarks

Ein „Zum Inhalt springen"-Link sowie main, nav und header als Landmarks sparen Screenreader-Nutzern dutzende Tastendrücke pro Seite. Im Storefront-Theme sind sie meist nicht vorhanden.

8. Überschriften-Hierarchie in CMS-Blöcken

Im Erlebniswelten-Editor lassen sich Überschriften frei wählen; Redakteurinnen springen von h1 auf h3. Eine Vorgabe im CMS-Layout plus Prüfung im Redaktionsprozess verhindert das.

Was danach noch fehlt

Ein automatischer Scan prüft nicht, ob die Tastaturbedienung im Checkout wirklich funktioniert, ob die Fehlermeldung eines Formulars verständlich ist und ob PDF-Rechnungen lesbar sind. Diese Punkte brauchen einen Menschen. Der Scan sagt Ihnen, wo Sie anfangen sollen — nicht, dass Sie fertig sind.

Prüfen Sie Ihren Shop

Der kostenlose Schnellcheck zeigt Ihnen die drei wichtigsten Befunde Ihrer Startseite. Der vollständige Bericht über bis zu 25 Seiten — Startseite, Kategorie, Produkt, Warenkorb, Suche, Formulare — kostet 49 Euro und enthält je Befund ein Code-Beispiel aus Ihrem Theme.

Shop kostenlos prüfen Die Studie mit 50 Shops ansehen

Automatisierter Check. Keine Rechtsberatung, keine Zusicherung der BFSG-Konformität.