Hinweis zur Aktualisierung im Oktober 2025: Dieser Beitrag ist eine überarbeitete und erweiterte Version unseres ursprünglichen Artikels zur digitalen Barrierefreiheit von Juni 2024. Angesichts der neuen gesetzlichen Anforderungen durch das Barrierefreiheitsstärkungsgesetz (BFSG) und die aktualisierten WCAG 2.2-Richtlinien haben wir die Inhalte grundlegend aktualisiert und um aktuelle Entwicklungen sowie praktische Umsetzungshilfen ergänzt.
Inklusion und Zugänglichkeit: Ein grundlegendes Menschenrecht
Zugänglichkeit ist ein Menschenrecht. Zugang zu Information, Bildung und Kommunikation ist kein Privileg, sondern ein universelles Recht. Die UN-Konvention über die Rechte von Menschen mit Behinderungen (UN-BRK) und andere internationale Rahmenwerke stärken dieses Recht, indem sie die Bedeutung barrierefreier Informationstechnologien hervorheben.
In Deutschland leben laut Statistischem Bundesamt 7,8 Millionen Menschen mit einer anerkannten Schwerbehinderung (Stand: Ende 2021). Weltweit nutzen etwa 2,5 Milliarden Menschen assistive Technologien – eine Zahl, die laut Weltgesundheitsorganisation (WHO) bis 2050 auf über 3,5 Milliarden ansteigen wird.
Digitale Barrierefreiheit bedeutet mehr als die technische Anpassung von Webseiten oder Apps. Es geht um ein inklusives Design, das jeden einzelnen von uns berücksichtigt. Jeder Mensch ist anders: Manche sehen oder hören nicht so gut, andere haben motorische Schwierigkeiten oder können komplexe Informationen nicht so gut verarbeiten. Digitale Inhalte barrierefrei zu gestalten bedeutet, diese Unterschiede anzuerkennen und Technologien so zu gestalten, dass sie für jeden von uns funktionieren.
Neue gesetzliche Anforderungen ab 2025:
Das Barrierefreiheitsstärkungsgesetz (BFSG)
Am 28. Juni 2025 trat das Barrierefreiheitsstärkungsgesetz in Kraft, das den European Accessibility Act (EAA) in deutsches Recht umsetzt. Damit wird digitale Barrierefreiheit erstmals auch für privatwirtschaftliche Unternehmen verpflichtend.
Wer ist betroffen?
- Unternehmen mit mindestens 10 Mitarbeitern und einem Jahresumsatz über 2 Millionen Euro
- Anbieter digitaler Dienstleistungen (Online-Banking, E-Commerce, Buchungsportale)
- Betreiber von Websites und Apps mit B2C-Angeboten
- Hersteller digitaler Produkte (Computer, Smartphones, E-Reader, Geldautomaten)
Ausnahmen:
- Kleinstunternehmen (unter 10 Mitarbeiter und Umsatz unter 2 Mio. Euro)
- Reine B2B-Dienstleistungen ohne Endkundenausrichtung
- Bei unverhältnismäßiger wirtschaftlicher Belastung (muss nachgewiesen werden)
Quelle: Bundesfachstelle Barrierefreiheit
Der European Accessibility Act (EAA)
Der EAA gilt seit 28. Juni 2025 in allen 27 EU-Mitgliedstaaten und harmonisiert die Barrierefreiheitsanforderungen europaweit. Dies erleichtert grenzüberschreitenden Handel und schafft einheitliche Standards. Die EU-Kommission schätzt, dass die Harmonisierung Unternehmen und Mitgliedstaaten bis zu 10 Milliarden Euro jährlich einsparen könnte.
Quelle: Europäische Kommission – European Accessibility Act
WCAG 2.2: Die aktuellen Standards für barrierefreie Webinhalte
Im Oktober 2023 veröffentlichte das World Wide Web Consortium (W3C) die Web Content Accessibility Guidelines (WCAG) 2.2 als Nachfolger der WCAG 2.1 aus dem Jahr 2018. Die neuen Richtlinien bauen auf den bestehenden POUR-Prinzipien auf und erweitern diese um neun neue Erfolgskriterien.
Grundlagen und Prinzipien der Barrierefreiheit
Um digitale Inhalte wirklich für alle zugänglich zu machen, gibt es eine Reihe von Prinzipien, die eingehalten werden müssen: die POUR-Prinzipien. Diese Prinzipien wurden im Rahmen der Web Content Accessibility Guidelines (WCAG) entwickelt, die vom World Wide Web Consortium (W3C) herausgegeben werden.
POUR steht für Perceivable, Operable, Understandable, Robust (Wahrnehmbar, Benutzbar, Verständlich, Robust) und bildet das Fundament, auf dem eine inklusive digitale Umgebung aufgebaut wird. Werfen wir einen genaueren Blick auf diese vier Säulen der Barrierefreiheit:
Perceivable (Wahrnehmbar):
Jeder Nutzer soll die angebotenen Inhalte unabhängig von seinen sensorischen Fähigkeiten wahrnehmen können. Das bedeutet, dass Informationen nicht nur visuell, sondern auch über andere Sinne wie Hören oder Fühlen zugänglich sein müssen.
Man denke an Untertitel für Videos, Audiodeskriptionen für Bilder und taktile Schnittstellen für Touchscreens. Die Idee ist einfach: Keine Information sollte ausschließlich über einen Sinneskanal vermittelt werden.
Operable (Bedienbar):
Die Bedienbarkeit digitaler Angebote muss so gestaltet sein, dass alle Nutzerinnen und Nutzer, ob mit oder ohne körperliche Einschränkungen, diese nutzen können. Dazu gehört die Navigation durch eine Website mittels Tastatur oder Sprachbefehlen, um auch Menschen, die keine Maus bedienen können, eine reibungslose Nutzung zu ermöglichen. Menüs, Links und Schaltflächen müssen so gestaltet sein, dass sie leicht zugänglich und bedienbar sind.
Understandable (Verständlich):
Hier geht es darum, dass die angebotenen Inhalte und die Bedienung der digitalen Angebote intuitiv und leicht verständlich sind. Eine klare, einfache Sprache und eine logische Navigation helfen allen Nutzern, insbesondere auch Nutzern mit kognitiven Einschränkungen, die gewünschten Informationen zu finden und Aufgaben ohne fremde Hilfe zu erledigen. Ein konsistentes Layout und vorhersehbare Funktionen sind hier der Schlüssel.
Robust (Robust):
Digitale Inhalte sollten so robust gestaltet sein, dass sie mit einer Vielzahl von Technologien kompatibel sind, einschließlich älterer und neuerer assistiver Technologien. Ihre Website oder Anwendung sollte in der Lage sein, sich an die sich ständig weiterentwickelnden Methoden der Nutzer anzupassen, um Barrierefreiheit zu gewährleisten. Dies erfordert eine standardkonforme und zukunftssichere Programmierung.
Durch die Einhaltung dieser POUR-Prinzipien können wir sicherstellen, dass unsere digitalen Inhalte nicht nur weitgehend barrierefrei, sondern auch nachhaltig und zukunftssicher sind. Dabei geht es nicht nur um die Erfüllung gesetzlicher Vorgaben – es geht um die Schaffung einer inklusiven digitalen Welt, in der alle Menschen gleichberechtigten Zugang haben.
Die wichtigsten Neuerungen in WCAG 2.2
Die WCAG 2.2 führt neun neue Erfolgskriterien ein, die besonders Menschen mit kognitiven Einschränkungen, Sehbehinderungen und mobile Nutzer unterstützen:
Neue Kriterien der Stufe A:
- 2.4.11 Fokus darf nicht verdeckt sein (Minimum): Der Tastaturfokus muss mindestens teilweise sichtbar bleiben, auch wenn sich andere Elemente wie Cookie-Banner einblenden.
- 2.4.12 Fokus darf nicht verdeckt sein (Enhanced): Der Fokus muss vollständig sichtbar sein (Stufe AAA).
Neue Kriterien der Stufe AA:
- 2.5.7 Ziehbewegungen: Funktionen, die Ziehbewegungen erfordern (Drag & Drop), müssen auch mit einfachen Zeigergesten bedienbar sein.
- 2.5.8 Mindestgröße des Zielbereichs: Klickbare Elemente müssen mindestens 24×24 CSS-Pixel groß sein oder ausreichend Abstand haben.
- 3.2.6 Konsistente Hilfe: Hilfemechanismen müssen auf allen Seiten an der gleichen Stelle erscheinen.
- 3.3.7 Redundante Eingabe: Bereits eingegebene Informationen sollen nicht erneut abgefragt werden müssen.
- 3.3.8 Zugängliche Authentifizierung (Minimum): Authentifizierung sollte ohne kognitive Funktionstests (z.B. Merken von Passwörtern) möglich sein.
Entferntes Kriterium:
- 4.1.1 Syntaxanalyse: Dieses Kriterium wurde als veraltet markiert und entfernt, da moderne Browser HTML-Fehler automatisch korrigieren.
Quelle: Bundesfachstelle Barrierefreiheit – WCAG 2.2
Werkzeuge und Techniken für barrierefreie Inhalte
1. ARIA-Labels und semantisches HTML
ARIA (Accessible Rich Internet Applications) erweitert HTML um zusätzliche Informationen für assistive Technologien. Wichtige ARIA-Attribute:
aria-label: Beschreibt Elemente für Screenreaderaria-expanded: Zeigt an, ob ein Menü ausgeklappt istaria-controls: Verknüpft ein Steuerelement mit dem kontrollierten Elementaria-live: Informiert über dynamische Inhaltsänderungen
Best Practice: Nutzen Sie zunächst semantisches HTML (<nav>, <main>, <article>, <button>) und ergänzen Sie ARIA nur dort, wo HTML nicht ausreicht.
2. Tastaturnavigation
Für Menschen mit motorischen oder visuellen Einschränkungen ist die Tastaturnavigation unverzichtbar:
- Alle interaktiven Elemente müssen mit der Tab-Taste erreichbar sein
- Fokusindikatoren müssen klar sichtbar sein (mindestens 3:1 Kontrast)
- Logische Tab-Reihenfolge im DOM
- Tastaturkürzel für häufig genutzte Funktionen
- Skip-Links zum Überspringen von Navigationsbereichen
3. Barrierefreie Dokumente (Word und PDF)
Microsoft Word:
- Formatvorlagen für Überschriften verwenden
- Alternativtexte für Bilder hinzufügen
- Barrierefreiheitsprüfung nutzen (Überprüfen → Barrierefreiheit)
- Leserichtung bei Tabellen festlegen
PDF-Dokumente:
- PDFs sollten aus Word oder InDesign mit Tags exportiert werden
- Nachbearbeitung in Adobe Acrobat Pro für vollständige Barrierefreiheit
- Lesereihenfolge prüfen und anpassen
- Formularfelder mit beschreibenden Labels versehen
4. Bilder und Multimedia barrierefrei gestalten
Bilder:
- Informative Bilder: Aussagekräftige Alternativtexte, die den Inhalt beschreiben
- Dekorative Bilder: Leeres alt-Attribut (
alt="") zur Kennzeichnung - Komplexe Grafiken: Ausführliche Beschreibung im umgebenden Text oder via
longdesc
Videos:
- Untertitel für alle gesprochenen Inhalte
- Audiodeskription für visuelle Informationen
- Transkripte als Textalternative
- Barrierefreier Media Player mit Tastatursteuerung
Audio:
- Transkripte für alle Audioinhalte
- Visuelle Anzeigen für auditive Signale
Assistive Technologien verstehen
Um barrierefreie Inhalte zu gestalten, ist es wichtig zu verstehen, welche Hilfsmittel Menschen mit Behinderungen nutzen:
Screenreader
Screenreader wandeln Bildschirminhalte in Sprache oder Braille-Ausgabe um. Die am häufigsten genutzten Screenreader sind:
- JAWS (Job Access With Speech): Der weltweit meistgenutzte Screenreader für Windows
- NVDA (NonVisual Desktop Access): Kostenloser Open-Source Screenreader für Windows
- VoiceOver: In macOS, iOS und iPadOS integriert
- TalkBack: In Android integriert
- Narrator: In Windows integriert
Screenreader-Nutzer navigieren hauptsächlich über:
- Überschriften-Hierarchie
- Landmark-Regionen (Navigation, Main, Footer etc.)
- Listen und Links
- Formularelemente
- ARIA-Beschreibungen
Quelle: WebAIM – Screen Reader User Survey
Weitere assistive Technologien
- Vergrößerungssoftware: ZoomText, MAGic für Menschen mit Sehbehinderungen
- Sprachsteuerung: Dragon NaturallySpeaking, Spracherkennung in Betriebssystemen
- Alternative Eingabegeräte: Trackballs, Mundsteuerung, Eye-Tracking
- Braille-Displays: Taktile Ausgabegeräte für blinde Menschen
Praktische Umsetzung: Schritt für Schritt zur barrierefreien Website
Schritt 1: Bewusstsein schaffen
- Schulungen für alle Teammitglieder (Entwicklung, Design, Content, Management)
- Sensibilisierung für verschiedene Behinderungsarten
- Einbindung von Menschen mit Behinderungen in Testprozesse
- Barrierefreiheit als festen Bestandteil in den Entwicklungsprozess integrieren
Schritt 2: Ist-Analyse durchführen
- Automatisierte Tests mit Tools wie:
- Lighthouse (in Chrome DevTools integriert)
- axe DevTools (Browser-Erweiterung)
- WAVE (Web Accessibility Evaluation Tool)
- Pa11y (Kommandozeilen-Tool für CI/CD-Integration)
- Manuelle Prüfung mit Screenreadern
- BITV-Test durch zertifizierte Prüfstellen
- User-Tests mit Menschen mit Behinderungen
Schritt 3: Prioritäten setzen
Fokussieren Sie zunächst auf kritische Barrieren:
- Kritisch: Inhalte sind nicht wahrnehmbar (fehlende Alt-Texte, keine Tastatursteuerung)
- Hoch: Navigation ist erschwert (unklare Fokusindikatoren, inkonsistente Struktur)
- Mittel: Nutzbarkeit ist eingeschränkt (zu kleine Buttons, ungünstige Kontraste)
- Niedrig: Kleinere Optimierungen (Formulierungen, zusätzliche Hilfestellungen)
Schritt 4: Kontinuierliche Verbesserung
- Regelmäßige Accessibility-Audits
- Integration von Barrierefreiheitstests in CI/CD-Pipeline
- Monitoring von Nutzerfeedback
- Aktualisierung bei Änderungen an WCAG-Standards
- Dokumentation und Erklärung zur Barrierefreiheit auf der Website
Schritt 5: Rechtliche Absicherung
Erklärung zur Barrierefreiheit: Nach BFSG müssen Sie eine Erklärung zur Barrierefreiheit veröffentlichen mit:
- Datum der Erstellung und letzten Überprüfung
- Verwendete Methoden zur Bewertung
- Liste noch nicht barrierefreier Inhalte mit Gründen
- Kontaktmöglichkeit für Barriere-Meldungen
- Link zum Feedback-Mechanismus
Feedback-Mechanismus: Bieten Sie mehrere Kontaktwege an (E-Mail, Telefon, Formular), über die Nutzer Barrieren melden können. Reagieren Sie zeitnah auf Meldungen.
Häufige digitale Barrieren und wie Sie sie vermeiden
Barriere 1: Fehlende Alternativtexte
Problem: Screenreader können Bilder ohne Alt-Text nicht interpretieren.
Lösung:
html
<!-- Gut: Beschreibender Alt-Text -->
<img src="produktbild.jpg" alt="Ergonomischer Bürostuhl mit verstellbarer Rückenlehne in Schwarz">
<!-- Falsch: Zu generisch oder fehlend -->
<img src="produktbild.jpg" alt="Bild">
<img src="produktbild.jpg">Barriere 2: Unzureichende Kontraste
Problem: Menschen mit Sehbehinderungen können Texte bei schwachen Kontrasten nicht lesen.
Lösung:
- Normaler Text: Mindestens 4,5:1 Kontrastverhältnis
- Große Texte (18pt+): Mindestens 3:1 Kontrastverhältnis
- Nutzen Sie Tools wie den WebAIM Contrast Checker
Barriere 3: Nur mausbasierte Interaktionen
Problem: Menschen mit motorischen Einschränkungen oder Screenreader-Nutzer können keine Maus verwenden.
Lösung:
- Alle Funktionen müssen per Tastatur erreichbar sein
- Custom-Widgets mit korrekten ARIA-Rollen versehen
- Fokus-Management bei dynamischen Inhalten
Barriere 4: Fehlende Formular-Labels
Problem: Screenreader können Formularfelder ohne Labels nicht zuordnen.
Lösung:
html
<!-- Gut: Explizites Label -->
<label for="email">E-Mail-Adresse:</label>
<input type="email" id="email" name="email">
<!-- Falsch: Nur Platzhalter -->
<input type="email" placeholder="E-Mail-Adresse">Barriere 5: Unstrukturierte Inhalte
Problem: Ohne korrekte Überschriftenhierarchie verlieren Screenreader-Nutzer die Orientierung.
Lösung:
- Verwenden Sie
<h1>bis<h6>in logischer Reihenfolge - Überspringen Sie keine Ebenen (von
<h2>nicht direkt zu<h4>) - Nutzen Sie semantische HTML-Elemente (
<nav>,<main>,<aside>)
Die Vorteile barrierefreier Websites
1. Größere Zielgruppe
Mit 7,8 Millionen Menschen mit Schwerbehinderung allein in Deutschland erschließen Sie einen erheblichen Markt. Hinzu kommen Menschen mit temporären Einschränkungen (z.B. Armbruch) und situativen Einschränkungen (laute Umgebung, helles Sonnenlicht).
2. Besseres SEO
Google und andere Suchmaschinen bevorzugen barrierefreie Websites:
- Semantisches HTML verbessert die Crawler-Freundlichkeit
- Alt-Texte helfen bei der Bildsuche
- Klare Strukturen erleichtern die Inhaltsanalyse
- Schnellere Ladezeiten durch optimierte Inhalte
3. Höhere Benutzerfreundlichkeit
Barrierefreie Websites sind für alle einfacher zu bedienen:
- Klare Navigation reduziert Absprungraten
- Lesbare Texte verbessern das Nutzererlebnis
- Konsistente Gestaltung schafft Vertrauen
4. Rechtssicherheit
Erfüllung gesetzlicher Anforderungen vermeidet:
- Bußgelder bis zu 100.000 Euro nach BFSG
- Abmahnungen und rechtliche Auseinandersetzungen
- Reputationsschäden
- Ausschluss von öffentlichen Ausschreibungen
5. Positives Unternehmensimage
Barrierefreiheit zeigt soziale Verantwortung und kann als Wettbewerbsvorteil genutzt werden. Unternehmen, die Inklusion ernst nehmen, stärken ihre Marke und erreichen eine positive Außenwirkung.
Ressourcen und Weiterbildung
Offizielle Quellen und Standards
- W3C Web Accessibility Initiative (WAI): https://www.w3.org/WAI/
- WCAG 2.2 Guidelines: https://www.w3.org/TR/WCAG22/
- Bundesfachstelle Barrierefreiheit: https://www.bundesfachstelle-barrierefreiheit.de
- EN 301 549 Standard: https://www.etsi.org
Praktische Tools
- Lighthouse (Chrome DevTools): Automatisierte Barrierefreiheitsprüfung
- axe DevTools: Browser-Erweiterung für detaillierte Prüfungen
- WAVE: Visuelle Darstellung von Barrieren
- Colour Contrast Analyser: Desktop-Tool für Kontrastprüfungen
- NVDA Screenreader: Kostenloser Screenreader zum Testen
Deutsche Anlaufstellen
- BIK BITV-Test: https://www.bitvtest.de/
- Aktion Mensch: https://www.aktion-mensch.de/inklusion/barrierefreiheit
- Bundeskompetenzzentrum Barrierefreiheit: Beratung für Unternehmen
Schulungen und Kurse
Zur Kurs-Übersicht auf medienreich.de
Aufruf zum Handeln: Jetzt aktiv werden!
Die Anforderungen des BFSG und der WCAG 2.2 mögen auf den ersten Blick überwältigend erscheinen, aber die Umsetzung barrierefreier digitaler Inhalte ist eine Investition in die Zukunft. Beginnen Sie mit kleinen Schritten:
Kurzfristig (1-3 Monate):
- Führen Sie eine erste Barrierefreiheitsprüfung durch
- Beheben Sie kritische Barrieren (fehlende Alt-Texte, Tastaturnavigation)
- Schulen Sie Ihr Team
Mittelfristig (3-6 Monate):
- Erstellen Sie Richtlinien für barrierefreie Inhalte
- Integrieren Sie Barrierefreiheit in Ihren Entwicklungsprozess
- Veröffentlichen Sie eine Erklärung zur Barrierefreiheit
Langfristig (6-12 Monate):
- Erreichen Sie WCAG 2.2 AA-Konformität
- Etablieren Sie kontinuierliche Monitoring-Prozesse
- Holen Sie Feedback von Nutzern mit Behinderungen ein
Barrierefreiheit beginnt mit dem Engagement jedes Einzelnen. Jeder Schritt, den Sie und Ihre Organisation in Richtung barrierefreier Inhalte unternehmen, trägt zu einer inklusiveren und gerechteren digitalen Welt bei.
Zusammenfassung
Digitale Barrierefreiheit ist seit Juni 2025 nicht mehr optional, sondern gesetzlich verpflichtend. Mit den WCAG 2.2 als internationalen Standard, dem BFSG als deutschem Gesetz und dem EAA als europäischem Rahmen gibt es klare Vorgaben für die Umsetzung.
Die wichtigsten Erkenntnisse:
- POUR-Prinzipien bilden die Grundlage: Wahrnehmbar, Bedienbar, Verständlich, Robust
- WCAG 2.2 bringt 9 neue Erfolgskriterien, insbesondere für kognitive und mobile Barrierefreiheit
- BFSG und EAA verpflichten Unternehmen ab 10 Mitarbeitern zur Barrierefreiheit
- Assistive Technologien wie Screenreader müssen bei der Entwicklung berücksichtigt werden
- Kontinuierliche Verbesserung ist wichtiger als sofortige Perfektion
Investitionen in Barrierefreiheit zahlen sich mehrfach aus: durch größere Reichweite, besseres SEO, höhere Benutzerfreundlichkeit, Rechtssicherheit und ein positives Unternehmensimage.
Haben Sie Fragen zur Umsetzung digitaler Barrierefreiheit in Ihrem Unternehmen? Kontaktieren Sie uns oder schauen Sie sich unsere Schulungsangebote zum Thema Barrierefreiheit an.
Dieser Artikel wurde im Oktober 2025 aktualisiert und basiert auf den aktuellen WCAG 2.2-Richtlinien, dem Barrierefreiheitsstärkungsgesetz (BFSG) sowie offiziellen Quellen des W3C, der Bundesfachstelle Barrierefreiheit und der Europäischen Kommission.
