Autor: Marcel Rösel

Barrierefreiheit im Webshop umsetzen

Personal | Recht & Soziales | Sichtbarkeit & Marketing
Ab dem 28.06.2025 tritt das Barrierefreiheitsgesetz in Kraft und Onlineshops müssen dann neue Standards erfüllen. Einige Plugins versprechen, das Problem ohne großen Aufwand zu lösen. Aber funktioniert das wirklich?
Infos zum Thema auf einen Blick:
  • Das Barrierefreiheitsstärkungsgesetz muss auch auf Webshops angewendet werden.
  • Bereits verfügbare Plugins können helfen, erfüllen jedoch nicht alle Anforderungen.
  • Eine saubere SEO-Praxis deckt bereits viele Anforderungen ab.
  • Die Erfüllung aller Anforderungen ist umfangreich.
  • Es ist besser, viele kleinere Anpassungen vorzunehmen, als eine große Umstellung.
Beispiel: So könnte ein Barrierefreier Shop aussehen
Beispiel: So könnte ein Barrierefreier Shop aussehen

In Deutschland wurden ca. 7,8 Millionen Personen offiziell als schwerbehindert eingestuft. Beinahe 10 % der deutschen Bevölkerung fallen somit in diese Gruppe. Zusätzlich betrifft das Bedürfnis nach Barrierefreiheit viele ältere Menschen, auch ohne Behinderung. Im Umkehrschluss bedeutet das: Wessen Onlineshop nicht barrierefrei ist, der büßt eine Menge potenzieller Kundinnen und Kunden ein. Hinzukommen gesetzliche Vorgaben, die die Barrierefreiheit verpflichtend machen. Wir beantworten, wer alles die Richtlinien umsetzen muss, ob es eine einfache technische Lösung gibt und was man jetzt tun sollte, lesen Sie hier.

Betroffene Zielgruppe

  • In Deutschland leben über 13 Millionen Bürgerinnen und Bürger, die älter als 70 Jahre sind.
  • Etwa 349.000 Menschen haben eine Sehbehinderung.
  • Etwa 4,5 Millionen Deutsche haben eine körperliche Behinderung.
  • Etwa 3,5 Millionen Deutsche haben im Erwachsenenalter eine Lese- und/oder Rechtschreibschwäche.

Barrierefreiheitsstärkungsgesetz ab dem 28.06.2025

Es gibt verschiedene Gesetze, die sich um das Thema Barrierefreiheit drehen, doch für Händlerinnen und Händler ist Für Online-Händler wird das Barrierefreiheitsstärkungsgesetz (BFSG) wichtig werden. Das Gesetz ist ab dem 28.06.2025 anzuwenden. Die im BFSG genannten Produkte und Dienstleistungen müssen ab diesem Zeitpunkt barrierefrei sein, wobei eine Umsetzungsfrist von 5 Jahren zugestanden wird – ansonsten drohen Klagen. Das Bundesministerium für Arbeit und Soziales hat Leitlinien für die Anwendung des Barrierefreiheitsstärkungsgesetzes erstellt, die eine Hilfestellung zu den genauen Inhalten des Gesetzes darstellen soll.

Ausgenommen sind Kleinunternehmen, die Dienstleistungen anbieten und weniger als zehn Beschäftigte sowie höchstens 2 Millionen Euro Jahresumsatz haben. Wenn Kleinunternehmen aber Produkte vertreiben, trifft das BFSG auch auf sie zu.

Beispiel für ein Accessibility-Plugin

Accessibility-Plugins und Accessibility-Overlays

Die neuen Gesetze zur Barrierefreiheit stellen eine wichtige Entwicklung dar, die dafür sorgt, dass das Internet für alle Menschen zugänglicher wird. Es ist jedoch ein verbreiteter Irrtum zu glauben, dass die Anforderungen an die Barrierefreiheit allein durch die Integration von Accessibility-Widgets, -Overlays oder -Toolbars erfüllt werden können. Während diese Tools zweifellos hilfreich sein können, um bestimmte Aspekte der Barrierefreiheit zu verbessern, reichen sie allein nicht aus, um die umfassenden Anforderungen der Barrierefreiheitsgesetze in Deutschland vollständig zu erfüllen.

Grenzen von Widgets und Plugins

  • Gebärdensprachvideos und Inhalte in Leichter Sprache
  •  Erklärung zur Barrierefreiheit mit Feedbackmechanismus
  • Barrierefreie PDF-Dokumente
  • Untertitel und Transskripte für Videos
  • Sinnvolle Alternativtexte für Bilder und angemessene Textkontraste

Für Kleinstunternehmen bietet die Bundesfachstelle Barrierefreiheit gemäß § 15 BFSG eine (kostenlose) Beratung zum Barrierefreiheitsstärkungsgesetz an.

Barrierefreiheit-Checkliste für Ihre Website oder Webshop

Inhalt

  • Einfache Sprache verwenden
  • Klar beschreibende Texte für Buttons und Links

Überschriften

  • Überschriftenelemente für Inhalt
  • Nur ein h1-Element pro Seite
  • Logische Reihenfolge der Überschriften
  • Keine Überschriftenebenen überspringen

Globaler Code

  • HTML-Syntax validieren
  • Lang-Attribut im HTML-Tag verwenden
  • Jede Seite hat einen eindeutigen Titel
  • Zoom des Ansichtsfensters nicht deaktiviert
  • Wichtige Inhaltsbereiche kennzeichnen
  • Autofokus-Attribut vermeiden
  • Sitzungszeitüberschreitungen verlängerbar
  • Keine Title-Attribute verwenden

Bilder

  • Alt-Attribute für img-Elemente
  • Dekorative Bilder ohne Alt-Attribute
  • Textalternativen für komplexe Bilder
  • Alternativtexte für Text-Grafiken

Erscheinungsbild

  • Lesbarkeit bei speziellen Farbeinstellungen
  • Vergrößerung von Text bis 200% möglich
  • Zusammengehörige Inhalte nah beieinander
  • Informationen nicht nur durch Farbe vermitteln
  • Einfaches, geradliniges und konsistentes Layout

Listen

  • Verwendung von Listen-Tags

Tabellen

  • table-Element für tabellarische Daten
  • th-Element für Tabellenüberschriften
  • caption-Element für Tabellentitel

Steuerelemente:

  • a-Element für Links
  • Erkennbarkeit von Links
  • :focus-Status für Steuerelemente
  • button-Element für Schaltflächen
  • Skip-Link vorhanden
  • Kennzeichnung von Links in neuen Fenstern/Tabs

Formulare:

  • label-Elemente für Eingabefelder
  • fieldset und legend wo angebracht
  • Automatische Vervollständigung
  • Fehlermeldungen über dem Formular
  • Verknüpfung von Fehlermeldungen mit Eingaben
  • Fehler, Warnungen und Erfolge nicht nur durch Farbe

Medien

  • Automatische Wiedergabe von Medien vermeiden
  • Angemessenes Markup für Medienkontrollen
  • Möglichkeit zum Anhalten von Medien

Audio

  • Textalternative für Audioinhalte

Farbkontraste

  • Ausreichender Kontrast für Überschriften und große Texte

Animationen

  • Dezente und nicht zu stark blinkende Animationen
  • Möglichkeit zum Anhalten von Animationen
  • Beachtung der Medienabfrage prefers-reduced-motion

Mobile und Touch

  • Drehung der Seite in jede Richtung möglich
  • Einfache Aktivierung von Schaltflächen und Links
  • Ausreichender Platz zwischen interaktiven Elementen


Hinweis

Diese Checkliste ist eine Zusammenfassung und erhebt keinen Anspruch auf Vollständigkeit. Für eine vollständige Prüfung der Barrierefreiheit Ihrer Website oder des Shops sollten Sie weiterführende Ressourcen und Tests nutzen.

Fazit

Die Einführung des Barrierefreiheitsgesetzes stellt Händlerinnen und Händler vor Herausforderungen, die an die Einführung der Datenschutzgrundverordnung (DSGVO) erinnern. Ich empfehle daher, sich rechtzeitig vorzubereiten und schrittweise Anpassungen vorzunehmen. Leider gibt es für die hohen gesetzlichen Anforderungen keine Plug-and-Play-Lösung, so dass strukturelle Änderungen in den Shops und Websites der Handelsunternehmen vorgenommen werden müssen.

Zwei Aspekte möchte ich besonders hervorheben. Zum einen ist Inklusion immer auch eine Frage der Zielgruppenbetrachtung. Allein die große Zahl der Betroffenen könnte ein Anreiz sein, in Barrierefreiheit zu investieren. Zweitens lesen sich einige der Anforderungen an Barrierefreiheit wie eine Checkliste für gute SEO-Praktiken.

Ihr Ansprechpartner

Marcel Rösel
Projektleiter handel.digital
Ähnliche Veranstaltungen
Weiterlesen in Nachrichten
Weiterlesen im Wissenshub
Daten­schutz­ein­stel­lun­gen

Diese Webseite nutzt externe Medien, wie z.B. Karten, Videos, Podcasts Buchhungsformulare und Social Media Posts, sowie externe Analysewerkzeuge, welche alle dazu genutzt werden können, Daten über Ihr Verhalten zu sammeln. Dabei werden auch Cookies gesetzt. Die Einwilligung zur Nutzung der Cookies & Erweiterungen können Sie jederzeit anpassen bzw. widerrufen.
Eine Übersicht zu den Cookies, Analysewerkzeugen und externen Medien finden Sie in unserer Datenschutzhinweisen.

Welche Cookies bzw. Erweiterungen möchten Sie erlauben?