Shopify barrierefrei: Theme, Apps und Checkout prüfen

Dieser Beitrag zeigt, was Shopify nach eigenen Angaben liefert und was nicht, wie Theme, Apps, Checkout und Inhalte zusammenspielen und welche Prüfungen im Shop sinnvoll sind. Grundlage sind die Dokumentation von Shopify und die Vorgaben des Barrierefreiheitsstärkungsgesetzes (BFSG). Recherchestand ist der 23. Oktober 2026.

Macht die Plattform den Shopify-Shop schon barrierefrei?

Nein. Shopify beschreibt in seiner Barrierefreiheitserklärung (Stand 7. Juli 2025), dass WCAG 2.2 das Leitprinzip für die eigenen Produkte ist und diese auf Level AA getestet werden. Zugleich heißt es dort, dass Händler die volle Kontrolle über den Code ihrer Themes haben. Für den Checkout veröffentlicht Shopify einen Konformitätsbericht nach WCAG 2.2 A und AA, für das Standard-Theme Dawn einen nach WCAG 2.1 A und AA.

Rechtlich betreibt der Händler eine Dienstleistung im elektronischen Geschäftsverkehr. Nach § 19 der Verordnung zum BFSG müssen bei solchen Dienstleistungen unter anderem Identifizierungs-, Authentifizierungs-, Sicherheits- und Zahlungsfunktionen wahrnehmbar, bedienbar, verständlich und robust gestaltet sein. Der Wortlaut knüpft an die Funktion im Shop an und nicht an das System, das sie technisch liefert. Wie Behörden die Verantwortung zwischen Shop-Betreiber und Plattform im Einzelfall gewichten, ist nicht geklärt.

Vier Ebenen: Theme, Apps, Checkout und Inhalte

Ein Shopify-Shop besteht aus Teilen mit unterschiedlicher Herkunft. Die Tabelle zeigt, was Shopify dokumentiert und was beim Händler bleibt. Sie fasst die Shopify-Dokumentation zusammen und ergänzt unsere Einschätzung.

Was Shopify-Themes leisten und was offenbleibt

Ein Theme aus dem Theme Store erfüllt Mindestanforderungen, ist aber kein Konformitätsnachweis. Nach den Theme-Store-Anforderungen von Shopify muss ein Theme im Durchschnitt über Startseite, Produktseite und Kollektionsseite, jeweils auf Desktop und Mobilgerät, einen Lighthouse-Wert für Barrierefreiheit von mindestens 90 erreichen. Zusätzlich verlangt Shopify unter anderem Bedienbarkeit aller Seitenbereiche per Tastatur, sichtbaren Fokus, ein Alt-Attribut für Bilder, Beschriftungen für Formularfelder, gültiges HTML, ein Kontrastverhältnis von 4,5 zu 1 für Fließtext und eine Zielgröße von mindestens 24 mal 24 CSS-Pixeln. Mehr zu den Grundlagen finden Sie im Lexikon zur Tastaturbedienbarkeit und zum Kontrastverhältnis.

Shopify relativiert diese Vorgaben selbst. Die Best Practices für Themes wurden mit Blick auf WCAG 2.1 erstellt, und ihre Einhaltung garantiert laut Shopify keine vollständige Barrierefreiheit. Die Best-Practice-Seite empfiehlt für primäre Bedienelemente sogar 44 mal 44 Pixel, das Minimum im Theme Store liegt bei 24 mal 24 CSS-Pixeln. Der Konformitätsbericht zu Dawn führt mehrere Kriterien als teilweise unterstützt auf, darunter den Farbkontrast, die Tastaturführung bei dynamischen Änderungen der Oberfläche und die Fehlererkennung im Adressformular des Kundenkontos. Der Bericht deckt WCAG 2.1 ab und enthält keine Kriterien aus WCAG 2.2. Als Berichtsdatum nennt die Seite November 2021, die Barrierefreiheitserklärung ordnet den Bericht der Dawn-Version 2.4.0 zu. Wie aktuell er ist, lässt sich daher nicht abschließend beurteilen.

Nach unserer Einschätzung ist das der Kern des Problems: Die gelesene Liste der Theme-Store-Anforderungen nennt die Zielgröße aus WCAG 2.2, erwähnt die übrigen neuen Kriterien wie nicht verdeckten Fokus oder redundante Eingaben aber nicht ausdrücklich. Ein Lighthouse-Wert ist außerdem ein automatischer Test einzelner Seiten. Abläufe wie der Weg von der Produktseite bis zur Bestellung erfasst er nicht.

Warum Anpassungen das Ergebnis verändern

Shopify betont, dass Händler die volle Kontrolle über den Code ihres Themes haben. Das ist ein Vorteil und ein Risiko zugleich. Ein Szenario: Ein Händler ändert die Markenfarbe der Schaltflächen, und der Text auf dem Button erreicht das geforderte Kontrastverhältnis von 4,5 zu 1 nicht mehr. Ein weiteres Szenario: Eine Kampagnenseite wird mit Sektionen gebaut, die Überschriften nur nach dem Aussehen statt nach der Struktur wählen. Beides steht im Widerspruch zu den Anforderungen, die Shopify selbst für Themes formuliert, und beides fällt in einem Test des Auslieferungszustands nicht auf.

Fünf Fragen vor der Theme-Wahl

Wer Shopify barrierefrei aufsetzen möchte, sollte Themes und Anbieter gezielt befragen. Unsere Empfehlung:

• ✓ Konformitätsbericht: Gibt es einen Bericht für die aktuelle Version? Shopify veröffentlicht einen für Dawn, das lässt sich auch von anderen Anbietern erwarten.
• ✓ WCAG-Version: Bezieht sich der Bericht auf WCAG 2.1 oder auf WCAG 2.2?
• ✓ Dialoge und Menüs: Wandert der Fokus in Warenkorb-Schublade und Pop-ups, und lassen sie sich mit der Escape-Taste schließen? Shopify nennt beides als Anforderung.
• ✓ Feste Elemente: Wie stellt das Theme sicher, dass fixierte Kopfzeilen den Fokus nicht verdecken?
• ✓ Updates: Wie werden Theme-Updates ausgeliefert, und welche eigenen Anpassungen gehen dabei verloren oder müssen erneut geprüft werden?

Apps: die häufigste Lücke im Shopify-Shop

Jede App, die im Shop Oberfläche einblendet, wird Teil Ihrer Dienstleistung und sollte geprüft werden. Die Entwicklerdokumentation von Shopify für Apps nennt Best Practices zu Tastatur, Fokus und Seitenstruktur und weist ausdrücklich darauf hin, dass ihre Einhaltung keine vollständige Barrierefreiheit garantiert. Eine Prüfung durch Shopify, die jede App im Zusammenspiel mit Ihrem Theme abdeckt, geht aus der gelesenen Dokumentation nicht hervor. Hilfreich ist ein einfaches Inventar: Name der App, Zweck, Sichtbarkeit im Online-Shop, Datum der letzten Prüfung und ein fester Ansprechpartner im Team oder bei der Agentur.

Dass Drittanbieter auch im Checkout eine Rolle spielen, zeigt Shopify selbst: Im Konformitätsbericht (März 2026) heißt es, dass Steuerelemente von Zahlungsanbietern wie PayPal oder Amazon Pay Barrieren erzeugen können. Typische Szenarien aus dem Online-Handel sind erkennbar an folgenden Stellen. Die Beispiele sind Szenarien und keine Fallberichte:

• ✓ Cookie-Banner und Chat: Ein fest eingeblendetes Banner oder Chat-Widget verdeckt beim Durchtabben das fokussierte Element.
• ✓ Pop-ups und Newsletter-Overlays: Der Fokus wandert nicht in das Fenster, und es lässt sich nicht per Escape-Taste schließen. Shopify nennt beides für Themes als Anforderung an Dialoge.
• ✓ Bewertungen und Filter: Sterne, Schieberegler oder Auswahlfelder sind nur mit der Maus bedienbar.
• ✓ Zahlungsarten: Eine Schaltfläche eines Zahlungsanbieters hat keinen verständlichen Namen für Screenreader.

Ein nachträgliches Barrierefreiheits-Widget ersetzt die Behebung solcher Fehler nicht. Mehr zu den Grenzen solcher Lösungen lesen Sie in unserem Beitrag Overlays und das Abmahnrisiko.

Checkout: Was Shopify belegt und wo Lücken bleiben

Der Checkout ist der Bereich, für den Shopify die meisten Angaben macht. Im Konformitätsbericht vom März 2026 stuft Shopify die neuen WCAG-2.2-Kriterien nicht verdeckter Fokus, konsistente Hilfe, redundante Eingaben und barrierefreie Anmeldung als unterstützt ein. Ziehbewegungen gibt es im Checkout laut Bericht nicht. Bei der Zielgröße führt Shopify eine Teilkonformität auf, weil einige Tooltip-Aktivatoren kleine Zielflächen haben.

Weitere Teilkonformitäten betreffen Fehlermeldungen, die nicht sofort wahrnehmbar sind, Steuerelemente von Zahlungsanbietern, die Barrieren erzeugen können, und Statusmeldungen. Shopify vermerkt, dass die Behebung laufe und Usability-Tests quartalsweise stattfinden. Der Bericht ist eine Herstellerangabe und kein unabhängiges Prüfzeugnis.

Nach unserer Einschätzung lässt sich der Checkout weniger frei verändern als das Theme. Für Händler liegt der Schwerpunkt deshalb auf der Konfiguration: Welche Zahlungsarten bieten Sie an, wie funktionieren sie im Durchlauf mit Tastatur und Screenreader, und stehen Hilfe-Links und Texte rund um die Bestellung verständlich bereit? Konkret hilft ein Probekauf: Spielen Sie jede Zahlungsart mit Tastatur, mit einem Screenreader und bei 200 Prozent Zoom durch, und lösen Sie gezielt Fehlermeldungen aus, etwa durch eine unvollständige Adresse. So zeigt sich, ob Hinweise rechtzeitig erscheinen und verständlich sind. Welche Fehler besonders teuer werden können, beschreibt unser Beitrag Die teuersten Barrieren-Fehler und ihre Prioritäten.

So prüfen Sie Ihren Shop Schritt für Schritt

Wer Shopify barrierefrei prüfen will, braucht keinen Neustart, sondern einen festen Ablauf. Die folgende Reihenfolge ist unsere Empfehlung:

• ✓ Theme-Basis klären: Welches Theme in welcher Version ist im Einsatz, und wie stark wurde es angepasst? Die Theme-Store-Anforderungen sind eine Untergrenze, kein Nachweis.
• ✓ Tastaturdurchlauf: Gehen Sie von der Startseite über Produktseite und Warenkorb bis zur Bestellbestätigung nur mit der Tastatur. Der Fokus muss sichtbar sein und darf nicht verdeckt werden.
• ✓ Apps einzeln prüfen: Führen Sie eine Liste aller Apps mit Sichtbarkeit im Shop und prüfen Sie nach jeder Installation und jedem Update erneut.
• ✓ Zahlungsarten testen: § 19 der Verordnung zum BFSG nennt Zahlungsfunktionen ausdrücklich. Prüfen Sie jede angebotene Zahlungsart im Durchlauf.
• ✓ Inhalte pflegen: Das Theme gibt das Alt-Attribut aus, die Texte schreiben Sie. Grundlagen zum Alternativtext und praktische Hinweise finden Sie im Beitrag Alt-Texte für SEO und Barrierefreiheit.
• ✓ Informationen aktuell halten: Die Barrierefreiheitserklärung sollte den tatsächlichen Prüfstand und das Prüfdatum widerspiegeln.

SiteCockpit: Barrierefreiheit im Shopify-Shop dauerhaft im Blick

Ein Shopify-Shop verändert sich ständig. Jedes Theme-Update, jede neue App und jede Kampagnenseite kann Anforderungen wieder verletzen. Barrierefreiheit ist deshalb kein einmaliges Projekt, sondern ein Prozess aus Prüfen, Beheben und erneutem Prüfen. Wer Shopify barrierefrei halten will, braucht einen Überblick über alle Änderungen und eine Prüfung, die nach jeder Änderung läuft.

• ✓ easyMonitoring: überwacht Ihren Shop laufend, findet Fehler wie unsichtbaren Tastaturfokus, schwache Kontraste oder fehlende Formularbeschriftungen und liefert priorisierte To-dos.
• ✓ easyAlt: erzeugt Alt-Texte für Produktbilder automatisch und entlastet die Pflege großer Sortimente.
• ✓ easyVision: lässt Besucher Kontrast, Zeilenabstand oder Schrift selbst anpassen. Es ergänzt die Behebung von Barrieren und ersetzt sie nicht. Laut der Shopify-Integrationsseite lässt sich das Widget per Einbettungscode im Theme einbinden, etwa über einen Custom-Liquid-Abschnitt.
• ✓ easyStatement: erstellt eine aktuelle Barrierefreiheitserklärung auf Basis realer Prüfergebnisse.

Ein Dashboard mit Konformitäts-Scores macht sichtbar, ob sich der Stand Ihres Shops nach Änderungen verbessert oder verschlechtert. Eine rechtliche Konformitätsaussage ersetzt es nicht. Wie die Marktüberwachung Online-Shops aktuell prüft, fasst die Zwischenbilanz zur BFSG-Marktüberwachung zusammen.

Was jetzt sinnvoll ist

Shopify bietet eine solide Grundlage und legt für Theme Store, Checkout und Entwicklerdokumentation eigene Anforderungen offen. Die Verantwortung für den konkreten Shop bleibt beim Händler, und die Berichte von Shopify sind Herstellerangaben mit dokumentierten Lücken. Kein Anlass zur Hektik, aber realer Handlungsbedarf bei Apps, Zahlungsarten und Inhalten.

• ✓ Stand feststellen: Starten Sie mit dem Livecheck und einem Tastaturdurchlauf bis zur Bestellung.
• ✓ Häufigste Fehler beheben: Beginnen Sie mit Apps, die Fokus verdecken oder sich nicht per Tastatur bedienen lassen, mit Zahlungsarten und mit fehlenden Alt-Texten.
• ✓ Dauerhaft im Blick behalten: Prüfen Sie nach jedem Theme-Update und jeder neuen App erneut und halten Sie Ihre Informationen zur Barrierefreiheit aktuell.

Gehen Sie schrittweise vor, denn Barrierefreiheit im Online-Shop entsteht Schritt für Schritt. Mit easyMonitoring behalten Sie den Stand Ihres Shops nach jeder Änderung im Blick, ohne jede Prüfung neu aufsetzen zu müssen.

Hinweis: Dieser Beitrag informiert allgemein über die Rechtslage (Stand 23.10.2026) und ersetzt keine individuelle Rechtsberatung.