Was passiert, wenn ein Nutzer Ihre Website mit einem Screenreader öffnet?

Was passiert, wenn ein Nutzer Ihre Website mit einem Screenreader öffnet?

Eine Perspektive, die die meisten nie einnehmen

Stellen Sie sich vor: Sie öffnen eine Website – aber Sie sehen nichts.

Kein Layout. Keine Farben. Keine Bilder. Nur eine Stimme, die Ihnen vorliest, was auf dem Bildschirm steht.

Das ist die tägliche Realität von Millionen Menschen, die einen Screenreader nutzen.

Was ist ein Screenreader?

Ein Screenreader ist eine Software, die Bildschirminhalte in Sprache oder Braille-Ausgabe umwandelt.

Bekannte Screenreader:

• NVDA – kostenlos, Windows, weit verbreitet
• JAWS – professionell, Windows, häufig in Unternehmensumgebungen
• VoiceOver – in macOS und iOS integriert
• TalkBack – Android

Nutzer:innen navigieren per Tastatur, nicht per Maus. Sie hören, was der Screenreader vorliest – Zeile für Zeile, Element für Element.

Der erste Moment: Die Seite lädt

Ein Screenreader-Nutzer öffnet Ihre Website.

Was passiert als erstes?

Der Screenreader liest den Seitentitel vor. Aus dem <title>-Tag im HTML.

Viele Websites haben hier:

• den gleichen Titel auf jeder Unterseite
• nur den Firmennamen, ohne Seitenkontext
• keinen Titel

Was der Nutzer hört: „Startseite – Startseite – Startseite.” Was er versteht: nichts.

Navigation: Ein Labyrinth ohne Karte

Sehende Nutzer:innen erfassen ein Seitenlayout in Sekunden. Sie sehen Menü, Hauptinhalt, Footer – auf einen Blick.

Screenreader-Nutzer:innen hören alles linear, von oben nach unten.

Was das bedeutet: Wenn Ihre Navigation 20 Links enthält, werden alle 20 vorgelesen – bei jeder Seite, beim jedem Ladevorgang.

Es sei denn: Es gibt einen „Zum Hauptinhalt springen”-Link ganz oben. Dieser ist für sehende Nutzer:innen unsichtbar – für Screenreader-Nutzer:innen ein Lebensretter.

Haben Sie einen?

Bilder: Was der Screenreader vorliest

Ein Bild ohne Alternativtext:

„Grafik.”

Das ist alles, was der Nutzer hört. Kein Kontext. Keine Information. Keine Botschaft.

Ein dekoratives Bild ohne Alt-Text – korrekt markiert als alt="" – wird übersprungen. Das ist gut.

Ein informationelles Bild ohne Alt-Text – ein Produktbild, ein Diagramm, ein Team-Foto – hinterlässt eine Lücke.

Was sehende Nutzer:innen auf einen Blick verstehen, bleibt Screenreader-Nutzer:innen komplett verborgen.

Formulare: Wo viele Websites komplett versagen

Formulare sind der kritischste Punkt.

Was passiert beim Kontaktformular ohne Labels?

Der Screenreader liest vor:

„Eingabefeld. Eingabefeld. Eingabefeld.”

Kein Hinweis, was wo eingegeben werden soll. Kein Name. Keine E-Mail. Kein Betreff.

Der Nutzer gibt auf. Nicht wegen fehlendem Interesse – sondern wegen einer fehlenden Zeile Code.

Buttons und Links: Die falsche Beschriftung

„Button.” „Hier klicken.” „Mehr.” „Link.”

Das sind typische Ausgaben eines Screenreaders auf schlecht beschrifteten Seiten.

Ohne visuellen Kontext sind diese Aussagen wertlos. Screenreader-Nutzer:innen haben keine Möglichkeit zu wissen, wohin „Mehr” führt oder was „Button” auslöst.

Korrekte Beschriftung:

• „Angebot jetzt anfragen”
• „Artikel über Barrierefreiheit lesen”
• „Zum Kontaktformular wechseln”

Überschriften: Das Inhaltsverzeichnis der Website

Screenreader-Nutzer:innen navigieren häufig per Überschriften-Sprung. Ein Tastendruck – und der Screenreader springt zur nächsten <h2>, <h3>, <h4>.

Das ist wie ein Inhaltsverzeichnis – aber nur, wenn die Überschriftenhierarchie stimmt.

Häufige Fehler:

• Überschriften nur aus Designgründen gewählt (<h1> weil die Schrift groß aussieht)
• Überspringen von Ebenen (<h1> direkt zu <h4>)
• Keine Überschriften im Fließtext

Ohne korrekte Überschriftenstruktur ist die Seite für Screenreader-Nutzer:innen ein langer, unstrukturierter Textblock.

Was Ihre Website wirklich kommuniziert

Jede Barriere sendet ein Signal:

• Kein Alt-Text → „Wir haben nicht an Sie gedacht.”
• Kein Skip-Link → „Sie müssen sich durch alles kämpfen.”
• Kein Label → „Wir wissen nicht, wie Formulare funktionieren.”

Eine Website, die für Screenreader nicht funktioniert, sagt: „Sie sind hier nicht willkommen.”

Das ist selten Absicht. Aber es ist das Ergebnis.

Der einfache Selbsttest

Sie müssen kein Experte sein, um erste Probleme zu erkennen:

1. Installieren Sie NVDA (kostenlos, Windows) oder aktivieren Sie VoiceOver (Mac: Cmd + F5)
2. Schließen Sie den Bildschirm oder schließen Sie die Augen
3. Öffnen Sie Ihre Website – nur mit der Tastatur
4. Hören Sie zu

Was verstehen Sie? Was nicht?

Fünf Minuten Selbsttest zeigen mehr als jede Analytics-Auswertung.

Wie ClarusPlus hilft

ClarusPlus erkennt automatisch die häufigsten Screenreader-Barrieren auf Ihrer Website:

• Fehlende Alt-Texte
• Nicht beschriftete Formularfelder
• Fehlende Überschriftenstruktur
• Unzugängliche Buttons und Links

Das ClarusPlus Accessibility-Widget behebt viele dieser Probleme sofort – ohne Eingriff in Ihren Code.

Ihre nächsten Schritte

• Testen Sie Ihre Website mit einem Screenreader
• Prüfen Sie Alt-Texte, Formular-Labels und Überschriftenstruktur
• Starten Sie mit dem kostenlosen ClarusPlus Accessibility-Audit

Kontakt: [email protected]

Mehr erfahren: clarusplus.com