Barrierefreie Web- und App Gestaltung – die rechtskonforme Umsetzung des BFSG in der Praxis
In unserem ersten Beitrag zum Barrierefreiheitsstärkungsgesetz (BFSG) haben wir bereits die rechtlichen Grundlagen, Fristen und strategischen Anforderungen für Online-Shops beleuchtet. Da das Gesetz nun verpflichtend gilt, rückt für viele Betreiber die praktische und technische Umsetzung in den Fokus. Es reicht nicht mehr aus, das Thema nur rechtlich einzuordnen. Websites und Apps müssen auf Code- und Designebene entsprechend angepasst werden.
In diesem ergänzenden Beitrag werfen wir einen detaillierten Blick auf die technische Integration: Wie gelingt eine Barrierefreiheit bei der Softwareentwicklung und worauf müssen Entwickler, Designer und Projektmanager bei der Umsetzung der WCAG-Richtlinien achten?
Technische Gestaltung nach WCAG und EN 301 549
Die technische Umsetzung des BFSG orientiert sich in der Praxis an zwei zentralen Referenzen:
- EN 301 549 – die harmonisierte Norm, die IT Produkte und Dienstleistungen auf Barrierefreiheit prüft,
- WCAG 2.1 (Level AA) – die Leitlinien für barrierefreie Webinhalte, die als technische Grundlage für EN 301 549 dienen.
Eine Website oder App, die den WCAG Kriterien folgt, erfüllt damit bereits einen wesentlichen Teil der Anforderungen. Dazu gehören etwa:
- ausreichende Kontrastverhältnisse von Text zur Hintergrundfarbe,
- eindeutige und logische Überschriftenhierarchien,
- sinnvolle Alternativtexte für nicht textliche Inhalte,
- vollständige Tastaturnavigation und klare Fokus-Zustände,
- klare und verständliche Navigation, Formulare und Fehlermeldungen.
Wie gelingt Barrierefreiheit im Mobile Retail und auf Code-Ebene?
Diese grundlegenden Anforderungen an die Barrierefreiheit müssen gerade mobil im digitalen Retail konsequent umgesetzt werden, um allen Verbrauchern ein reibungsloses Kauferlebnis auf dem Smartphone zu bieten.
Auch die Struktur des Codes spielt eine Rolle. Natives HTML5, sinnvolle Semantik (z. B. richtige Verwendung von <nav>, <button>, Formularelementen) sowie die korrekte Anwendung von ARIA‑Attributen sorgen dafür, dass Screenreader und andere Assistivsoftware die Inhalte verlässlich erfassen können. Wer hier auf „Quick‑Fixes“ setzt, riskiert, dass einzelne Fragmente zwar technisch korrekt sind, die Gesamtstruktur aber unklar bleibt.
Barrierefreiheit als Teil des Entwicklungsprozesses
Barrierefreiheit sollte nicht am Ende eines Projekts „dazugeschrieben“ werden, sondern von Beginn an mitgedacht werden. Je früher Entwickler, Designer und Redakteure die Anforderungen kennen, desto weniger zusätzlicher Aufwand entsteht später. Viele Barrieren entstehen bereits bei der Konzeption von Layouts, Interaktionen und Prozessschritten:
- Wenn ein Kaufprozess nur per Mausklick funktioniert, bleibt er für Nutzer, die die Tastatur verwenden, schwer zugänglich.
- Wenn wichtige Informationen nur über Farbe signalisiert werden, ohne begleitende Form oder Positionshinweise, schaffen Firmen unbeabsichtigt Barrieren für Menschen mit einer Farbsehschwäche.
- Wenn komplexe Gesten in Apps als zentrales Bedienprinzip dienen, ohne alternative, vereinfachte Steuerung, wird die Nutzung für Menschen mit motorischen Einschränkungen deutlich erschwert.
Ein professioneller Entwicklungsprozess integriert Barrierefreiheit deshalb in Definition, Design, Implementierung, Test und Monitoring. Regelmäßige Zugänglichkeits-Checks, Screenreader-Tests und Nutzerfeedback runden die technische Umsetzung ab. Unternehmen, die eigene Qualitätssicherungsprozesse haben, können diese durch barrierefreiheits-spezifische Prüfkriterien erweitern.
Barrierefreie Apps und mobile Anwendungen im Fokus
Auch mobile Anwendungen sind im Rahmen des BFSG relevant, sofern sie digitale Dienstleistungen oder Produkte betreffen. Die Anforderungen unterscheiden sich zwar technologisch von klassischen Webseiten, zielen inhaltlich aber auf dasselbe Ziel: eine möglichst gleichberechtigte Nutzung für alle Nutzergruppen.
Wichtige Aspekte, um eine App barrierefrei zu gestalten, im mobilen Kontext sind:
- Bedienelemente, die ausreichend groß und klar beschriftet sind,
- Bedienbarkeit auch ohne komplexe Gesten,
- Unterstützung von System-Features wie Schriftvergrößerung, Kontrastmodi und Dark Mode,
- klare, hierarchisch aufgebaute Ansichten, die Screenreadern leicht erfassbar sind.
Vor allem im E-Commerce und Mobile Commerce Bereich ist die Barrierefreiheit von Apps direkt mit Umsatz assoziiert. So kann etwa mangelnde Barrierefreiheit in Shopping-Apps zu hohen Abbruchraten im Bestellprozess führen. Verwirrende Navigation oder fehlende alternative Bedienwege wirken sich auf die Conversion Rate aus – und in der Folge auch auf die Rentabilität des Angebots.
Fazit: Rechtssicherheit durch ganzheitliche barrierefreie Entwicklung
Digitale Barrierefreiheit lässt sich nicht durch nachträgliche Korrekturen oder kleine „Quick-Fixes“ herstellen. Sie erfordert eine saubere technische Basis, gut durchdachte mobile Konzepte und einen Entwicklungsprozess, der die Zugänglichkeit von Anfang an priorisiert. Wer diese Aspekte in seiner Softwareentwicklung berücksichtigt, profitiert doppelt: durch eine bessere Nutzererfahrung für alle Zielgruppen und durch den Schutz vor rechtlichen Konsequenzen.
Gerade weil die Anforderungen des BFSG tief in die technische Gestaltung und die internen Prozesse eingreifen, ist eine fundierte rechtliche Begleitung unerlässlich. Als spezialisierte Kanzlei für IT- und E-Commerce-Recht verfügt RICKERT.LAW über umfassende Expertise in der Beratung von Unternehmen mit digitalen Geschäftsmodellen. Wir kennen die Schnittstelle zwischen technischer Machbarkeit und rechtlicher Pflicht genau und unterstützen Sie gerne dabei, Ihre Plattformen, Apps und Prozesse rechtssicher aufzustellen.
Kontaktieren Sie uns für eine individuelle Beratung zur barrierefreien Softwareentwicklung – wir machen Ihr digitales Angebot zukunftssicher.
Häufig gestellte Fragen zur Barrierefreiheit in der Web- und App-Entwicklung
Barrierefreiheit in der Softwareentwicklung bedeutet, dass digitale Anwendungen so programmiert und strukturiert sind, dass sie von allen Menschen ohne Einschränkungen genutzt werden können. Technisch erfordert dies unter anderem eine saubere Code-Basis wie semantisches HTML5, die vollständige Bedienbarkeit über die Tastatur und die Kompatibilität mit Hilfstechnologien wie Screenreadern durch korrekte ARIA-Attribute.
Bei mobilen Anwendungen zielt die Barrierefreiheit darauf ab, die spezifischen Bedienkonzepte von Smartphones und Tablets inklusiv zu gestalten. Dazu gehören ausreichend große und klar beschriftete Touch-Bedienelemente, alternative Steuerungsmöglichkeiten ohne komplexe Wischgesten sowie die Unterstützung von System-Features wie Schriftvergrößerung oder Dark Mode.
Die Stufe AA bezieht sich auf die Web Content Accessibility Guidelines (WCAG), den international anerkannten Standard für barrierefreie Webinhalte. Für die rechtskonforme Umsetzung des BFSG ist in der Regel das Level AA maßgeblich, was bedeutet, dass sowohl grundlegende als auch erweiterte Hürden – wie unzureichende Kontraste oder fehlende Tastaturnavigation – beseitigt sein müssen.
In der Regel nicht. Viele Anforderungen lassen sich iterativ nachbessern: zentrale Prozesse, Navigation und Bedienelemente werden schrittweise angepasst, ohne eine komplette Neuentwicklung. Sinnvoll sind ein erstes Audit, ein Umsetzungsplan und regelmäßige Tests zusammen mit Nutzerfeedback.
Die zentrale technische Referenz ist die harmonisierte Norm EN 301 549. Für Webseiten und mobile Apps verweist diese maßgeblich auf die Web Content Accessibility Guidelines (WCAG) in der Version 2.1 auf dem Konformitätslevel AA. Wenn eine digitale Anwendung diese WCAG-Kriterien erfüllt, deckt sie bereits einen Großteil der gesetzlichen Anforderungen ab.
Technologisch unterscheiden sich die Anforderungen, das Ziel bleibt jedoch gleich: eine gleichberechtigte Nutzung für alle. Bei Apps im mobilen Kontext rücken spezifische Aspekte in den Fokus, wie etwa die Bedienbarkeit ohne komplexe Wischgesten, ausreichend große Touch-Ziele sowie die Unterstützung von System-Features wie Dark Mode oder Schriftvergrößerung.
Weil optische Kontraste und sichtbare Navigationselemente für blinde oder stark sehbehinderte Nutzer nicht ausreichen. Nur durch sauberes, semantisches HTML5 und die richtige Anwendung von ARIA-Attributen können assistive Technologien wie Screenreader die Struktur der Seite verlässlich erfassen und übersetzen.
