Grafische Anforderungen für barrierefreie Online-Shops

14. Mai 2025

Barrierefreiheit Teil 1

Darüber schreiben wir

Ab dem 28. Juni 2025 wird das neue Barrierefreiheitsstärkungsgesetz (BFSG) verbindlich – und betrifft damit auch viele Online-Händler in Deutschland. Wer dann Produkte oder Dienstleistungen digital anbietet, muss sicherstellen, dass sein Webshop barrierefrei zugänglich ist.

Was das konkret bedeutet? In diesem ersten Teil unserer Blogreihe zeigen wir, welche grafischen Anforderungen für barrierefreie Webshops gelten, worauf Sie beim Design achten sollten – und was das alles mit Ihrem JTL-Shop zu tun hat.

Was bedeutet grafische Barrierefreiheit?

Barrierefreiheit heißt: Menschen mit Einschränkungen – sei es visuell, motorisch oder kognitiv – können Ihre Website problemlos nutzen. Und das beginnt beim Design.

Ein barrierefreier Online-Shop überzeugt nicht nur durch ästhetisch ansprechende Optik, sondern auch durch:

  • gute Lesbarkeit von Texten
  • kontrastreiche Farben
  • strukturierte Überschriften und Inhalte
  • sinnvolle Navigation
  • alternative Texte für Bilder

Gerade im E-Commerce macht das den Unterschied – und ist ab 2025 gesetzlich verpflichtend.

Gesetzliche Grundlage: Das BFSG im Überblick

Das Barrierefreiheitsstärkungsgesetz (BFSG) schreibt vor, dass alle Unternehmen mit digitalem Verkaufsangebot ihre Website oder ihren Webshop barrierefrei gestalten müssen. Ausgenommen sind lediglich reine B2B-Shops und Kleinstunternehmen (weniger als 10 Mitarbeitende und unter 2 Mio. EUR Jahresumsatz).

Für alle anderen gilt: Handlungsbedarf bis spätestens 28.06.2025.

1. Kontraste und Farbgestaltung

Farbe allein darf nie das einzige Merkmal sein, um wichtige Inhalte zu kennzeichnen. Wichtig sind:

  • Text-Kontrast von mindestens 4,5:1 (kleine Schrift) bzw. 3:1 (große/fette Schrift)
  • aktive Menüelemente müssen deutlich hervorgehoben sein (z. B. durch Unterstreichung oder Kontrast)
  • Fehlermeldungen in Formularen müssen gut sichtbar und lesbar sein

Tipp: Nutzen Sie Tools wie den WCAG Color Contrast Checker für eine erste Prüfung.

2. Typografie & Lesbarkeit

Barrierefreie Schriftgestaltung bedeutet:

  • klare, serifenlose Schriftarten (z. B. Arial, Roboto)
  • ausreichend großer Zeilenabstand
  • keine zu kleinen Schriftgrößen (mind. 16 px)
  • anpassbare Schriftgrößen (Zoomfähigkeit muss erhalten bleiben)

3. Alternative Texte für Bilder

Bilder sollten mit sogenannten Alt-Texten (alternativen Texten) beschrieben werden – und zwar so, dass auch Nutzer mit Screenreadern verstehen, was dargestellt wird.

Beispiel:
Statt: <img alt=“Winterjacke“ />
Besser: <img alt=“dicke, schwarze Winterjacke mit Kapuze von LOW LIGHTS STUDIOS“ />

4. Intuitive Navigation & Layout

Ein barrierefreies Shop-Design bietet eine klare, nachvollziehbare Seitenstruktur – mit:

  • einer einheitlichen Navigation
  • klar strukturierten Überschriften (H1–H6)
  • Sprungmarken zur schnellen Navigation für Screenreader
  • aussagekräftigen Links (nicht „hier klicken“, sondern „zum Produktvergleich“)

Barrierefreies Design für JTL-Shops: Worauf Sie achten sollten

Als zertifizierter JTL-Servicepartner kennen wir die Möglichkeiten und Grenzen der JTL-Shop-Templates genau. Die gute Nachricht: Mit den richtigen Anpassungen lassen sich viele Anforderungen des BFSG problemlos umsetzen:

  • Alt-Texte lassen sich in der JTL-Wawi pflegen und in den Shop übertragen
  • Farbkontraste und Schriftgrößen sind im Template anpassbar
  • Navigation und Semantik (Überschriftenstruktur) können in modernen Templates wie NOVA optimiert werden
  • Für die Darstellung von Fehlermeldungen in Formularen (z. B. Checkout) sind gezielte Template-Anpassungen sinnvoll

Unsere Empfehlung: Barrierefreiheit direkt beim Design- oder Relaunch-Prozess mitdenken – das spart später Zeit und Aufwand.

Fazit: Grafische Barrierefreiheit ist Pflicht – und Chance

Barrierefreies Design ist mehr als nur ein gesetzliches Muss: Es verbessert die User Experience für alle Nutzergruppen, steigert die Conversion und erhöht dank sauberer Strukturierung und Alt-Tags sogar die Sichtbarkeit bei Google.

Noch ist Zeit – aber ab Juni 2025 wird’s ernst. Sprechen Sie uns an, wenn Sie Ihren JTL-Shop zukunftssicher gestalten möchten!

Wir unterstützen Sie bei der Prüfung und Optimierung Ihres Online-Shops – vom ersten Check bis zur barrierefreien Umsetzung.

BSFG-Quickcheck-Formular

Kurzprüfung Ihres Online-Shops oder Webseite auf Barrierefreiheit. Tragen Sie sich bei Bedarf für einen Quickcheck ein und lassen Sie Ihren Shop/Webseite durch uns auf Barrierefreiheit prüfen.

Teile diesen Beitrag

Newsletter abonnieren

Wenn Sie den maßarbyte Newsletter abonnieren möchten, füllen Sie bitte das Formular aus.