Eine barrierefreie Website kann jeder Mensch nutzen: mit Maus oder nur mit der Tastatur, mit Screenreader, mit starker Vergrößerung, mit Farbsehschwäche oder einfach mit dem Smartphone im Sonnenlicht. Für viele Unternehmen ist Barrierefreiheit seit dem Barrierefreiheitsstärkungsgesetz auch eine Pflicht. Aber selbst wo das Gesetz nicht greift, lohnt sie sich: Du erreichst mehr Menschen, deine Website wird für alle leichter bedienbar, und Suchmaschinen verstehen deine Inhalte besser. In diesem Leitfaden erfährst du, welche Regeln gelten, worauf es technisch ankommt und wie du deine Website mit unserer Checkliste selbst prüfst.
Was ist eine barrierefreie Website?
Eine barrierefreie Website ist so gestaltet und programmiert, dass Menschen mit und ohne Behinderung sie ohne fremde Hilfe wahrnehmen, verstehen und bedienen können. Das betrifft das Design, etwa Kontraste und Schriftgrößen, die Inhalte, etwa verständliche Sprache und Untertitel, und vor allem den Code dahinter: Überschriften, Beschriftungen und Bedienelemente müssen so ausgezeichnet sein, dass Hilfsmittel wie Screenreader sie richtig vorlesen.
Oft fällt auch der Begriff barrierearm. Er ist ehrlicher, weil eine Website selten für jeden Menschen in jeder Situation vollständig barrierefrei ist. Das Ziel bleibt aber dasselbe: so wenige Hürden wie möglich.
Wer von Barrierefreiheit profitiert
Laut Statistischem Bundesamt lebten Ende 2025 gut 7,8 Millionen schwerbehinderte Menschen in Deutschland, das entspricht 9,4 % der Bevölkerung. Gut 91 % der Behinderungen sind durch eine Krankheit entstanden, nur ein kleiner Teil ist angeboren. Rund 79 % der schwerbehinderten Menschen sind 55 Jahre oder älter. Dazu kommen viele Menschen ohne amtlich festgestellte Behinderung, die trotzdem profitieren:
- Ältere Menschen mit nachlassender Sehkraft oder zitternden Händen.
- Menschen mit vorübergehenden Einschränkungen, etwa mit gebrochenem Arm oder nach einer Augen-OP.
- Menschen in schwierigen Situationen, etwa mit dem Smartphone in der Sonne, in einer lauten Umgebung ohne Ton oder mit langsamer Verbindung.
- Menschen mit wenig Deutschkenntnissen, die von klarer, einfacher Sprache profitieren.
Wie barrierefrei sind Websites heute?
Die US-Organisation WebAIM prüft jedes Jahr die Startseiten der eine Million meistbesuchten Websites automatisch auf Barrieren. Das Ergebnis der Auswertung vom Februar 2026 ist ernüchternd: Auf 95,9 % der Startseiten fand das Prüfwerkzeug Fehler gegen die WCAG, im Schnitt 56,1 Fehler pro Seite. Die gute Nachricht steckt in den Details: Fast alle Fehler fallen in sechs Kategorien, die sich vergleichsweise leicht beheben lassen.
Wichtig zur Einordnung: Automatische Tests finden nur einen Teil der Barrieren. Ob ein Alt-Text sinnvoll ist oder ob sich ein Menü logisch per Tastatur bedienen lässt, kann nur ein Mensch beurteilen. Die tatsächliche Zahl der Probleme dürfte also eher höher liegen.
Die Regeln: WCAG, EN 301 549, BITV und BFSG
Rund um barrierefreie Websites begegnen dir vier Abkürzungen. Sie bauen aufeinander auf.
WCAG: der internationale Standard
Die Web Content Accessibility Guidelines des World Wide Web Consortium (W3C) sind die Grundlage aller Regeln. Die aktuelle Version 2.2 enthält Erfolgskriterien in drei Stufen: A (Grundanforderungen), AA (der übliche Maßstab) und AAA (höchste Stufe). Gesetze und Normen verlangen in der Regel die Stufen A und AA. Gegenüber der Vorversion 2.1 kamen unter anderem Kriterien zu Mindestgrößen für Klickflächen, zu sichtbarem Fokus und zu barrierefreien Anmeldungen hinzu.
EN 301 549: die europäische Norm
Die europäische Norm EN 301 549 übersetzt die WCAG in einen verbindlichen technischen Maßstab für Europa. Derzeit gilt die Fassung V3.2.1, die auf WCAG 2.1 aufbaut. Die neue Fassung V4.1.1 wurde im September 2026 veröffentlicht und verweist auf WCAG 2.2. Rechtlich maßgeblich wird sie erst, wenn die EU-Kommission sie im Amtsblatt bekannt gibt. Das ist laut der irischen Behörde für Barrierefreiheit für Dezember 2026 vorgesehen. Wer heute neu baut, orientiert sich deshalb am besten gleich an WCAG 2.2.
Wer gesetzlich verpflichtet ist
| Wer | Gesetz | Pflicht zur Barrierefreiheit |
|---|---|---|
| Öffentliche Stellen des Bundes | BITV 2.0 | Ja, für Websites und Apps |
| Unternehmen, bei denen Verbraucher online einen Vertrag abschließen, etwa im Shop oder bei einer Buchung mit Bezahlung | BFSG | Ja, seit dem 28. Juni 2025 |
| Kleinstunternehmen mit Dienstleistungen (unter 10 Beschäftigte und höchstens 2 Mio. € Jahresumsatz oder Bilanzsumme) | BFSG | Nein, ausgenommen |
| Reine Präsentations-Website ohne Vertragsabschluss | BFSG | In der Regel nein |
| Angebote ausschließlich für Unternehmen (B2B) | BFSG | Nein |
Für die Bundesländer gelten eigene Landesgesetze für öffentliche Stellen. Die Einordnung privater Websites beruht auf dem Gesetz und den Hinweisen des Zentralverbands des Deutschen Handwerks. Grenzfälle wie Terminbuchungen solltest du im Einzelfall prüfen lassen. Bei Verstößen gegen das BFSG sind Bußgelder von bis zu 100.000 Euro möglich, dazu kommt das Risiko von Abmahnungen.
Die vier Prinzipien in der Praxis
Die WCAG ordnen alle Anforderungen vier Prinzipien zu. Sie sind ein guter Leitfaden, um eine Website zu verstehen, ohne jedes einzelne Kriterium auswendig zu kennen.
1. Wahrnehmbar
Alle Inhalte müssen über mindestens einen Sinn erfassbar sein. Bilder brauchen einen Alternativtext, der beschreibt, was zu sehen ist oder welche Funktion das Bild hat. Videos brauchen Untertitel. Text braucht genug Kontrast zum Hintergrund: Laut WCAG mindestens 4,5 zu 1 für normalen Text und 3 zu 1 für großen Text. Hellgraue Schrift auf weißem Grund fällt fast immer durch.
2. Bedienbar
Alles, was mit der Maus geht, muss auch mit der Tastatur gehen: Menüs öffnen, Formulare ausfüllen, Pop-ups schließen. Beim Navigieren mit der Tab-Taste muss immer sichtbar sein, wo man sich gerade befindet. Klickflächen sollten groß genug sein, damit man sie auch mit zitternder Hand oder auf dem Smartphone sicher trifft. Automatisch laufende Slider oder Animationen sollten sich anhalten lassen.
3. Verständlich
Texte sind klar und ohne unnötigen Fachjargon formuliert. Die Navigation ist auf allen Seiten gleich aufgebaut. Formulare erklären, was einzutragen ist, und Fehlermeldungen sagen konkret, was falsch ist und wie man es korrigiert. Die Sprache der Seite ist im Code angegeben, damit ein Screenreader den Text richtig ausspricht.
4. Robust
Der Code ist sauber und folgt den Standards, sodass Browser und Hilfsmittel ihn zuverlässig auslesen. Überschriften sind echte Überschriften und nicht nur fett formatierter Text. Buttons sind Buttons, Links sind Links, und jedes Bedienelement hat einen verständlichen Namen. Genau hier scheitern viele Baukasten-Websites, weil sie Elemente verschachteln, die zwar richtig aussehen, aber falsch ausgezeichnet sind.
Barrierefreie Website: Checkliste mit 20 Prüfpunkten
Mit dieser Checkliste prüfst du die wichtigsten Punkte selbst. Sie ersetzt keinen vollständigen Test nach WCAG, deckt aber die häufigsten Barrieren ab.
Checkliste: Struktur, Inhalte und Bedienung
| Bereich | Prüfpunkt |
|---|---|
| Struktur | Jede Seite hat genau eine Hauptüberschrift, darunter eine logische Gliederung ohne übersprungene Ebenen. |
| Struktur | Die Seitensprache ist im Code angegeben. |
| Struktur | Jede Seite hat einen eindeutigen, beschreibenden Seitentitel. |
| Struktur | Navigation und Aufbau sind auf allen Seiten einheitlich. |
| Bilder und Medien | Informative Bilder haben einen aussagekräftigen Alt-Text, rein dekorative Bilder einen leeren. |
| Bilder und Medien | Videos haben Untertitel, wichtige Audioinhalte eine Textfassung. |
| Bilder und Medien | Text steht als echter Text auf der Seite und nicht als Bild. |
| Farbe und Text | Text hat mindestens 4,5 zu 1 Kontrast, große Schrift mindestens 3 zu 1. |
| Farbe und Text | Informationen werden nie nur über Farbe vermittelt, etwa bei Pflichtfeldern oder Fehlern. |
| Farbe und Text | Die Seite bleibt bei 200 % Zoom lesbar und bedienbar. |
| Bedienung | Alle Funktionen lassen sich nur mit der Tastatur erreichen und auslösen. |
| Bedienung | Der Tastaturfokus ist immer deutlich sichtbar und wird nicht verdeckt. |
| Bedienung | Die Reihenfolge beim Tabben folgt dem Aufbau der Seite. |
| Bedienung | Cookie-Hinweise und Pop-ups lassen sich per Tastatur bedienen und schließen. |
| Bedienung | Klickflächen sind ausreichend groß und nicht zu dicht beieinander. |
| Links und Buttons | Linktexte sagen, wohin sie führen, statt nur „hier klicken“. |
| Links und Buttons | Buttons mit Symbol, etwa ein Lupen- oder Menü-Icon, haben einen verständlichen Namen für Screenreader. |
| Formulare | Jedes Feld hat eine sichtbare Beschriftung, nicht nur einen Platzhaltertext. |
| Formulare | Fehlermeldungen benennen das Feld und erklären, wie man den Fehler behebt. |
| Inhalte | Texte sind klar formuliert, Fachbegriffe werden erklärt. |
So testest du deine Website selbst in 5 Schritten
- Automatischer Schnelltest: Kostenlose Werkzeuge wie WAVE von WebAIM oder Lighthouse in den Chrome-Entwicklertools zeigen typische Fehler wie fehlende Alt-Texte, zu geringen Kontrast oder leere Links. Das ist der schnellste Einstieg.
- Tastaturtest: Leg die Maus zur Seite und bediene deine Website nur mit Tab, Umschalt plus Tab, Enter und den Pfeiltasten. Erreichst du jedes Menü, jeden Button und jedes Formularfeld? Siehst du immer, wo du gerade bist?
- Zoomtest: Vergrößere die Ansicht im Browser auf 200 %. Text darf nicht abgeschnitten werden, nichts darf überlappen.
- Screenreader-Test: Mit NVDA unter Windows oder VoiceOver auf dem Mac und dem iPhone hörst du, wie deine Seite vorgelesen wird. Werden Überschriften, Links und Buttons sinnvoll angesagt?
- Kontrastprüfung: Prüfe die Farben deiner Marke mit einem Kontrastrechner, bevor du sie für Text einsetzt. So vermeidest du den mit Abstand häufigsten Fehler.
Diese Tests geben dir einen guten ersten Eindruck. Wenn deine Website unter das BFSG fällt, ist ein professioneller Test nach WCAG die sichere Wahl.
Barrierefreiheit und SEO: zwei Ziele, ein Weg
Barrierefreiheit und Suchmaschinenoptimierung überschneiden sich stark. Suchmaschinen lesen eine Website ähnlich wie ein Screenreader: Sie sehen keine Gestaltung, sondern Code und Text. Was Menschen mit Hilfsmitteln hilft, hilft deshalb auch Google:
- Saubere Überschriften zeigen Google, worum es auf der Seite geht.
- Alt-Texte machen Bilder für die Bildersuche verständlich.
- Aussagekräftige Linktexte erklären, worum es auf der verlinkten Seite geht.
- Klare Sprache verbessert die Lesbarkeit und damit die Nutzersignale.
- Schnelle, schlanke Seiten sind gut für alle, besonders mobil. Mehr dazu im Ratgeber zu responsivem Webdesign.
Wer seine Website barrierefrei aufbaut, erledigt damit einen großen Teil der technischen SEO-Grundlagen gleich mit. Welche weiteren Punkte für Google wichtig sind, zeigt die SEO-Checkliste.
Warum ein Overlay-Plugin nicht reicht
Manche Anbieter versprechen Barrierefreiheit per Knopfdruck: Ein Skript blendet eine Leiste mit Schriftvergrößerung, Kontrastmodus und Vorlesefunktion ein. Das klingt verlockend, löst aber das Grundproblem nicht. Fehlende Formular-Beschriftungen, falsch ausgezeichnete Überschriften oder Menüs, die sich nicht per Tastatur bedienen lassen, stecken im Code der Website. Ein nachträglich eingeblendetes Werkzeug kann diese Ursachen nicht zuverlässig beheben. Viele Menschen mit Behinderung nutzen außerdem eigene Hilfsmittel, mit denen solche Leisten sogar kollidieren können. Barrierefreiheit entsteht im Design und im Code, nicht in einem Zusatzprogramm.
Neue Website oder bestehende nachbessern?
Ob sich das Nachbessern lohnt, hängt vor allem vom technischen Zustand deiner Website ab:
- Nachbessern lohnt sich, wenn die Website sauber aufgebaut ist und die Probleme vor allem bei Inhalten liegen: fehlende Alt-Texte, schwache Kontraste, unklare Linktexte. Das kannst du oft selbst oder mit wenig Aufwand beheben.
- Eine neue Website ist sinnvoller, wenn die Probleme im Grundgerüst stecken: verschachtelter Code aus einem Page-Builder, Menüs ohne Tastaturbedienung, ein Theme ohne saubere Überschriftenstruktur. Dann kostet jeder Flicken viel Zeit, und das Ergebnis bleibt Stückwerk.
Wenn ohnehin ein Relaunch ansteht, plane Barrierefreiheit von Anfang an ein. Das ist deutlich günstiger als ein späterer Umbau. Ein schlanker, sauber programmierter Aufbau, etwa als statische Website, macht es leichter, die Anforderungen dauerhaft einzuhalten. Und denk an die laufende Pflege: Jede neue Seite, jedes neue Bild und jedes neue Formular muss die Anforderungen ebenfalls erfüllen.
Barrierefreie Inhalte pflegen: 5 Regeln für den Alltag
Die beste Technik nützt wenig, wenn neue Inhalte die Barrieren wieder einbauen. Diese Regeln solltest du allen mitgeben, die Texte und Bilder auf deiner Website einpflegen:
- Alt-Text bei jedem Bild: Beschreibe in einem Satz, was das Bild zeigt und warum es da ist. „Team beim Aufbau der Messewand“ statt „Bild1“.
- Überschriften über die Formatvorlage: Wähle Überschriften im Editor als Überschrift aus, statt Text nur fett und groß zu machen.
- Sprechende Links: Verlinke den Begriff, um den es geht, etwa „unsere Öffnungszeiten“, und nicht „hier“.
- Keine Texte in Bildern: Angebote, Termine oder Preise gehören als Text auf die Seite, nicht in eine Grafik.
- PDFs prüfen: Neue Dokumente zum Download sollten ebenfalls barrierefrei sein oder die Inhalte zusätzlich als Text auf der Seite stehen.
Fazit: Barrierefreiheit ist gute Qualität
- Eine barrierefreie Website ist für alle Menschen nutzbar, auch mit Tastatur, Screenreader oder starker Vergrößerung.
- Maßstab sind die WCAG in der Stufe AA, technisch umgesetzt über die Norm EN 301 549.
- Das BFSG verpflichtet seit Juni 2025 viele Unternehmen mit Online-Verträgen für Verbraucher, Kleinstunternehmen mit Dienstleistungen sind ausgenommen.
- Die häufigsten Barrieren sind Kontraste, fehlende Alt-Texte, unbeschriftete Formulare und leere Links oder Buttons.
- Barrierefreiheit und SEO gehen Hand in Hand, ein Overlay-Plugin ersetzt keinen sauberen Code.
Mein Rat: Prüf deine Website heute mit dem Tastaturtest und einem kostenlosen Prüfwerkzeug. Das dauert eine halbe Stunde und zeigt dir die größten Hürden. Kontraste, Alt-Texte und Formular-Beschriftungen kannst du meist schnell verbessern. Und wenn eine neue Website ansteht, mach Barrierefreiheit zur Anforderung von Anfang an.
Quellen
- W3C: Web Content Accessibility Guidelines (WCAG) 2.2
- WebAIM: The WebAIM Million 2026 (Stand 30.03.2026)
- Statistisches Bundesamt: 7,8 Millionen schwerbehinderte Menschen leben in Deutschland (13.07.2026)
- National Disability Authority Irland: EN 301 549 V4.1.1 published (September 2026)
- Barrierefreiheitsstärkungsgesetz (BFSG), gesetze-im-internet.de
- Barrierefreie-Informationstechnik-Verordnung (BITV 2.0), gesetze-im-internet.de
- ZDH: Praxis Recht, Barrierefreiheit von Webseiten (Stand 18.08.2026)
