Screenreader

Wie funktioniert ein Screenreader?

Ein Screenreader, auf Deutsch einmalig auch Bildschirmleseprogramm genannt, liest eine Website nicht wie ein sehender Nutzer. Die Software greift auf die vom Browser erzeugte Barrierefreiheitsstruktur zu. Diese Struktur enthält unter anderem Rollen, Namen, Zustände und Beziehungen von Elementen. Aus einem korrekt ausgezeichneten HTML-Button wird dadurch ein bedienbarer Schalter, aus einer bloß gestalteten Fläche möglicherweise nur unverständlicher Text.

Screenreader geben Inhalte über eine synthetische Stimme oder eine angeschlossene Braillezeile aus. Nutzer bewegen sich dabei häufig mit der Tastatur durch Überschriften, Links, Formularfelder, Tabellen oder sogenannte Landmarken. Landmarken kennzeichnen Bereiche wie Navigation, Hauptinhalt und Fußzeile. Eine klare HTML-Struktur verkürzt deshalb den Weg zur gesuchten Information.

HTML liefert die Bedeutung

Die sichtbare Gestaltung allein vermittelt einem Screenreader keine zuverlässige Bedeutung. Eine große, fett formatierte Textzeile ist technisch noch keine Überschrift. Erst ein Element wie <h2> kennzeichnet die Funktion. Dasselbe gilt für Listen, Tabellen, Links und Schaltflächen. Prüfe deshalb nicht nur das Design, sondern kontrolliere, ob die HTML-Elemente ihrer tatsächlichen Aufgabe entsprechen.

• Überschriften benötigen eine nachvollziehbare Hierarchie.
• Schaltflächen werden als <button> umgesetzt.
• Links erhalten ein echtes Linkziel und einen verständlichen Namen.
• Formularfelder werden mit sichtbaren Beschriftungen verknüpft.
• Listen und Tabellen verwenden die dafür vorgesehenen HTML-Elemente.

Screenreader und Barrierefreiheit

Screenreader sind ein zentraler Anwendungsfall digitaler Barrierefreiheit. Eine Website ist für diese Software zugänglich, wenn Inhalte wahrnehmbar, Bedienelemente mit der Tastatur erreichbar und Zustandsänderungen verständlich angekündigt werden. Die vier Grundprinzipien der Web Content Accessibility Guidelines sind Wahrnehmbarkeit, Bedienbarkeit, Verständlichkeit und Robustheit.

Robust bedeutet in diesem Zusammenhang, dass Browser und assistive Technologien die Funktion eines Elements zuverlässig erkennen können. Eigenentwickelte Bedienelemente benötigen dafür oft zusätzliche technische Angaben. Die Accessible Rich Internet Applications, kurz ARIA, ergänzen HTML beispielsweise um Rollen oder Zustände. ARIA repariert jedoch keine ungeeignete Grundstruktur. Ein natives HTML-Element ist meist die belastbarere Ausgangsbasis.

Alt-Texte für Bilder

Ein Screenreader kann den sichtbaren Inhalt eines Bildes nicht automatisch als redaktionell passende Aussage behandeln. Das alt-Attribut liefert deshalb eine textliche Alternative. Ein guter Alt-Text beschreibt die Information oder Funktion des Bildes im jeweiligen Seitenkontext. Bei einem verlinkten Produktbild kann der Produktname sinnvoll sein, während ein Diagramm seine zentrale Aussage benötigt.

Rein dekorative Bilder erhalten ein leeres Alt-Attribut mit alt="". Dadurch kann ein Screenreader das Bild überspringen. Fehlt das Attribut vollständig, geben manche Programme stattdessen den Dateinamen aus. Eine Bezeichnung wie img_4827_final.jpg erzeugt keinen Informationswert. Weitere technische und inhaltliche Prüfungen lassen sich mit einem kostenlosen SEO-Check vorbereiten.

Formulare und interaktive Inhalte

Ein Formularfeld benötigt eine programmatisch zugeordnete Beschriftung. Platzhaltertext allein reicht dafür nicht aus, weil er beim Tippen verschwindet und nicht von jeder Kombination aus Browser und assistiver Technologie gleich verarbeitet wird. Fehlermeldungen müssen das betroffene Feld benennen und erklären, wie der Nutzer die Eingabe korrigieren kann.

Dynamische Inhalte stellen eine zusätzliche Bedingung: Öffnet sich ein Dialogfenster, muss der Tastaturfokus in den Dialog wechseln und nach dem Schließen sinnvoll zurückkehren. Werden neue Suchergebnisse oder Statusmeldungen geladen, muss ein Screenreader die Änderung erkennen können. Prüfe deshalb komplette Abläufe und nicht nur einzelne Seitenzustände.

Screenreader richtig testen

Ein Screenreader-Test beginnt mit der Tastatur. Alle Links, Schaltflächen und Formularfelder müssen in einer nachvollziehbaren Reihenfolge erreichbar sein. Der Fokus muss sichtbar bleiben, und kein Element darf den Nutzer in einem Bereich festhalten. Anschließend wird geprüft, welche Namen, Rollen und Zustände die Software tatsächlich ausgibt.

Messbar ist Barrierefreiheit an dieser Stelle über eine kombinierte Prüfung: Ein automatisierter Scan erfasst technisch erkennbare Fehler, ein Tastaturtest kontrolliert die Bedienbarkeit und ein Screenreader-Test bewertet die ausgegebene Bedeutung. Für einen belastbaren Befund sollte mindestens ein zentraler Ablauf vollständig getestet werden, etwa Produktsuche, Warenkorb und Bestellung oder Kontaktformular und Bestätigung.

Typische Prüffragen lauten:

• Lässt sich der Hauptinhalt über Überschriften oder Landmarken direkt erreichen?
• Sind Linktexte auch außerhalb ihres Absatzes verständlich?
• Werden Pflichtfelder, Fehler und Erfolgsstatus eindeutig ausgegeben?
• Besitzen Schaltflächen einen erkennbaren Namen und Zustand?
• Bleibt die Reihenfolge bei Tastaturbedienung logisch?

Unterschied zu ähnlichen Hilfsmitteln

Der Unterschied zwischen einem Screenreader und einer reinen Vorlesefunktion liegt in der Bedienbarkeit. Eine Vorlesefunktion gibt meist ausgewählten Fließtext akustisch wieder. Ein Screenreader erschließt zusätzlich Navigation, Links, Formulare, Tabellen, Dialoge und Systemfunktionen. Nutzer können damit Inhalte gezielt ansteuern und Aktionen ausführen.

Screenreader im SEO und GEO

Screenreader und Suchmaschinen verarbeiten Websites auf unterschiedliche Weise, profitieren aber teilweise von denselben Grundlagen. Semantisches HTML, aussagekräftige Überschriften, verständliche Linktexte und beschriftete Bilder erleichtern Maschinen die Einordnung von Inhalten. Eine barrierefreie Umsetzung ist dennoch kein automatisches Ranking-Signal und ersetzt keine strukturierte Onpage-Optimierung.

Für GEO, also Generative Engine Optimization, verbessert eine klare Inhaltsstruktur die maschinelle Extraktion einzelner Aussagen. Präzise Überschriften, abgeschlossene Absätze und verständliche Tabellen helfen KI-Systemen, Inhalte einem Thema zuzuordnen. Ein Screenreader-Test zeigt dabei indirekt, ob eine Seite auch ohne visuelle Gestaltung eine nachvollziehbare Informationsarchitektur besitzt.

Bei SEA betrifft Barrierefreiheit vor allem die Zielseite einer Anzeige. Eine Anzeige kann passende Besucher bringen, doch ein unbeschriftetes Formular oder eine nicht per Tastatur bedienbare Produktauswahl unterbricht den Abschluss. Barrierefreiheit gehört deshalb auch zur Optimierung der Website-Nutzung und sollte bereits bei neuen Webdesign-Konzepten berücksichtigt werden.

Häufige Fragen zu Screenreadern

Wenn du die Zugänglichkeit deiner Website zusammen mit Technik, Inhalt und Nutzerführung prüfen lassen möchtest, kannst du einen unverbindlichen Potenzialcheck anfragen.

Kostenloser Potenzialcheck