Barrierefreiheit Shopify: So wird Ihr Shop EAA-konform

Shopify barrierefrei machen: Welche Themes WCAG 2.1 AA erfüllen, welche Apps helfen, häufige Fehler im Checkout und Produktseiten — EAA-Compliance für Shopify-Shops.

EAA Checker Team8 Min. Lesezeit

Shopify ist die meistgenutzte E-Commerce-Plattform in Deutschland. Seit dem 28. Juni 2025 gilt das Barrierefreiheitsstärkungsgesetz (BFSG) auch für Online-Shops. Dieser Artikel zeigt, was Shopify-Betreiber konkret tun müssen, welche Themes empfehlenswert sind und wo die größten Fallstricke liegen.

Shopify und Barrierefreiheit: Der Status quo

Shopify investiert in Barrierefreiheit: Es gibt ein internes Accessibility-Team, und das Dawn-Theme gilt als eines der zugänglichsten E-Commerce-Themes am Markt. Dennoch gibt es Bereiche, die Shop-Betreiber selbst im Griff haben müssen:

Shopify macht gut

  • • Dawn-Theme mit solider Grundbarrierefreiheit
  • • Checkout mit ARIA-Support
  • • Automatische Alt-Text-Felder für Produktbilder
  • • Dediziertes Accessibility-Team

Liegt beim Shop-Betreiber

  • • Alt-Texte für Produktbilder befüllen
  • • Theme-Farbkontraste prüfen
  • • Third-Party-Apps auf Barrierefreiheit prüfen
  • • Barrierefreiheitserklärung erstellen

Shopify-Themes im Barrierefreiheits-Vergleich

Empfohlene Themes

Dawn (kostenlos)

Beste Wahl

Shopifys Standard-Theme. Sauberes semantisches HTML, gute Fokus-Indikatoren, getestetes Tastaturnavigation-Verhalten. Direkt verfügbar, keine Zusatzkosten.

Sense (kostenlos)

Empfohlen

Für produktzentrierte Shops. Gute Farbkontraste in der Standardkonfiguration, saubere Produktgalerie mit Alt-Text-Unterstützung.

Craft (kostenlos)

Empfohlen

Für Handmade/Artisan-Shops. Minimalistisches Design mit hohem Kontrast, gute Zugänglichkeit out of the box.

Themes mit bekannten Problemen

ThemeProblemAufwand zur Behebung
Booster ThemeSchlechte Tastaturnavigation, fehlende ARIAHoch
TurboZu viel JavaScript, AJAX-Updates ohne Live-RegionsMittel
ImpulseKontrastverhältnisse in Standard-Farben zu niedrigMittel

Häufige Barrierefreiheitsfehler in Shopify-Shops

Produktbilder ohne Alt-Text

Shopify bietet für jedes Produktbild ein Alt-Text-Feld — aber es wird selten ausgefüllt. Gehen Sie im Shopify-Admin zu Produkte → Produkt auswählen → Bild anklicken → "Alt-Text bearbeiten". Das sollte für jedes Bild gemacht werden.

Farb-Swatches ohne Textalternative

Farbige Kreise oder Quadrate zur Farbauswahl sind für Screenreader-Nutzer und farbenblinde Nutzer unzugänglich. Jeder Swatch braucht einen beschreibenden Text (als aria-label oder als sichtbarer Tooltip) — nicht nur die Farbe als Hintergrund.

Checkout: Formularfelder ohne Labels

Der Standard-Shopify-Checkout ist relativ gut zugänglich, aber Custom-Checkout-UI-Extensions können Probleme einbringen. Prüfen Sie nach jeder Extension-Änderung den Checkout mit einem Screen Reader oder dem EAA Checker.

Popup-Fenster und Newsletter-Overlays

Discount-Popups und Newsletter-Overlays sind häufig das größte Accessibility-Problem in Shopify-Shops. Anforderungen:

  • Fokus muss beim Öffnen ins Modal wandern
  • Hintergrund muss für Screen Reader deaktiviert sein (aria-hidden="true")
  • Schließen-Button muss per Tastatur erreichbar sein (inkl. Escape-Taste)
  • Beim Schließen muss der Fokus zurückspringen (auf auslösendes Element)

Shopify-Apps und Barrierefreiheit

Drittanbieter-Apps (Produktbewertungen, Chat, Upsells) können die Barrierefreiheit erheblich verschlechtern. Tipps beim App-Einsatz:

  • Prüfen Sie im App-Store, ob der Anbieter Barrierefreiheit dokumentiert
  • Installieren Sie eine neue App auf einem Staging-Shop und führen Sie danach einen Scan durch
  • Chat-Widgets (Tidio, Gorgias) laden oft iframes — prüfen Sie, ob diese zugänglich sind
  • Bewertungs-Apps (Judge.me, Yotpo) müssen Sternebewertungen als Text kommunizieren

Checkliste: Shopify EAA-Compliance

  1. Dawn-Theme oder ein anderes barrierefreies Theme nutzen
  2. Alt-Texte für alle Produkt- und Kollektionsbilder ausfüllen
  3. Farbkontraste in Ihrer Farbpalette prüfen (mindestens 4,5:1 für Text)
  4. Checkout-Prozess mit Tastatur komplett durchlaufen
  5. Popup-Overlays auf Fokus-Management testen
  6. Alle installierten Apps einzeln scannen
  7. Barrierefreiheitserklärung erstellen und im Footer verlinken
  8. Automatisierten Gesamt-Scan für Gesamtüberblick durchführen

Shopify-Shop jetzt auf EAA prüfen

Unser Scanner analysiert Ihren Shopify-Shop auf WCAG 2.1 AA — inklusive dynamischer Inhalte, Produktseiten und Checkout. Kostenlos, ohne Installation.

Shopify-Shop kostenlos scannen →

Häufige Fragen

Ist Shopify von Haus aus barrierefrei?
Shopifys eigene Infrastruktur und das Dawn-Theme haben gute Barrierefreiheitsgrundlagen — Shopify beschäftigt ein dediziertes Accessibility-Team. Aber viele gekaufte Themes, Custom-Apps und Liquid-Anpassungen können die Barrierefreiheit verschlechtern. Prüfen Sie Ihren Shop immer individuell.
Welches Shopify-Theme ist am barrierefreiesten?
Dawn (Shopifys Standard-Theme) ist das zugänglichste Theme aus dem offiziellen Theme Store. Es hat gutes Fokus-Management, korrekte ARIA-Attribute und ausreichende Kontraste. Weitere gut bewertete Themes: Sense, Craft, Refresh — alle aus dem offiziellen Shopify Theme Store mit Accessibility-Angaben.
Gilt das BFSG auch für Shopify-Shops aus Deutschland?
Ja. Wenn Sie einen Shopify-Shop betreiben, der sich an deutsche Verbraucher richtet, gilt das BFSG. Es kommt nicht darauf an, auf welcher Plattform der Shop läuft, sondern wo Ihre Kunden sitzen. Shopify als Plattform muss ihrerseits barrierefrei sein — aber der Shop-Betreiber bleibt für den eigenen Auftritt verantwortlich.
Kann ich den Shopify-Checkout barrierefrei machen?
Den Shopify-Checkout können Shop-Betreiber seit Checkout Extensibility (2023) über Checkout UI Extensions anpassen. Shopify selbst arbeitet aktiv an der Barrierefreiheit des Checkouts. Prüfen Sie nach jeder Shopify-Update, ob Anpassungen die Zugänglichkeit beeinflussen.