Zum Inhalt springen
OAwebagentur
Barrierefreiheit

Eine Website, die alle bedienen können

Barrierefrei heißt: Deine Seite funktioniert auch dann, wenn jemand sie nur mit der Tastatur bedient, den Text auf 200 Prozent vergrößert oder sie sich vorlesen lässt. Das ist Handwerk – kein Zusatzmodul, das man am Ende dazukauft.

Worum es geht

Barrierefreiheit ist kein Modul, das man nachrüstet

Barrierefreiheit klingt nach Vorschrift, Aufwand und einem Extra-Posten im Angebot. In der Praxis ist sie vor allem sauber gebautes Frontend. Die meisten Barrieren entstehen nicht, weil jemand sie absichtlich einbaut, sondern weil im Bauprozess niemand darauf geachtet hat: ein heller Grauton, der auf dem Monitor im Büro elegant wirkt und auf dem Handy in der Sonne verschwindet. Ein Aufklapp-Menü, das nur auf einen Mausklick reagiert. Ein Bild, das die eigentliche Kernaussage trägt und im Quelltext ohne Beschreibung bleibt.

Betroffen ist dabei ein deutlich größerer Kreis, als die meisten vermuten. Es geht nicht nur um blinde Menschen mit Screenreader. Es geht um eingeschränktes Sehvermögen und Farbfehlsichtigkeit, um motorische Einschränkungen, bei denen die Maus nicht präzise zu führen ist, um Hörbeeinträchtigung bei Videos, um Konzentrations- und Leseschwierigkeiten – und schlicht um alle, die älter werden. Dazu kommt die Situation: grelles Sonnenlicht, ein gebrochener Arm, ein Kleinkind auf dem Schoß, eine laute Umgebung, ein schwaches Netz. Barrierefreiheit ist deshalb kein Sonderfall, sondern der Normalfall unter schlechteren Bedingungen.

Der internationale Referenzrahmen dafür heißt WCAG – Web Content Accessibility Guidelines, herausgegeben vom W3C. Die Anforderungen sind in drei Stufen sortiert: A (Basis), AA (der praktische Maßstab) und AAA (sehr weitgehend, für ganze Websites selten realistisch). In Europa ist AA die Messlatte, auf die sich Normen und Gesetze beziehen. Die aktuelle Fassung ist WCAG 2.2; sie baut auf WCAG 2.1 auf und ergänzt sie um weitere Erfolgskriterien, unter anderem für Bedienung per Touch und für Anmeldevorgänge.

Wir schreiben die Kriterien hier bewusst in normalem Deutsch auf statt in Normsprache. Wer verstanden hat, worum es geht, trifft im Projekt die richtigen Entscheidungen – und braucht die Norm nur noch zum Nachschlagen.

WCAG 2.2 AA in verständlich

Woran du eine barrierefreie Website tatsächlich erkennst

Diese sechs Punkte decken den Großteil dessen ab, was in echten Audits auffällt. Sie sind keine vollständige Wiedergabe der Norm, aber sie sind die Stellen, an denen Websites in der Praxis scheitern.

Kontrast, der auch draußen trägt

Text muss sich deutlich genug vom Hintergrund abheben – WCAG AA verlangt für normalen Fließtext ein Kontrastverhältnis von mindestens 4,5:1, für große Schrift 3:1. Betroffen sind meistens hellgraue Hinweistexte, Platzhalter in Formularfeldern und Text auf Fotos. Zweite Regel im selben Zusammenhang: Farbe darf nie die einzige Information sein. Ein rot umrandetes Feld ohne Fehlertext hilft niemandem, der Rot nicht als Rot sieht.

Alles ohne Maus bedienbar

Jede Funktion muss sich mit der Tastatur erreichen und auslösen lassen: Tab weiter, Umschalt+Tab zurück, Enter und Leertaste aktivieren. Klassische Stolperstellen sind Slider, Dropdowns und Overlays, die per JavaScript gebaut wurden. Besonders ärgerlich sind Tastaturfallen – ein geöffnetes Fenster, aus dem man ohne Maus nicht mehr herauskommt. Der Test kostet zwei Minuten: Maus weglegen und durch die Seite tabben.

Sichtbarer Fokus in logischer Reihenfolge

Wer mit der Tastatur navigiert, muss jederzeit sehen, wo er gerade ist. Der Fokusrahmen darf deshalb nicht per CSS entfernt werden, nur weil er im Design stört – er wird gestaltet, nicht abgeschaltet. Genauso wichtig ist die Reihenfolge: Der Fokus soll dem laufen, was man sieht, und nicht durch die Seite springen, weil Blöcke per CSS umsortiert wurden.

Alternativtexte, die etwas aussagen

Jedes Bild, das Information transportiert, braucht eine Textalternative, die diese Information ersetzt – nicht den Dateinamen und nicht das Wort „Bild". Ein Foto vom Team beschreibt man knapp; eine Grafik mit Zahlen gibt die Zahlen wieder. Rein dekorative Bilder bekommen bewusst ein leeres alt-Attribut, damit der Screenreader sie überspringt. Für Videos gehören Untertitel dazu, für reine Tonaufnahmen ein Transkript.

Struktur, die auch ohne Layout funktioniert

Überschriften sind eine Gliederung, keine Schriftgröße: eine H1 pro Seite, danach H2 und H3 in echter Hierarchie, ohne Ebenen zu überspringen. Listen sind Listen, Tabellen haben Kopfzellen, Bereiche wie Navigation, Hauptinhalt und Fußzeile sind als solche ausgezeichnet. Ein Screenreader liest genau diese Struktur vor – ist sie sauber, springt man in Sekunden zum Ziel; fehlt sie, hört man die Seite von vorn.

Formulare, die Fehler erklären

Jedes Eingabefeld braucht ein sichtbares, dauerhaft verknüpftes Label – ein Platzhalter reicht nicht, weil er beim Tippen verschwindet. Fehler werden im Klartext benannt und dort ausgegeben, wo sie entstanden sind: nicht „ungültige Eingabe", sondern welches Feld welches Format erwartet. Und die Seite muss sich auf 200 Prozent vergrößern lassen, ohne dass Inhalte abgeschnitten werden oder man waagerecht scrollen muss.

Auch ohne Pflicht

Warum sich der Aufwand rechnet, selbst wenn du nicht betroffen bist

Ein großer Teil der Websites in Deutschland fällt gar nicht unter das BFSG – reine Informationsseiten ohne Vertragsschluss zum Beispiel. Trotzdem lohnt sich die Arbeit, und zwar aus Gründen, die nichts mit Paragrafen zu tun haben.

Suchmaschinen lesen wie Screenreader

Sauber gesetzte Überschriften, sprechende Linktexte, beschreibende Alternativtexte, eine klare Dokumentstruktur: Das ist dieselbe Information, die auch ein Crawler auswertet. Barrierefreiheit ist kein Ranking-Faktor, den man ankreuzt – aber die Maßnahmen überschneiden sich mit technischem SEO so stark, dass man beides ohnehin zusammen macht.

Deine Zielgruppe wird älter

Nachlassende Sehkraft, weniger präzise Feinmotorik, mehr Bedienung per Zoom: Das trifft irgendwann fast jeden. Wenn deine Kundschaft im mittleren oder höheren Alter ist, entscheidet die Lesbarkeit deiner Seite direkt darüber, ob eine Anfrage abgeschickt wird oder jemand entnervt abbricht.

Rechtssicherheit, bevor es akut wird

Der Anwendungsbereich des BFSG ist an Vertragsschluss gekoppelt. Eine Informationsseite ist heute vielleicht außen vor – sobald aber ein Shop, eine Online-Buchung oder ein Bezahlvorgang dazukommt, ändert sich die Lage. Wer von Anfang an sauber baut, muss dann nichts nachrüsten.

Es ist schlicht die bessere Website

Ausreichender Kontrast, verständliche Beschriftungen, verlässliche Tastaturbedienung, klare Fehlermeldungen – nichts davon ist ein Zugeständnis an eine Minderheit. Das sind Qualitätsmerkmale, die jede Besucherin und jeder Besucher spürt, auch ohne den Begriff „barrierefrei" zu kennen.

Rechtlicher Rahmen

Wo die Pflicht herkommt – in drei Sätzen

Grundlage ist die Richtlinie (EU) 2019/882, der European Accessibility Act. Deutschland hat sie mit dem Barrierefreiheitsstärkungsgesetz (BFSG) und der zugehörigen Verordnung (BFSGV) umgesetzt; beide gelten seit dem 28. Juni 2025.

Für den Web-Bereich ist vor allem eine Kategorie relevant: „Dienstleistungen im elektronischen Geschäftsverkehr". Damit sind laut § 2 Nummer 26 BFSG digitale Dienste gemeint, die über Websites und mobile Apps angeboten und elektronisch auf individuelle Anfrage einer Verbraucherin oder eines Verbrauchers im Hinblick auf den Abschluss eines Verbrauchervertrags erbracht werden. Für Dienstleistungen gibt es zudem eine Ausnahme für Kleinstunternehmen (§ 3 Absatz 3 BFSG).

Wer genau betroffen ist, ab wann, mit welchen Ausnahmen und was bei Verstößen droht, steht ausführlich und mit Quellenangaben auf der Unterseite zur BFSG-Pflicht. Was dort gilt, prüfen wir im BFSG-Check konkret an deiner Seite.

Weiterlesen

Pflicht klären, Zustand prüfen

Jetzt anfragen
Passend dazu

Barrierefreiheit entsteht im Entwurf und in der Umsetzung

Nachträglich eingebaute Barrierefreiheit ist teuer und bleibt oft Flickwerk. Deutlich günstiger ist es, die Kriterien dort zu berücksichtigen, wo die Entscheidungen ohnehin fallen: im Design und im Code. Beides machen wir selbst – deshalb landet das Thema bei uns nicht zwischen zwei Dienstleistern.

Wichtig
Keine Rechtsberatung

Wir sind eine Webagentur, keine Rechtsanwaltskanzlei. Dieser Text gibt den Stand unserer Recherche vom 26. Juli 2026 wieder und ersetzt keine Rechtsberatung. Ob und wie das BFSG auf deinen konkreten Fall zutrifft, klärst du verbindlich nur mit einer Anwältin oder einem Anwalt.

Stand der Angaben: 26. Juli 2026

Bereit für Ihren neuen Auftritt?

Erzählen Sie uns kurz von Ihrem Projekt – wir melden uns mit einer ehrlichen Einschätzung.

Projekt anfragen