Leitfaden | Technik & Umsetzung

Einleitung
Das Barrierefreiheitsstärkungsgesetz (BFSG) verpflichtet ab dem 28. Juni 2025 erstmals auch private Unternehmen, ihre digitalen Produkte und Dienstleistungen barrierefrei zu gestalten. Zu den betroffenen Angeboten zählen Websites, Web‑Apps, mobile Anwendungen, elektronische Dokumente, Selbstbedienungsterminals und Online‑Geschäftsprozesse. Ziel ist es, Menschen mit Behinderungen, älteren Nutzern und allen weiteren Zielgruppen gleichberechtigten Zugriff zu ermöglichen und Diskriminierung abzubauen.

Anwendungsbereich & Ausnahmen
Betroffen sind alle neu bereitgestellten digitalen Angebote, während Bestandslösungen bis zum 27. Juni 2030 weiterbetrieben werden dürfen, sofern sie nicht wesentlich geändert werden. Kleinstunternehmen mit unter zehn Mitarbeitenden und bis zu 2 Mio. EUR Jahresumsatz sind für bestimmte digitale Dienstleistungen bis 2030 befreit, nicht jedoch für physische Produkte oder Dokumente.

Übersichtspflicht („Accessibility Statement“)
Unternehmen müssen eine öffentlich zugängliche Barrierefreiheitserklärung veröffentlichen. Diese umfasst den aktuellen Umsetzungsstand barrierefreier Funktionen, bekannte Barrieren, Maßnahmen und Zeitpläne zur Behebung sowie Kontaktmöglichkeiten für Nutzerfeedback.

Fristen & Risiken
Bis zum Stichtag müssen alle neuen Angebote vollständig barrierefrei sein. Bei Nichteinhaltung drohen Bußgelder bis 100 000 EUR, Marktüberwachungsmaßnahmen, Abmahnungen, Schadensersatzansprüche und erheblicher Reputationsverlust.

Empfohlene Vorgehensweise

Audit & Bestandsaufnahme: Systematische Prüfung aller digitalen Assets.

Priorisierung & Maßnahmenplan: Klassifizierung nach Schwere und Aufwand.

Umsetzung & Testing: Technische Anpassungen nach WCAG und EN 301 549, automatisierte und manuelle Tests.

Veröffentlichung & Monitoring: Accessibility‑Statement live schalten, kontinuierliches Monitoring und regelmäßige Updates.

IFDB-Unterstützung
Das IFDB begleitet Unternehmen mit strategischer Beratung, zertifizierten Audits, Managed Monitoring, Workshops und Tool‑Kits, um eine 100 % gesetzeskonforme und inklusive Umsetzung sicherzustellen.

Automatisiertes Barrierefreiheits-Testing mit axe, WAVE und Lighthouse bringt Accessibility-Prüfungen direkt in euren Dev-Prozess: Von der lokalen Code-Extension über Pre-Commit-Hooks bis zur CI/CD-Pipeline sorgen diese Tools für schnelle, skalierbare Audits nach WCAG-Standards. axe glänzt mit tiefgehenden Regelsets für semantisches HTML und ARIA, WAVE liefert visuelles Feedback auf der Seite, und Lighthouse bietet zusätzlich Performance- und SEO-Checks. Durch frühzeitige Fehlererkennung in Pull-Requests und nächtliche Full-Site-Scans lassen sich Regressionen vermeiden und alle Releases revisionssicher dokumentieren.

Für reibungslose Abläufe empfiehlt es sich, automatische Builds bei kritischen Violations abbrechen zu lassen, Tickets via Bot zu erzeugen und KPI-gedriebene Dashboards zu pflegen. das IFDB – Institut für digitale Barrierefreiheit unterstützt euch dabei mit zertifizierten Audits, maßgeschneiderten Schulungen und Managed Monitoring, damit eure Produkte dauerhaft 100 % gesetzeskonform und inklusiv bleiben.

Damit alle Nutzer per Tastatur klar erkennen, welches Element gerade aktiv ist, solltest du für Links und Buttons deutliche Fokusrahmen definieren – zum Beispiel einen 3 Pixel breiten, kontrastreichen Rand mit ausreichend Abstand zum umgebenden Inhalt. Achte darauf, dass dieser Rahmen stets gut sichtbar bleibt und nicht zu dünn oder farblich zu unauffällig ausfällt.

Für aufklappbare Untermenüs sind ARIA-Attribute unverzichtbar: Mit aria-expanded signalisierst du, ob das Submenü geöffnet ist, und über aria-controls verknüpfst du den auslösenden Button mit dem entsprechenden Menü. Zusätzlich zeigt aria-haspopup an, dass eine weitere Ebene folgt. So verstehen Screenreader zuverlässig, wann Nutzer auf ein Dropdown stoßen und in welchem Zustand es sich befindet.

Auch die mobile Navigation lässt sich barrierefrei umsetzen: Ein einfacher Hamburger-Button trägt aria-expanded=“false“ und aria-controls=“mobile-menu“ und toggelt beim Klick das versteckte

Damit alle Nutzer per Tastatur klar erkennen, welches Element gerade aktiv ist, solltest du für Links und Buttons deutliche Fokusrahmen definieren – zum Beispiel einen 3 Pixel breiten, kontrastreichen Rand mit ausreichend Abstand zum umgebenden Inhalt. Achte darauf, dass dieser Rahmen stets gut sichtbar bleibt und nicht zu dünn oder farblich zu unauffällig ausfällt.

Für aufklappbare Untermenüs sind ARIA-Attribute unverzichtbar: Mit aria-expanded signalisierst du, ob das Submenü geöffnet ist, und über aria-controls verknüpfst du den auslösenden Button mit dem entsprechenden Menü. Zusätzlich zeigt aria-haspopup an, dass eine weitere Ebene folgt. So verstehen Screenreader zuverlässig, wann Nutzer auf ein Dropdown stoßen und in welchem Zustand es sich befindet.

Auch die mobile Navigation lässt sich barrierefrei umsetzen: Ein einfacher Hamburger-Button trägt aria-expanded=“false“ und aria-controls=“mobile-menu“ und toggelt beim Klick das versteckte

Die digitale Transformation erfordert, dass Formulare nicht nur funktional, sondern auch inklusiv gestaltet werden – damit Menschen mit Seh-, kognitiven oder motorischen Einschränkungen alle digitalen Angebote uneingeschränkt nutzen können. Barrierefreie Formulare verbessern die Nutzererfahrung, minimieren rechtliche Risiken und stärken das professionelle Image deines Unternehmens. In diesem Leitfaden erfährst du, wie du mit einer klaren, schrittweisen Vorgehensweise und mithilfe moderner Web-Technologien Formulare so gestaltest, dass sie den aktuellen Standards wie WCAG, BITV und BFSG entsprechen. Dabei wird besonders auf die korrekte Verwendung von Labels, einen sichtbaren Fokus und eine logische Tastaturnavigation eingegangen.

Ein guter Alt‑Text sollte aussagekräftig und präzise den Inhalt sowie die Funktion eines Bildes beschreiben, ohne dabei überflüssige Informationen zu wiederholen. Wichtig ist, dass du den Alt‑Text stets kontextbezogen formulierst – was auf einer Produktseite relevant ist, kann in einem informativen Artikel anders lauten. Dabei gilt:

Konkret und spezifisch:
Beschreibe, was genau auf dem Bild zu sehen ist. Statt einfach nur „Foto“ zu verwenden, könnte ein optimaler Alt‑Text lauten: „Smartwatch X im eleganten Silberdesign mit klarem Display, konzipiert für den täglichen Gebrauch.“

Funktionalität berücksichtigen:
Wenn das Bild als interaktives Element dient, beispielsweise als Button zum Absenden eines Formulars, sollte dies im Alt‑Text ebenfalls erwähnt werden. Ein Beispiel hierfür wäre: „Registrierungsformular öffnen – jetzt anmelden“, anstelle von generischen Begriffen wie „hier klicken“.

Vermeide redundante Phrasen:
Wiederhole nicht Informationen, die der Screenreader ohnehin als Bild ankündigt. Statt „Bild von“ reicht es, direkt den Inhalt zu beschreiben. Dies vermeidet unnötige Wiederholungen und verbessert die Klarheit der Informationen.

Diese Prinzipien helfen dir, Alt‑Texte zu erstellen, die nicht nur den gesetzlichen Anforderungen gemäß WCAG und PDF/UA genügen, sondern auch den Nutzern ein optimales Erlebnis bieten. Durch den gezielten Einsatz dieser Formulierungsregeln erhöhst du die Zugänglichkeit deiner digitalen Inhalte erheblich.

Die IFDB – Institut für digitale Barrierefreiheit unterstützt dich in diesem Prozess mit weiterführenden Workshops, zertifizierten Audits und individueller Beratung – sodass du stets 100 % gesetzeskonforme und benutzerfreundliche Alt‑Texte erstellst.

PDF‑Erstellung mit Microsoft Word

Microsoft Word ist in vielen Unternehmen das Standardwerkzeug zur Erstellung von Textdokumenten. Um sicherzustellen, dass die erstellten Dokumente barrierefrei sind, sollten zunächst einige wichtige Vorbereitungen getroffen werden. Verwende unbedingt die integrierten Formatvorlagen wie „Überschrift 1“, „Überschrift 2“ usw., um dem Dokument eine klare semantische Struktur zu verleihen. So können Screenreader die Hierarchie der Inhalte später korrekt erfassen. Auch echte Listen und Tabellen, anstatt rein visueller Formatierungen mit Leerzeichen oder Tabs, sind essenziell für die korrekte Übernahme in das PDF.

Nutze anschließend die in Word integrierte Barrierefreiheitsprüfung, die du über den Pfad „Datei > Informationen > Auf Probleme überprüfen > Barrierefreiheit prüfen“ erreichst. Das Tool gibt dir detaillierte Hinweise, etwa auf fehlende Alt-Texte bei Bildern oder auf unklar strukturierte Tabellen. Alle angezeigten Fehler sollten korrigiert werden, bevor du das Dokument als PDF speicherst.

Beim PDF-Export wählst du „Datei > Speichern unter“ und das Format „PDF (*.pdf)“. Sehr wichtig ist hierbei die Aktivierung der Option „Dokumentstruktur-Tags für Barrierefreiheit verwenden“. Damit stellst du sicher, dass alle in Word definierten semantischen Informationen – wie Überschriften, Listen und Tabellen – ins PDF übernommen werden.

Vorteil:
Da die meisten Mitarbeiter bereits mit Word vertraut sind, ist der Schulungsaufwand gering. Das IFDB – Institut für digitale Barrierefreiheit unterstützt dich zudem bei der Feinabstimmung deiner Workflows und schult dein Team, sodass du konsequent 100 % gesetzeskonforme und nutzerfreundliche PDFs erstellen kannst.

Einleitung und Grundlagen des Screenreader-Tests

Digitale Barrierefreiheit gewinnt zunehmend an Bedeutung – nicht zuletzt, weil gesetzliche Vorgaben und das Ziel, alle Nutzergruppen optimal zu bedienen, immer mehr in den Vordergrund rücken. Screenreader sind dabei eines der wichtigsten Werkzeuge für blinde und sehbehinderte Menschen, denn sie wandeln den Text und andere Inhalte einer Website in gesprochene Sprache um. So können sie sich auch dann im Web zurechtfinden, wenn sie visuelle Inhalte nicht erfassen können.

Um sicherzustellen, dass deine Website auch wirklich gut für Screenreader aufbereitet ist, reicht es nicht aus, sich allein auf automatisierte Tools zu verlassen. Diese sind hilfreich, decken jedoch meist nur einen Teil der Probleme ab – deshalb ist ein manueller Screenreader-Test unerlässlich, um die tatsächliche Benutzerfreundlichkeit zu überprüfen.

In diesem Leitfaden lernst du Schritt für Schritt, wie du einen Screenreader-Test selbstständig durchführst. Du erfährst, wie du zunächst die passenden Screenreader für deine Testumgebung auswählst – etwa NVDA und JAWS für Windows, VoiceOver für macOS/iOS und TalkBack für Android – und wie du deine Testumgebung optimal vorbereitest, indem du verschiedene Browser und eine „saubere“ Version deiner Website ohne Zusatzplugins einsetzt.

Wichtige Elemente, die du testen solltest, sind:

Hauptnavigation und Skip-Links: Stelle sicher, dass alle Menüpunkte in der richtigen Reihenfolge vorgelesen werden.

Überschriften-Hierarchie: Überprüfe, ob die logische Struktur von H1 bis H3 (oder höher) korrekt erkannt und wiedergegeben wird.

Formulare und interaktive Bereiche: Teste, ob alle Eingabefelder und Buttons mit den zugehörigen Labels vorgelesen werden und Fehlermeldungen via ARIA-Funktionen sofort angekündigt werden.

Dynamische Inhalte: Achte darauf, dass bei Akkordeons oder Modal-Fenstern Änderungen wie „geöffnet“ oder „geschlossen“ korrekt kommuniziert werden.

Darüber hinaus dokumentierst du alle aufgetretenen Probleme systematisch und erstellst einen Maßnahmenplan – damit du gezielt Optimierungen vornehmen kannst. Dieser strukturierte Prozess stellt sicher, dass deine Website den gesetzlichen Anforderungen der WCAG entspricht und echte Mehrwerte für alle Nutzer bietet.

Das IFDB – Institut für digitale Barrierefreiheit unterstützt dich dabei umfassend – mit Beratung, Workshops, zertifizierten Audits und langfristigem Support, sodass du stets 100 % gesetzeskonforme und nutzerfreundliche Ergebnisse erzielst.

Einleitung

Digitale Barrierefreiheit ist heute nicht mehr optional – sie ist sowohl gesetzlich vorgeschrieben als auch ein entscheidender Faktor für eine nutzerfreundliche Website. PDF-Dateien, Webseiten und weitere digitale Inhalte müssen so gestaltet sein, dass sie allen Menschen, auch jenen mit Seh-, kognitiven oder motorischen Einschränkungen, uneingeschränkt zugänglich sind. Gesetzliche Vorgaben wie das Barrierefreiheitsstärkungsgesetz (BFSG), die BITV und die WCAG-Richtlinien machen es unumgänglich, dass Unternehmen und öffentliche Einrichtungen ihre digitalen Angebote inklusiv gestalten.

In diesem Leitfaden erfährst du in zehn präzise strukturierten Schritten, wie du den Status deiner Website systematisch analysierst, Mängel identifizierst und konkrete Maßnahmen einleitest – von der Erfassung aller digitalen Komponenten bis hin zur kontinuierlichen Qualitätssicherung. Dabei zeigen wir dir, wie du mit den gängigen Tools wie Microsoft Word, Adobe InDesign und Adobe Acrobat 100 % gesetzeskonforme und benutzerfreundliche Inhalte erstellst. Zudem erfährst du, wie das IFDB – Institut für digitale Barrierefreiheit dich durch umfassende Beratung, zertifizierte Audits und praxisnahe Schulungen unterstützt, um langfristig höchste Standards sicherzustellen.

Auszug aus Schritt 1: Ausgangslage prüfen – Wo stehen wir aktuell?

Der erste Schritt im Prozess der Barrierefreiheit ist eine vollständige Bestandsaufnahme aller digitalen Angebote. Dies umfasst die Haupt-Website, Unterseiten, PDF-Dokumente, Formulare und interaktive Elemente wie Online-Shops oder mobile Apps. Mithilfe automatisierter Tools wie WAVE, axe DevTools und Google Lighthouse werden erste Mängel identifiziert – sei es das Fehlen von Alternativtexten, unzureichende Farbkontraste oder eine unstrukturierte Überschriftenhierarchie.

Diese automatisierten Prüfungen liefern jedoch nur einen Teil des Bildes. Deshalb ist ein manueller Screenreader-Test unerlässlich: Nur so lässt sich feststellen, ob die Inhalte in der tatsächlichen Nutzererfahrung – etwa mittels NVDA, JAWS oder VoiceOver – logisch und verständlich vorgelesen werden. Alle gefundenen Schwachstellen werden systematisch dokumentiert, um daraus einen konkreten Maßnahmenplan abzuleiten. Dieser strukturierte Prozess bildet die Basis für alle weiteren Optimierungen.

Das IFDB – Institut für digitale Barrierefreiheit steht dir dabei als kompetenter Partner zur Seite: Mit gezielten Workshops, externen Audits und kontinuierlichem Support sorgst du dafür, dass deine Website nicht nur den gesetzlichen Anforderungen entspricht, sondern auch für alle Nutzergruppen echten Mehrwert bietet.

Dieser Auszug zeigt beispielhaft, wie der Leitfaden den gesamten Prozess von der ersten Analyse bis zur finalen Umsetzung strukturiert und verständlich darstellt – und hebt zugleich die Unterstützung durch das IFDB – Institut für digitale Barrierefreiheit hervor. Wenn du weitere Textauszüge oder Anpassungen benötigst, lass es mich gerne wissen.