Barrierefreiheitsstärkungsgesetz (BFSG) tritt für Onlineshops im Juni in Kraft
Am 28. Juni 2025 tritt das Barrierefreiheitsstärkungsgesetz (BFSG) in Kraft. Mit diesem Gesetz sollen digitale Angebote für alle Menschen zugänglich gemacht werden, insbesondere für Menschen mit Behinderungen. Betreiber von Onlineshops, Webseiten und Online-Diensten stehen nun in der Pflicht, ihre Inhalte barrierefrei zu gestalten. Doch was bedeutet Barrierefreiheit im Web genau, und welche Anforderungen müssen erfüllt werden?
Wann ist ein Onlineshop barrierefrei?
Ein Onlineshop gilt als barrierefrei, wenn sie für alle Nutzerinnen uneingeschränkt zugänglich und bedienbar ist, unabhängig von körperlichen oder kognitiven Einschränkungen. Dies bedeutet, dass Nutzerinnen mit Sehbehinderungen, motorischen Einschränkungen oder kognitiven Beeinträchtigungen Onlineshops ohne Hürden nutzen können. Technische Standards wie die Web Content Accessibility Guidelines (WCAG) dienen als Grundlage für eine barrierefreie Gestaltung.
Welche Vorteile bietet ein barrierefreier Onlineshop?
Ein barrierefreier Onlineshop bietet zahlreiche Vorteile, die über die reine Zugänglichkeit für Menschen mit Behinderungen hinausgehen. Sie verbessert die Nutzererfahrung für alle und sorgt für eine bessere Bedienbarkeit auf Mobilgeräten. Durch eine klare Struktur, optimierte Navigation und gut lesbare Inhalte profitieren auch ältere Menschen oder Nutzer*innen mit temporären Einschränkungen. Darüber hinaus hat Barrierefreiheit positive Auswirkungen auf die Suchmaschinenoptimierung (SEO). Suchmaschinen bewerten klare, gut strukturierte und zugängliche Webseiten besser, was zu einer höheren Sichtbarkeit in den Suchergebnissen führt. Unternehmen und Organisationen, die auf Barrierefreiheit setzen, erreichen somit nicht nur eine größere Zielgruppe, sondern stärken auch ihre digitale Präsenz.
Anforderungen an einen barrierefreien Onlineshop
Um einen Onlineshop barrierefrei zu gestalten, haben wir einmal folgende Anforderungen für Sie zusammengestellt, die mind. erfüllt sein sollten:
- Die Sprache der Webseite sollte im HTML-Code definiert werden: <html lang="de">.
- Zitate sollten mit <blockquote> oder <cite>-Elementen ausgezeichnet werden.
- Formularfelder müssen mit <label> beschriftet sein, damit sie von Screenreadern erkannt werden.
- Die Webseite sollte mit der Tabulatortaste bedienbar sein.
- Elemente im Fokus-Zustand sollten visuell hervorgehoben werden, wenn sie mit der Tastatur angesteuert werden.
- Jedes Element muss mit der Tastatur angesteuert und verlassen werden können.
- Akronyme und Abkürzungen sollten besonders definiert sein.
- Jede Seite sollte eine Meta-Beschreibung enthalten.
- Inhalte müssen um 200% vergrößert werden können, ohne die Funktionalität zu beeinträchtigen.
- Videos sollten mit Untertiteln versehen sein.
- Visuelle Elemente in Videos sollten durch Audiodeskriptionen oder Textbeschreibungen erläutert werden.
- Bedienelemente sollten ein Kontrastverhältnis von mindestens 3:1 haben.
- Text zu Hintergrund muss ein Kontrastverhältnis von mindestens 7:1 aufweisen.
- Überschriften (ab 18 pt.) benötigen ein Kontrastverhältnis von mindestens 4,5:1.
- Links sollten unterstrichen werden.
- Downloads sollten mit einem entsprechenden Dokument-Icon gekennzeichnet sein.
- Externe Links sollten mit einem Icon für externe Links versehen sein.
- Pflichtfelder in Formularen sollten mit einem Sternchen (*) markiert werden.
- Validierungsfehler in Formularen müssen textlich erklärt werden.
- Aktive Menüeinträge sollten visuell hervorgehoben werden, z. B. durch Unterstreichung oder Fettdruck (Farbliche Kennzeichnung allein reicht nicht aus).
- Links sollten eindeutig beschriftet sein (keine generischen Begriffe wie "hier" verwenden).
- Grafik-Buttons, wie z. B. eine Lupe bei einer Suchfunktion, benötigen einen Alt-Text.
- Focus-Elemente sollten visuell mit einer Umrandung gekennzeichnet werden.
- Seitentitel sollten zweiteilig sein: "NAME DER UNTERSEITE - NAME DER WEBSEITE".
- Tabellen müssen für mobile Darstellungen optimiert sein.
- Tabellen sollten die Strukturierungselemente <thead>, <tbody> und <th> enthalten.
- Grafiken sollten stets mit einem Alt-Attribut versehen sein.
Barrierefreiheit jetzt prüfen
Machen Sie jetzt kostenlos einen Barrierefreiheitscheck Ihres Onlineshops und erfahren Sie, ob Sie alle Anforderungen erfüllen.