Was ist Barrierefreiheit im Web?

Eine barrierefreie Website lässt mehrere Formen der Nutzung zu. Dieselbe Seite muss mit einem Screenreader funktionieren, mit auf 200 % vergrößertem Text, ohne Maus, mit eingeschalteten Untertiteln oder mit veränderten Systemfarben. Die Einschränkung ist auch nicht immer dauerhaft: eine vorübergehende Verletzung, ein Bildschirm in der Sonne oder eine laute Umgebung erzeugen für eine Weile sehr ähnliche Hürden.

Die internationalen Richtlinien ordnen sämtliche technischen Kriterien vier Prinzipien zu.

• Wahrnehmbar: Die Information muss über mehr als einen Sinneskanal ankommen, damit wer ein Bild nicht sieht dessen Beschreibung erhält und wer ein Video nicht hört dessen Untertitel lesen kann.
• Bedienbar: Die Oberfläche muss sich per Tastatur, per Sprache oder mit einem Hilfsmittel steuern lassen, ohne präzise Gesten und ohne starre Zeitvorgaben.
• Verständlich: Sprache, Reihenfolge der Schritte und Fehlermeldungen müssen vorhersehbar sein und erklären, was passiert ist.
• Robust: Der Code muss von Browsern und assistiven Technologien verlässlich ausgewertet werden, von den heutigen ebenso wie von künftigen.

Jedes Prinzip wird in überprüfbaren Erfolgskriterien konkret, und jedes Kriterium trägt eine Stufe. Genau dieser Teil lässt sich prüfen und dokumentieren.

Die technische Referenz sind die Web Content Accessibility Guidelines, kurz WCAG. Die geltende Fassung ist WCAG 2.2, im Oktober 2023 als W3C-Empfehlung veröffentlicht und im Dezember 2024 aktualisiert. Ihre Kriterien verteilen sich auf drei Konformitätsstufen: A als Minimum, AA als mittlere Stufe und AAA als strengste. Rechtstexte stützen sich meist auf Stufe AA, weil AAA nicht für jede Art von Inhalt erreichbar ist.

In Europa ist die normative Übersetzung dieser Richtlinien die harmonisierte Norm EN 301 549 über Barrierefreiheitsanforderungen an IKT-Produkte und -Dienstleistungen. Ihre aktuelle Fassung verweist auf WCAG 2.1 in Stufe AA.

Der European Accessibility Act, die Richtlinie (EU) 2019/882, gilt seit dem 28. Juni 2025. Er erfasst bestimmte Produkte und Dienstleistungen für Verbraucher: elektronischen Handel, Bankdienstleistungen für Verbraucher, E-Books, elektronische Kommunikationsdienste, den Zugang zu audiovisuellen Mediendiensten sowie digitale Bestandteile des Personenverkehrs mit Flugzeug, Bahn, Schiff und Bus. In Deutschland setzt das Barrierefreiheitsstärkungsgesetz (BFSG) dieselbe Richtlinie um und gilt seit demselben Datum. Spanien hat sie mit der Ley 11/2023 umgesetzt, deren Titel I an eben diesem Tag in Kraft trat. Kleinstunternehmen, die Dienstleistungen erbringen, sind von diesen Barrierefreiheitsanforderungen ausgenommen; als Kleinstunternehmen gilt nach dem Gesetz ein Unternehmen mit weniger als zehn Beschäftigten und einem Jahresumsatz oder einer Jahresbilanzsumme von höchstens zwei Millionen Euro.

Für den spanischen öffentlichen Sektor gilt eine ältere Regelung, das Real Decreto 1112/2018. Es verpflichtet dazu, eine Barrierefreiheitserklärung zu veröffentlichen und einen Rückmeldekanal für Beschwerden und Anregungen anzubieten. Ob ein konkreter Fall in den einen oder den anderen Anwendungsbereich fällt, hängt von der Art der Dienstleistung, vom Adressaten und von der Größe der Organisation ab, und diese Bewertung gehört in eine juristische Einzelfallprüfung.

Von der Barrierefreiheit hängt etwas sehr Konkretes ab: ob jemand einen Kauf abschließen, ein Konto eröffnen oder einen Termin buchen kann, ohne fremde Hilfe. Ein Formular, dessen Felder keine zugeordnete Beschriftung tragen, lässt sich mit einem Screenreader nicht ausfüllen, und an dieser Stelle bricht der Vorgang vollständig ab.

Sie wiegt auch bei Vergabeentscheidungen. Ausschreibungsunterlagen der öffentlichen Hand enthalten Barrierefreiheitsanforderungen, und in großen privaten Ausschreibungen wird häufig ein Nachweis über die erreichte Stufe verlangt. Eine Prüfung nach überprüfbaren Kriterien beantwortet solche Fragen mit Belegen statt mit einer Absichtserklärung.

Der Bezug zum SEO besteht, er will aber sorgfältig formuliert sein. Barrierefreiheit ist kein Rankingfaktor. Was zutrifft: Mehrere Praktiken überschneiden sich. Alternativtexte beschreiben ein Bild für den Screenreader und ebenso für die Suchmaschine, eine korrekte Überschriftenhierarchie hilft beiden dabei, die Struktur des Dokuments zu erfassen, und semantisches Markup macht die Rolle jedes Elements explizit. Diese Überschneidung ist real, und sie macht Barrierefreiheit zu einer Arbeit, die sich mit SEO verträgt, nicht zu einem Ranking-Hebel.

• Alternativtexte nach Funktion: Beschreibe, was das Bild im jeweiligen Kontext beiträgt. Ist es dekorativ, verhindert ein leeres alt-Attribut, dass der Screenreader es ansagt; ist es ein Link oder ein Button, beschreibt der Alternativtext das Ziel oder die Aktion.
• Ausreichender Kontrast: Stufe AA verlangt ein Kontrastverhältnis von mindestens 4,5:1 für normalen Text und 3:1 für großen Text sowie 3:1 für die Ränder von Bedienelementen und grafischen Objekten.
• Vollständige Tastaturbedienung: Geh die Seite mit der Tabulatortaste durch. Der Fokus muss immer sichtbar sein, einer logischen Reihenfolge folgen und darf in Menüs, Karussells oder modalen Fenstern nicht hängen bleiben.
• Zugeordnete Formularbeschriftungen: jedes Feld mit sichtbarer Beschriftung, verknüpft über label und for. Fehler werden im Text beschrieben, mit Angabe des betroffenen Feldes und der Korrektur, nicht allein über die Farbe Rot.
• Echte Überschriftenhierarchie: eine h1 pro Seite und darunter fortlaufende Ebenen ohne Sprünge. Überschriften strukturieren das Dokument, die Schriftgröße wird im Stylesheet entschieden.
• Vergrößerbarer Text und Alternativen für Zeitmedien: Der Inhalt muss bei einer Textvergrößerung auf 200 % lesbar und nutzbar bleiben, Videos brauchen Untertitel und Audios ein Transkript.

• Generisches alt-Attribut: Werte wie «Bild», «Foto» oder der Dateiname besetzen den Platz der eigentlichen Beschreibung und liefern keine Information.
• Schwacher Kontrast bei Nebenelementen: Hilfetexte, Platzhalter in Eingabefeldern und deaktivierte Zustände liegen häufig unter dem geforderten Mindestwert.
• Bedienelemente aus div und span: Tabs, Aufklappmenüs oder Auswahlfelder ohne zugängliche Rolle, Bezeichnung und Zustände teilen einem Hilfsmittel nichts mit, auch wenn sie mit der Maus funktionieren.
• Aus Designgründen entfernter Fokus: Wer die Fokusumrandung per outline: none abschaltet, nimmt der Tastaturbedienung ihren visuellen Anhaltspunkt.
• Verlass allein auf die automatische Prüfung: Ein Prüfwerkzeug erkennt einen Teil der Kriterien, etwa den Kontrast oder fehlende Attribute. Der Rest verlangt manuelle Kontrolle, und ein guter Werkzeugwert ist noch keine Konformität.