Sehbehinderung & Blindheit: So nutzen Betroffene das Web

Sehbeeinträchtigung ist ein Spektrum, kein Schalter: Der weit größere Teil der Betroffenen ist nicht blind, sondern sieht unscharf, ausschnitthaft, blendempfindlich oder farbverschoben – amtlich erfasst sind in Deutschland 558.725 Menschen, die realistische Zahl liegt deutlich höher. Für Websites folgt daraus keine Sonderbehandlung, sondern vier handfeste Anforderungen: ausreichender Kontrast, verlustfreie Vergrößerung, Textalternativen und eine Struktur, die im Markup steckt statt nur in der Optik.

Das Wichtigste in Kürze

• Amtlich erfasst (Schwerbehindertenstatistik, Stand 31.12.2021): 71.260 blinde, 46.820 hochgradig sehbehinderte und 440.645 sehbehinderte Menschen – zusammen 558.725. Der DBSV nennt das eine „gesicherte untere Grenze“, weil längst nicht alle Betroffenen einen Schwerbehindertenausweis beantragen.
• Blind im Rechtssinn ist, wer auf dem besseren Auge mit Korrektur höchstens 1/50 (0,02) Sehschärfe erreicht – oder ein entsprechend stark eingeschränktes Gesichtsfeld hat. Sehbehindert beginnt bei weniger als 1/3 (0,3).
• Rund 8 % der Männer und 0,5 % der Frauen haben eine Farbsinnstörung, meist eine Rot-Grün-Schwäche. Das ist kein Sehen in Graustufen, sondern das Zusammenfallen bestimmter Farbpaare.
• Häufigster automatisch messbarer Fehler im Web überhaupt: zu geringer Textkontrast – auf 83,9 % von einer Million untersuchten Startseiten, im Schnitt 34 Stellen pro Seite (WebAIM Million, Februar 2026).
• Wer stark vergrößert, sieht die Seite wie durch ein Fernglas. Weit auseinanderliegende Bezüge – Feld links, Fehlermeldung rechts oben – fallen dabei auseinander.
• Die Pflichtwerte: 4,5:1 für normalen Text, 3:1 für große Schrift und Bedienelemente, 200 % Textvergrößerung ohne Funktionsverlust, Umbruch bei 320 CSS-Pixeln Breite.
• Blinde Nutzer arbeiten mit Screenreader und Braillezeile und navigieren ausschließlich über die Tastatur – für sie entscheidet allein das Markup.
• Seit dem 28. Juni 2025 sind diese Anforderungen für viele private Angebote über das BFSG verpflichtend, für öffentliche Stellen schon länger über die BITV 2.0.

Das Spektrum: viel mehr als Blindheit

„Blind oder nicht blind“ ist die falsche Vorstellung – und sie führt direkt zu falschen Prioritäten. In Deutschland sind die Stufen sogar juristisch definiert, gemessen wird immer am besseren Auge mit bestmöglicher Korrektur:

Zwei Dinge fallen an dieser Tabelle auf. Erstens: Blindheit ist die kleinste der drei Gruppen. Zweitens: Auch „blind“ heißt selten „sieht nichts“. Ein großer Teil der gesetzlich blinden Menschen nimmt Hell und Dunkel wahr, manche erkennen Umrisse oder lesen mit extremer Vergrößerung noch einzelne Wörter. Im WebAIM-Survey #10 (Januar 2024) bezeichnen sich 76,6 % der Screenreader-Nutzer mit Behinderung als blind – aber 19,9 % als sehbehindert. Ein Fünftel derer, die Sprachausgabe nutzen, schaut also nebenbei auf den Bildschirm. Deshalb greifen Kontrast und Struktur bei denselben Menschen ineinander.

Dazu kommen die Gruppen, die in keiner Statistik als „behindert“ auftauchen und trotzdem denselben Anforderungen begegnen: Alterssichtigkeit ab etwa Mitte vierzig, Farbsinnstörungen bei rund 8 % der Männer, Blendempfindlichkeit nach einer Augenoperation, trockene Augen am Ende eines Bildschirmtags.

Wie sich das Surfen konkret unterscheidet

Mit starker Vergrößerung sieht man immer nur einen kleinen Ausschnitt – bei 400 % Zoom passt auf einen Full-HD-Monitor ungefähr so viel Inhalt wie auf ein Smartphone-Display. Der Blick wandert, der Kontext bleibt zurück. Wer in einem Formular das Feld „Postleitzahl“ ausfüllt und die Fehlermeldung erscheint oben rechts im Viewport, erfährt davon schlicht nichts. Details dazu stehen unter Bildschirmvergrößerung.

Mit Sehrest und hohem Kontrastbedarf wird häufig das Farbschema erzwungen: dunkler Hintergrund, große Schrift, invertierte Farben, teils der Windows-Kontrastmodus. Eine Seite, die Text in ein Hintergrundbild rendert oder Farben per !important festnagelt, bricht dabei auseinander.

Ohne Sehrest wird die Seite gehört oder ertastet. Der Screenreader springt von Überschrift zu Überschrift, listet Links, geht Formulare Feld für Feld durch – wie das im Detail abläuft, steht unter wie Screenreader-Nutzer surfen. Layout und Farbe spielen keine Rolle, Reihenfolge und Beschriftung entscheiden alles.

Alle drei brauchen dasselbe Fundament: Bezüge, die im Markup stehen und nicht nur räumlich nebeneinanderliegen. Genau das verlangt WCAG 1.3.1 „Info und Beziehungen“.

Randnotiz – der Fernglas-Test. Zoom auf 400 %, dann etwas bestellen. Nach zwei Minuten weißt du mehr über deine Seite als nach zwei Stunden Checkliste: Erscheinen Meldungen dort, wo der Blick gerade ist? Bleibt der Warenkorb erreichbar? Bricht die Seite ohne horizontales Scrollen um?

Der teuerste Fehler: zu geringer Kontrast

Kontrast ist die mit Abstand häufigste Barriere im Web – 83,9 % der Startseiten in der WebAIM Million (Februar 2026) fallen darüber, im Schnitt an 34 Stellen. Der Grund ist selten Unwissen, sondern Geschmack: Hellgraue Schrift auf Weiß sieht ruhig und modern aus. Sie ist nur eben nicht lesbar.

/* Falsch: 2,85:1 – fällt bei 1.4.3 durch, sieht im Designtool aber „luftig“ aus */
.hint { color: #999999; background: #ffffff; }

/* Richtig: 4,54:1 – das hellste Grau, das auf Weiß noch besteht */
.hint { color: #767676; background: #ffffff; }

/* Große Schrift (ab 24 px, oder ab 18,66 px fett) darf auf 3:1 runter */
.lead { font-size: 1.5rem; color: #8a8a8a; background: #ffffff; }

Die Grenzwerte im Klartext: 4,5:1 für normalen Text (1.4.3), 3:1 für große Schrift sowie für Bedienelemente und Grafiken (1.4.11). Der zweite Punkt wird ständig übersehen: Auch der Rahmen eines Eingabefeldes, der Umriss eines Icons und der Fokusring müssen 3:1 gegen ihre Umgebung erreichen. Wo deine Seite steht, zeigt der Kontrast-Check in ein paar Sekunden; die Systematik dahinter steht unter Farbkontraste.

Ich würd den Kontrast zuerst angehen, bevor du irgendetwas anderes anfasst. Kein anderer Punkt bringt so viel Wirkung pro Aufwand – und keiner ist so leicht zu messen.

Vergrößerung: Text muss wachsen, nicht die Seite

Zwei Kriterien greifen hier ineinander. 1.4.4 Textgröße ändern verlangt, dass Text auf 200 % vergrößert werden kann, ohne dass Inhalt oder Funktion verloren geht. 1.4.10 Reflow verlangt, dass die Seite sich bei einer Breite von 320 CSS-Pixeln umbricht, statt horizontales Scrollen zu erzwingen – das entspricht 400 % Zoom auf einem 1280 Pixel breiten Fenster.

/* Falsch: feste Pixelgrößen ignorieren die Nutzereinstellung,
   die feste Breite erzwingt horizontales Scrollen */
.card   { width: 640px; font-size: 14px; }
.table  { min-width: 900px; }

/* Richtig: relative Einheiten skalieren mit, die Breite gibt nach */
.card   { max-width: 40rem; font-size: 0.95rem; }
.table  { display: block; overflow-x: auto; }   /* nur die Tabelle scrollt */

Reflow scheitert am häufigsten nicht am Layout, sondern an einem einzelnen Element mit fester Mindestbreite: eine Datentabelle, ein Code-Block, ein eingebettetes Video. Die Lösung ist fast immer ein eigener Scroll-Container für genau dieses Element statt für die ganze Seite. Praxisbeispiele stehen unter Reflow, Zoom & Textabstände.

Farbe darf nie das einzige Signal sein

Wer eine Rot-Grün-Schwäche hat, sieht bei einem rot umrandeten Pflichtfeld neben einem grün umrandeten ausgefüllten Feld – zwei ähnlich graue Rahmen. Deshalb verlangt WCAG 1.4.1 Benutzung von Farbe ein zweites, farbunabhängiges Merkmal.

<!-- Falsch: Der Fehler existiert nur als rote Umrandung -->
<label for="plz">Postleitzahl</label>
<input id="plz" class="is-error">

<!-- Richtig: Text benennt den Fehler, ein Symbol verstärkt ihn,
     aria-describedby verknüpft ihn programmatisch mit dem Feld -->
<label for="plz">Postleitzahl</label>
<input id="plz" class="is-error" aria-describedby="plz-fehler" aria-invalid="true">
<p id="plz-fehler" class="field-error">
  <svg aria-hidden="true" focusable="false"><use href="#icon-warn"></use></svg>
  Bitte eine fünfstellige Postleitzahl eingeben, zum Beispiel 10115.
</p>

Dasselbe gilt für Links im Fließtext (unterstreichen, nicht nur einfärben), für Statusspalten in Tabellen (Wort statt Punkt) und für Diagramme – dort helfen zusätzlich Muster und direkte Beschriftungen, siehe barrierefreie Diagramme.

Textalternativen: was das Bild sagt, nicht was es zeigt

Ein Alt-Text beschreibt nicht das Bild, sondern seine Funktion an dieser Stelle. Dasselbe Foto braucht in einem Produktkatalog einen anderen Alt-Text als in einem Reisebericht.

<!-- Dekorativ: leeres alt, damit der Screenreader es überspringt -->
<img src="trennlinie.svg" alt="">

<!-- Informativ: sagt, was man wissen muss -->
<img src="schuh-seitlich.jpg" alt="Laufschuh von der Seite, dunkelblau mit oranger Sohle">

<!-- Funktional: beschreibt das Ziel, nicht das Symbol -->
<a href="/warenkorb.html">
  <img src="cart.svg" alt="Warenkorb, 3 Artikel">
</a>

Die Regel dahinter ist WCAG 1.1.1 Nicht-Text-Inhalte; wie man in Zweifelsfällen entscheidet, steht unter Alt-Texte schreiben. Nebenbei: Fehlende Alt-Texte sind mit 53,1 % der zweithäufigste Fehler der WebAIM Million – und der am schnellsten behobene.

Derselbe Text erfüllt gleich zwei Aufgaben: Er ist die Bildbeschreibung für blinde Nutzerinnen und zugleich die einzige Textinformation, die Suchmaschinen und KI-Systeme über das Bild haben. Wie man beides in einem Satz unterbringt, ohne ihn zum Schlagwortlager zu machen, steht unter Bild-SEO.

So testest du es

1. Kontrast messen, nicht schätzen: Seite in den Kontrast-Check geben oder in den DevTools unter „Barrierefreiheit“ die berechneten Werte prüfen. Achte besonders auf Platzhaltertext, deaktivierte Buttons und Text auf Bildern.
2. Auf 400 % zoomen (Strg/Cmd und +, fünfmal) und den wichtigsten Ablauf durchspielen – Suche, Warenkorb, Kontaktformular. Es darf kein horizontales Scrollen für die Seite als Ganzes nötig sein.
3. Nur die Textgröße erhöhen: in Firefox unter „Einstellungen → Allgemein → Sprache und Erscheinungsbild → Zoom → Nur Text zoomen“, dann auf 200 % stellen. Überlappt etwas oder wird abgeschnitten?
4. In Graustufen umschalten – in den Chrome DevTools über „Rendering → Emulate vision deficiencies“. Bleibt jede Information erkennbar, wenn die Farbe wegfällt?
5. Screenshot verstecken: Bildschirm dunkel schalten und dieselbe Aufgabe mit einem Screenreader lösen. Was du dann nicht findest, fehlt im Markup.

Häufiger Fehler in der Praxis

Der „Kontrast-Modus“ als Alibi. Ein Umschalter für hohen Kontrast wirkt fürsorglich und verschiebt das Problem nur: Die Standardansicht bleibt unlesbar, der Sondermodus wird nie gepflegt, und die Vielfalt der Bedürfnisse – mehr Kontrast, weniger Kontrast bei Blendempfindlichkeit, eigene Farben, eigene Schriftgröße – bedient er ohnehin nicht. Robuster ist eine Seite, die die Systemeinstellungen respektiert.

Alt-Text als Dateiname. alt="IMG_2043.jpg" oder alt="Bild" ist schlimmer als gar kein Alt-Attribut, weil es die Prüfwerkzeuge zufriedenstellt und die Nutzer nicht.

Fokus wegformatiert. outline: none im Reset, weil der Ring „stört“ – für alle, die mit Vergrößerung arbeiten, ist er die einzige Orientierung, wo sie gerade sind. Was stattdessen zu tun ist, steht unter Tastaturbedienung & sichtbarer Fokus.

Text als Bild. Preistabellen, Öffnungszeiten und Infografiken als PNG sind für Vergrößerung unbrauchbar (sie werden unscharf) und für Screenreader unsichtbar. WCAG 1.4.5 verbietet das mit wenigen Ausnahmen – und Suchmaschinen lesen den Inhalt ebenso wenig.

Häufige Fragen

Wie viele blinde und sehbehinderte Menschen gibt es in Deutschland?

Amtlich erfasst sind 71.260 blinde, 46.820 hochgradig sehbehinderte und 440.645 sehbehinderte Menschen (Schwerbehindertenstatistik, Stand 31.12.2021). Der DBSV nennt das ausdrücklich eine gesicherte untere Grenze, weil viele Betroffene keinen Ausweis beantragen; ältere WHO-Hochrechnungen kommen auf rund 1,2 Millionen. Eine amtliche Zählung blinder und sehbehinderter Menschen gibt es in Deutschland nicht.

Nutzen blinde Menschen wirklich Onlineshops?

Ja, und überdurchschnittlich intensiv. Gerade weil der Weg in ein Ladengeschäft aufwendiger ist, sind Onlineshop, Banking und Behördengang im Netz für viele die bevorzugte Variante – sofern sie funktionieren. Eine unbedienbare Seite bedeutet hier nicht Unbequemlichkeit, sondern Ausschluss. Deshalb nimmt das BFSG genau solche Dienste in die Pflicht.

Reicht ein Overlay-Widget mit Kontrast- und Vorlesefunktion?

Nein. Overlays legen eine Schicht über die Seite, statt die Ursachen im Markup zu beheben – fehlende Rollen, falsche Reihenfolgen und nichtssagende Linktexte bleiben. Viele Betroffene schalten sie ab, weil sie mit ihrer eigenen, fein eingestellten Hilfstechnik kollidieren. Warum ich davon abrate, steht unter Tools.

Was ist mit Menschen, die „nur“ eine Lesebrille brauchen?

Die profitieren von exakt denselben Maßnahmen: guter Kontrast, großzügige Schrift, sauberer Zoom, klare Struktur. Das ist der Curb-Cut-Effekt – was für wenige unverzichtbar ist, macht es für alle anderen angenehmer. Bei Alterssichtigkeit betrifft das ab Mitte vierzig praktisch jeden.

Muss ich für Farbenblinde eine eigene Palette anbieten?

Nein. Es reicht, dass keine Information allein über Farbe transportiert wird und die Kontrastwerte stimmen. Eine Umschaltung auf Sonderfarben löst das Problem nicht, weil Farbsinnstörungen unterschiedlich ausfallen. Prüfen lässt sich das in wenigen Sekunden mit der Graustufen-Emulation der Browser-DevTools.

Verwandte Themen

• Bildschirmvergrößerung – wie Lupe, Zoom und ZoomText im Alltag arbeiten
• Screenreader im Überblick – NVDA, JAWS und VoiceOver im Vergleich
• Braillezeile – taktiles Lesen und was es für sparsames Markup bedeutet
• Farbkontraste – Berechnung, Grenzwerte und typische Ausreden
• Alt-Texte schreiben – Entscheidungsbaum für informativ, dekorativ und funktional
• Überschriften-Hierarchie – die Struktur, in der Screenreader-Nutzer springen

Quellen

• Zahlen und Fakten (DBSV – Schwerbehindertenstatistik zum 31.12.2021, Definitionen und Einordnung als untere Grenze)
• The WebAIM Million (WebAIM, Ausgabe Februar 2026 – Häufigkeit von Kontrast- und Alt-Text-Fehlern)
• Screen Reader User Survey #10 (WebAIM, Januar 2024 – Anteil blinder und sehbehinderter Screenreader-Nutzer)
• Understanding SC 1.4.3 Contrast (Minimum) (W3C – Herleitung der Werte 4,5:1 und 3:1)
• Understanding SC 1.4.10 Reflow (W3C – Begründung der 320-CSS-Pixel-Regel)