Zum Inhalt springen
Shopsystem

Shopware barrierefrei: Die häufigsten Fehler und wo Sie sie beheben

In einem Shopware-Shop kommen Barrieren aus drei Quellen: dem Theme, den Erweiterungen und den Inhalten, die Sie selbst pflegen – etwa in den Erlebniswelten. Vieles beheben Sie in der Administration, manches nur im eigenen Theme. Hier stehen die typischen Probleme in Klartext, wen sie betreffen und wo Sie sie in Shopware 6 ändern.

ca. 6 Minuten Lesezeit Stand: Oktober 2026

1Woher kommen die Barrieren?

  • Theme: Viele Shops bauen auf der Shopware-Storefront auf und passen sie in einem eigenen Theme an. Was das eigene Theme überschreibt, kann Barrieren mitbringen.
  • Erweiterungen: Plugins und Apps aus dem Shopware Store bringen eigenen Code mit, etwa für Slider, Filter oder Cookie-Hinweise.
  • Inhalte: Bilder in den Medien sowie Texte und Überschriften in den Erlebniswelten pflegen Sie selbst.

2Die häufigsten Probleme

Diese Probleme findet ein automatischer Test in Onlineshops besonders oft. Sie sind nach Schweregrad sortiert – fangen Sie oben an.

  1. Problem 1: Bilder ohne Alternativtext

    WCAG 1.1.1 Nicht-Text-Inhalt · Stufe A

    Kritisch

    Was ist das Problem?

    Produkt-, Kategorie- oder Bannerbilder haben keinen Alt-Text – häufig nach einem Produktimport.

    Wen betrifft es?

    Blinde und sehbehinderte Menschen mit Screenreader. Sie hören nur „Bild“ oder den Dateinamen.

    So beheben Sie es in Shopware

    Inhalte, dann Medien, dann Bild auswählen, dann Feld „Alt-Text“ in der Seitenleiste ausfüllen

    Gilt auch für Produktbilder. Ratgeber: Alt-Texte für Produktbilder

  2. Problem 2: Formularfelder ohne Beschriftung

    WCAG 4.1.2 Name, Rolle, Wert · Stufe A

    Kritisch

    Was ist das Problem?

    Suchfeld, Newsletter-Anmeldung oder Kontaktformular haben nur einen Platzhaltertext, aber keine echte Beschriftung.

    Wen betrifft es?

    Screenreader-Nutzer wissen nicht, was sie eingeben sollen. Und sobald man tippt, verschwindet der Platzhalter für alle.

    So beheben Sie es in Shopware

    Häufig Newsletter- oder Suchfelder. Im eigenen Theme die Twig-Vorlage des Formulars überschreiben und ein <label> ergänzen (ggf. mit Klasse visually-hidden). Ratgeber: Formulare und Kasse per Tastatur

  3. Problem 3: Buttons ohne erkennbaren Namen

    WCAG 4.1.2 Name, Rolle, Wert · Stufe A

    Kritisch

    Was ist das Problem?

    Icon-Buttons wie Suche, Menü, Warenkorb oder Slider-Pfeile haben keinen Text.

    Wen betrifft es?

    Screenreader sagen nur „Schaltfläche“ an, ohne zu verraten, was sie tut.

    So beheben Sie es in Shopware

    Meist Icon-Buttons (Suche, Menü, Merkzettel). Im eigenen Theme die betreffende Twig-Vorlage überschreiben und ein aria-label ergänzen. Ratgeber: Links und Buttons richtig benennen

  4. Problem 4: Text mit zu wenig Kontrast

    WCAG 1.4.3 Kontrast (Minimum) · Stufe AA

    Hoch

    Was ist das Problem?

    Graue Preise, helle Buttons, Sale-Badges oder Links in der Fußzeile heben sich zu wenig vom Hintergrund ab.

    Wen betrifft es?

    Menschen mit Sehschwäche, ältere Menschen und alle, die das Handy in der Sonne benutzen.

    So beheben Sie es in Shopware

    Inhalte, dann Themes, dann Ihr Theme, dann Farben

    Primär-, Text- und Hintergrundfarben anpassen. Farben in Erlebniswelten separat prüfen. Ratgeber: Kontraste im Onlineshop

  5. Problem 5: Links ohne erkennbaren Namen

    WCAG 2.4.4 Linkzweck (im Kontext) · Stufe A

    Hoch

    Was ist das Problem?

    Icon-Links in Kopf- und Fußzeile, etwa Social-Media-Symbole oder das Warenkorb-Icon, haben keinen Text.

    Wen betrifft es?

    Screenreader lesen nur „Link“ vor, ohne Ziel. Wer per Sprachsteuerung bedient, kann den Link nicht ansprechen.

    So beheben Sie es in Shopware

    Meist Icon-Links in Header und Footer. Im eigenen Theme die Twig-Vorlage (z. B. layout/header/header.html.twig) überschreiben und ein aria-label ergänzen. Ratgeber: Links und Buttons richtig benennen

  6. Problem 6: Überschriften in falscher Reihenfolge

    Best Practice

    Mittel

    Was ist das Problem?

    Überschriften überspringen Ebenen, etwa von H2 direkt zu H4, weil sie nach Optik statt nach Gliederung gewählt wurden.

    Wen betrifft es?

    Screenreader-Nutzer, die sich über die Überschriften einen Überblick über die Seite verschaffen.

    So beheben Sie es in Shopware

    In Inhalte → Erlebniswelten bei Text-Elementen die Überschriften-Ebene im Editor prüfen; feste Ebenen im eigenen Theme (Twig) anpassen. Ratgeber: Überschriften richtig gliedern

3Was können Sie selbst beheben?

  • Ohne Programmierkenntnisse: Alt-Texte in den Medien, Farben im Theme, Überschriften und Texte in den Erlebniswelten und Meta-Titel im Reiter SEO.
  • Mit Unterstützung: Icon-Buttons, Beschriftungen und Seitenbereiche in den Twig-Vorlagen des eigenen Themes. Bei Problemen in Erweiterungen hilft eine Anfrage beim Anbieter.

4Was ein automatischer Test hier nicht findet

Ob sich Ihr Shop vom Produkt bis zur Bestellung nur mit der Tastatur bedienen lässt, prüfen Sie am besten selbst: einmal komplett durchklicken, nur mit Tab, Enter und Leertaste. Achten Sie besonders auf Off-Canvas-Elemente wie den Warenkorb oder das mobile Menü, die von der Seite hereinfahren.

  • Landet der Fokus im Warenkorb, wenn er sich öffnet – und wieder auf der Seite, wenn er sich schließt?
  • Sehen Sie jederzeit, wo der Fokus gerade steht?
  • Werden Fehlermeldungen im Formular vorgelesen, wenn Sie etwas vergessen haben?
  • Beschreiben die Alt-Texte das, was auf dem Bild zu sehen ist?

5Häufige Fragen

Gibt es eine Erweiterung, die das löst?

Es gibt Erweiterungen, die einzelne Dinge verbessern. Eine Erweiterung, die einen Shop auf Knopfdruck barrierefrei macht, gibt es nicht – auch kein Overlay-Widget. Warum Overlays nicht reichen

Muss ich mein Theme neu bauen lassen?

Meist nicht. Viele Probleme stecken in Inhalten, Farben und einzelnen Vorlagen. Prüfen Sie zuerst, was ein Update der Storefront schon verbessert, und passen Sie dann gezielt die Vorlagen an, die Ihr Theme überschreibt.

Erkennt BarriereCheck, dass mein Shop Shopware nutzt?

Meist ja. Dann steht im vollständigen Report bei den häufigsten Problemen zuerst der Weg in Shopware, danach die Wege in Shopify und WooCommerce.

Quellen

Die Menüpfade beziehen sich auf die deutsche Oberfläche und die Standard-Themes. Eigene Themes, Apps und Plugins können abweichen.

Dieser Artikel gibt einen allgemeinen Überblick und ersetzt keine Rechtsberatung.

Weiterlesen

Und Ihr Shopware-Shop?

Der kostenlose Test zeigt, wo in Ihrem Shop Barrieren stecken. Im vollständigen Report steht bei den häufigsten Problemen zusätzlich der Weg in Shopware.

Kostenlos · bis zu 3 Seiten ohne Anmeldung · mit Konto 10 · DSGVO-konform