dawnshopifybfsgthemebarrierefreiheit

Dawn und BFSG: was wirklich anzupassen ist, gemessen an Version 16.0.0

Das ausgelieferte Dawn besteht die Kontrastprüfungen, anders als in Ratgebern behauptet. Das Risiko beginnt, sobald Sie die Farben ändern: sieben abgeleitete Werte hängen an Ihrer Textfarbe. Mit Rechenwegen.

Von Radoslaw Fedorczuk4 Lesezeit (min)

Ratgeber zur Barrierefreiheit von Dawn beginnen meist mit einer Liste von Verstößen, die das Theme angeblich im Auslieferungszustand hat. Ich habe sie am Quelltext geprüft, an Version 16.0.0 vom 10. August 2026, und die meisten existieren nicht. Das ist die gute Nachricht. Sie führt zu einer unangenehmeren: das eigentliche Risiko liegt woanders und ist mit einer einfachen Prüfung nicht zu sehen.

Was das ausgelieferte Dawn richtig macht

Das Standard-Farbschema ist Text #121212 auf #FFFFFF (config/settings_data.json, Preset "Dawn", scheme-1). Damit ergibt sich:

Element Wert im CSS Kontrast auf Weiß Schwelle Ergebnis
Fließtext #121212 18,73:1 4,5:1 erfüllt
gedämpfter Text Alpha 0,75 8,45:1 4,5:1 erfüllt
Feldrahmen Alpha 0,55 4,12:1 3:1 erfüllt
Fokusrahmen Alpha 0,5 3,54:1 3:1 erfüllt

Das Newsletter-Feld im Footer (sections/footer.liquid) hat ein korrekt verknüpftes Label:

<label class="field__label" for="NewsletterForm--{{ section.id }}">
  {{ 'newsletter.label' | t }}
</label>

Ein Placeholder steht daneben, nicht anstelle. WCAG 3.3.2 ist erfüllt.

Die Variable --color-foreground-secondary, die in Ratgebern als Quelle eines 4,48:1-Verstoßes genannt wird, kommt in assets/base.css überhaupt nicht vor. Wer sie in seinem Theme sucht, wird sie nicht finden, weil es sie nicht gibt.

Wo das Risiko tatsächlich beginnt

Dawn speichert abgeleitete Farben nicht als eigene Werte, sondern als Alpha auf Ihrer Textfarbe: rgba(var(--color-foreground), 0.75) und so weiter, in acht verschiedenen Stufen. Ändern Sie im Theme-Editor die Textfarbe, verschieben sich alle diese Werte mit, und zwar nicht linear.

Ihre Textfarbe Fließtext gedämpft (0,75) Rahmen (0,55) Fokus (0,5)
#121212 (Standard) 18,73 8,45 4,12 3,54
#333333 12,63 5,74 3,23 2,85
#595959 7,00 3,84 2,49 2,27
#767676 4,54 2,88 2,07 1,94
#808080 3,95 2,61 1,96 1,82

Fett markiert ist alles unterhalb der Schwelle: 4,5:1 für Text (WCAG 1.4.3), 3:1 für nicht-textuelle Elemente und den Fokusindikator (1.4.11 und 2.4.11).

Beachten Sie die Zeile #767676. Der Fließtext erreicht 4,54:1 und besteht. Ein Kontrastrechner, in den Sie Textfarbe und Hintergrund eintragen, meldet "in Ordnung". Gleichzeitig liegen gedämpfter Text, Feldrahmen und Fokusrahmen bereits darunter. Sie bekommen grünes Licht für einen Wert und erfahren nichts von drei weiteren, die Sie gerade gebrochen haben.

Schon bei #333333, einer Farbe, die viele für "fast schwarz" halten, fällt der Fokusindikator auf 2,85:1 und erfüllt WCAG 2.4.11 nicht mehr.

Rechtlicher Rahmen, kurz und richtig

Das BFSG gilt seit dem 28. Juni 2025. Für Dienstleistungen gilt die Ausnahme aus § 3 BFSG: "Absatz 1 gilt nicht für Kleinstunternehmen, die Dienstleistungen anbieten oder erbringen."

Die Informationspflicht folgt aus § 14 BFSG in Verbindung mit Anlage 3 BFSG, nicht aus § 14 BFSGV. Der Paragraf der Verordnung heißt "Zusätzliche Anforderungen Telekommunikationsdienstleister" und betrifft Shops nicht. Anlage 3 nennt vier Angaben (Buchstaben a bis d), nicht sechs oder sieben:

  • a) allgemeine Beschreibung der Dienstleistung in barrierefreiem Format
  • b) Beschreibungen und Erläuterungen zum Verständnis der Durchführung
  • c) Darstellung, wie die Dienstleistung die Barrierefreiheitsanforderungen erfüllt
  • d) Angabe der zuständigen Marktüberwachungsbehörde

Zuständig ist seit dem 26. September 2025 die Marktüberwachungsstelle der Länder für die Barrierefreiheit von Produkten und Dienstleistungen (MLBF) in Magdeburg, eine gemeinsame Stelle aller 16 Bundesländer.

Bußgelder regelt § 37 BFSG in zwei Stufen: bis zu 100 000 Euro für die schweren Fälle, darunter das Anbieten einer nicht konformen Dienstleistung, und bis zu 10 000 Euro für die übrigen Verstöße, darunter fehlende oder nicht bereitgestellte Informationen. Die zweite Stufe wird beim Zitieren gern weggelassen.

Für wirtschaftliche Unzumutbarkeit gilt § 17 BFSG, und die Abwägung ist zu dokumentieren.

Was praktisch folgt

  1. Prüfen Sie nicht die Farbe, prüfen Sie die Seite. Ein Kontrastrechner auf zwei Hex-Werten sieht die abgeleiteten Werte nicht.
  2. Eine Palettenänderung ist eine Änderung der Barrierefreiheit. Nach jedem Eingriff im Theme-Editor lohnt ein erneuter Scan.
  3. Der Fokusindikator bricht zuerst. Er hat mit 0,5 Alpha auf einer 3:1-Schwelle die geringste Reserve und ist zugleich das, was Tastaturnutzer am dringendsten brauchen. WCAG 2.4.11 ist neu in WCAG 2.2 und fehlt in vielen Ratgebern noch ganz.

Was dieser Artikel nicht behauptet

Nicht, dass Dawn barrierefrei sei. Nur, dass die vier geprüften Stellen im Auslieferungszustand die Schwellen einhalten und die kursierenden Gegenbehauptungen sich genau auf diese Stellen beziehen. Die Barrierefreiheit Ihres Shops hängt an Ihren Inhalten, Ihren Apps und Ihren Änderungen.

Ich nenne auch bewusst keine Zahl "durchschnittlich X Verstöße pro Produktseite". Diese Zahl hängt vom Inhalt ab, nicht vom Theme, und wäre als Theme-Eigenschaft ausgedacht.

Selbst nachrechnen

  1. Lesen Sie im Theme-Editor Ihre Text- und Hintergrundfarbe ab (Einstellungen > Farben).
  2. Berechnen Sie den Kontrast für den vollen Wert sowie für 0,75, 0,55 und 0,5 Alpha auf demselben Hintergrund.
  3. Vergleichen Sie mit 4,5:1 und 3:1.

Automatisch macht das ein Scan von AccessifyAI, der die gerenderte Seite prüft und die tatsächlichen Farbpaare meldet statt der eingestellten Werte. Eintrag im Shopify App Store.

Quellen

  • Shopify Dawn, Version 16.0.0 (veröffentlicht am 10. August 2026): github.com/Shopify/dawn, Dateien assets/base.css und config/settings_data.json
  • BFSG, insbesondere § 3, § 14, § 17, § 37 und Anlage 3: gesetze-im-internet.de/bfsg
  • WCAG 2.2, Erfolgskriterien 1.4.3, 1.4.11, 2.4.11, 3.3.2
Teilen:

Tipps zur Barrierefreiheit per E-Mail

Eine kurze E-Mail pro Monat mit neuen Leitfäden und Shopify-Updates zur Barrierefreiheit. Kein Spam, jederzeit abbestellbar.

Dawn und BFSG: was wirklich anzupassen ist, gemessen an Version 16.0.0 | AccessifyAI