Accessibility Overlays machen deinen Shopify Store nicht compliant

Die wichtigsten Punkte

• Ein Accessibility-Overlay ist ein einzelnes Skript, das automatische Compliance verspricht. Das kann es jedoch nicht einhalten, da automatisierte Tools nur einen Bruchteil der WCAG abdecken.
• Mehr als 1.000 Accessibility-Experten haben eine öffentliche Erklärung unterzeichnet, wonach Overlays unzuverlässig sind und keine Compliance gewährleisten können.
• Die FTC hat accessiBe im Jahr 2025 mit einer Geldstrafe von 1.000.000 US-Dollar belegt, weil das Unternehmen behauptete, sein Widget könne jede Website WCAG-konform machen.
• Websites, die Overlays installieren, werden trotzdem verklagt. Bei rund 1 von 4 US-amerikanischen ADA-Web-Klagen im Jahr 2024 wurde eine Website verklagt, auf der bereits ein Widget lief.
• Die einzige rechtlich sichere Lösung besteht darin, den zugrunde liegenden Theme-Code zu ändern. Finde die Probleme, behebe sie an der Quelle und überwache das Ganze auf Regressionen.

Wenn du dich mit Barrierefreiheit bei Shopify beschäftigt hast, kennst du sicher das Versprechen: Installiere eine Zeile Code und dein Shop wird über Nacht ADA- und WCAG-konform. Die Tools, die dieses Versprechen geben, nennt man Accessibility-Overlays. Zu diesen Produkten gehören accessiBe, UserWay, AudioEye und Accessibly.

Das Versprechen ist verlockend, doch die Realität sieht anders aus. Overlays machen einen Shop nicht compliant, die Accessibility-Community lehnt sie ab, Aufsichtsbehörden haben sie bestraft und Shops, die sie nutzen, werden weiterhin verklagt. Hier erfährst du, was wirklich dahintersteckt und was du stattdessen tun solltest.

Warum du uns vertrauen kannst

Jacques hat über 15 Jahre Entwicklungserfahrung im Aufbau barrierefreier Storefronts, und wir sind seit über vier Jahren im Shopify-Ökosystem aktiv. Wir haben Fudge entwickelt, einen KI-Store-Builder mit einer Bewertung von 4.9 im Shopify App Store, der Accessibility-Probleme im nativen Theme-Code behebt. Wir haben kein Overlay-Produkt, das wir dir verkaufen wollen, und unsere Ansicht deckt sich mit dem Konsens der Accessibility-Engineering-Community, die wir hier laufend zitieren.

Was ist ein Accessibility Overlay?

Ein Accessibility Overlay ist ein Drittanbieter-JavaScript, das du in deinem Store einfügst. Es lädt über deinen bestehenden Seiten und macht normalerweise zwei Dinge: Es zeigt ein schwebendes Accessibility-Menü (Schriftgröße, Kontrastschalter und ähnliche Widgets) und es behauptet, Accessibility-Probleme im Hintergrund automatisch zu erkennen und zu reparieren.

Das Marketing verkauft oft ein einziges Skript als Lösung für vollständige Compliance. Die technische Realität ist jedoch, dass das Skript lediglich über deinem HTML ausgeführt wird, ohne das eigentliche HTML darunter anzupassen.

Warum Overlays dich nicht compliant machen

Das Hauptproblem ist struktureller Natur. Ein Overlay ist ein automatisierter Code, der erst nach dem Laden auf deine Seite reagiert. Es kann den Kontext nicht so verstehen wie ein Mensch und auch die eigentliche Ursache der Probleme nicht umschreiben.

Automatisierte Tools decken nur einen Teil des Gesamtbildes ab. Unabhängige Tests zeigen immer wieder, dass die automatische Erkennung im Schnitt nur etwa 30 bis 40 % der WCAG-Erfolgskriterien erfasst. Der Rest erfordert menschliches Urteilsvermögen – etwa bei der Frage, ob ein Alt-Text sinnvoll ist, ob die Tastaturreihenfolge logisch aufgebaut ist oder ob ein Screenreader den Checkout-Prozess wirklich abschließen kann. Ein Overlay kann diese Einschätzung nicht liefern.

Accessibility-Experten lehnen Overlays ab. Mehr als 1.000 Accessibility-Profis, darunter auch Personen, die selbst an den WCAG-Richtlinien mitgewirkt haben, sowie Entwickler hinter bekannten Screenreadern, haben das Overlay Fact Sheet unterzeichnet. Darin wird ganz klar festgehalten, dass Overlays unzuverlässig sind und keine Compliance erreichen können.¹ Die National Federation of the Blind hat sie ebenfalls verurteilt, und in einer Umfrage von WebAIM gab die große Mehrheit von Fachleuten und Usern mit Behinderungen an, dass Overlays wirkungslos seien.

Overlays können die Experience sogar verschlechtern. Bei einigen Screenreader- und Tastaturnutzern stört das Overlay die von ihnen ohnehin genutzten Hilfsmittel, wodurch oft neue Barrieren geschaffen statt abgebaut werden.

Die juristische Realität: Overlays verhindern keine Klagen

Das ist der Teil, der Shop-Betreiber am meisten überrascht. Die Installation eines Overlays bietet keinen Schutz, und in einem bekannten Fall wurde sogar der Anbieter selbst bestraft.

Die FTC belegte accessiBe mit einer Strafe von 1.000.000 $. Im Jahr 2025 erließ die Federal Trade Commission eine endgültige Verfügung über 1.000.000 $ gegen accessiBe, weil das Unternehmen irreführend behauptet hatte, sein Produkt accessWidget könne jede Website WCAG-konform machen, und weil bezahlte Bewertungen als unabhängig dargestellt wurden.² Die Verfügung untersagt diese Konformitätsbehauptungen.

Websites mit Overlays werden weiterhin verklagt. Rund jede vierte der über 4.000 im Jahr 2024 in den USA eingereichten ADA-Klagen zur Barrierefreiheit im Internet richtete sich gegen eine Website, auf der bereits ein Accessibility-Widget oder -Overlay installiert war.³ Wenn Sie immer noch abwägen, ob die Plattform selbst Sie absichert, lesen Sie Ist Shopify ADA-konform?. Im bekannten Fall Murphy v. Eyebobs verklagte ein blinder Kläger einen Shop, der ein Overlay im Einsatz hatte, und der Fall endete mit einem Vergleich. Die eigenen Nutzungsbedingungen der Overlay-Anbieter räumen oft ein, dass die Installation des Produkts allein nicht ausreicht, um den gesetzlichen Anforderungen zu genügen.

Das Fazit: Ein Overlay ist ein laufendes Abo, das Ihnen ein falsches Gefühl der Sicherheit vermittelt, während die eigentlichen Probleme und das rechtliche Risiko weiterhin bestehen bleiben.

Das Thema Datenschutz

Overlays verarbeiten oft Informationen darüber, wie Besucher mit deiner Website interagieren. Manche versuchen sogar aktiv zu erkennen, ob jemand spezielle Hilfstechnologien verwendet. Das wirft unweigerlich Fragen zum Datenschutz auf, denn die Nutzung solcher Hilfsmittel kann auf eine Behinderung hinweisen. Das Overlay Fact Sheet merkt diesen Punkt als eines der wiederkehrenden Bedenken der Branche an.¹

Was wirklich funktioniert: Behebe den Code

Jeder dauerhafte und funktionsfähige Accessibility-Fix beinhaltet eine Anpassung am zugrunde liegenden Theme-Code. Genau diesen Teil überspringen Overlays – obwohl nur dieser rechtlich wirklich verlässlich ist.

Das Modell, das wir empfehlen und auf dem wir auch Fudge aufgebaut haben, besteht aus drei Schritten:

1. Mache die Fehler sichtbar. Lass deinen Store scannen, um die echten Schwachstellen in deinem Theme zu finden – von schlecht lesbarem Text durch geringen Kontrast bis hin zu fehlenden Labels oder Alt-Texten. Den kompletten Ablauf findest du in unserem Guide zum Thema Shopify ADA- und WCAG-Compliance.
2. Behebe den Fehler im nativen Code. Repariere die Fehler direkt in deinem Liquid, CSS und JavaScript. So machst du die Seite selbst barrierefrei, ohne dass ein Skript den Fehler nur verdeckt. So würde auch ein professioneller Entwickler vorgehen – und genau das ist es, was Gerichte und Regulierungsbehörden anerkennen.
3. Behalte mögliche Regressionen im Auge. Accessibility ist keine einmalige Aufgabe, die du einfach abhaken kannst. Bei der nächsten Theme-Aktualisierung oder Inhaltsänderung kann sich schnell wieder ein Fehler einschleichen. Bleib also dran und behalte deinen Code im Blick.

Der Unterschied ist essenziell: Ein Overlay legt sich lediglich über fehlerhaftes HTML und generiert monatliche Kosten. Wenn du stattdessen den echten Code fixt, beseitigst du das Problem an der Wurzel, verbesserst die tatsächliche Experience für alle User, und die Fehler bleiben dauerhaft behoben.

So löst du dich von einem Overlay

Wenn du bereits eines nutzt, ist der Wechsel unkompliziert:

• Führe ein ehrliches Audit des Shops mit deaktiviertem Overlay durch. Nutze dafür ein kostenloses Tool wie axe DevTools oder WAVE sowie einen manuellen Test per Tastatur und Screenreader.
• Behebe die Probleme in deinem Theme-Code, beginnend mit den sechs häufigsten Fehlern: kontrastarmer Text, fehlender Alt-Text, fehlende Formular-Labels, leere Links, leere Buttons und eine fehlende Seitensprache.
• Entferne das Overlay-Skript und stelle sicher, dass sich nichts verschlechtert hat.
• Veröffentliche eine Erklärung zur Barrierefreiheit, in der du dein WCAG 2.2 AA-Ziel beschreibst und erklärst, wie man Probleme melden kann.

Fudge kann das Aufspüren der Fehler und die direkten Anpassungen im Code für dich übernehmen und im Anschluss das Monitoring fortsetzen – das ist derselbe Workflow, nur ohne die manuelle Entwicklungszeit. Du kannst an derselben Stelle auch verwandte Verbesserungen erledigen, wie z. B. das Bearbeiten bestehender Seiten und das Hinzufügen strukturierter Daten.

FAQ