WCAG 2.1 verstehen — Die Grundlagen erklärt
Ein Überblick über die vier Kernprinzipien von WCAG 2.1 und warum sie für deine Website wichtig sind.
Artikel lesenWie du deine Website mit NVDA und JAWS testest, um sicherzustellen, dass sie für Nutzer mit Sehbeeinträchtigung funktioniert.
Du kannst deine Website noch so schön designen — wenn ein Bildschirmleser-Nutzer sie nicht bedienen kann, ist dein Design gescheitert. Das ist die ehrliche Wahrheit. Aber hier’s das Gute: Mit den richtigen Tools und ein bisschen Übung wirst du schnell merken, was funktioniert und was nicht.
NVDA und JAWS sind die beiden wichtigsten Bildschirmleser im deutschsprachigen Raum. NVDA ist kostenlos und läuft auf Windows. JAWS ist professionell und teurer, aber auch sehr leistungsstark. Wenn deine Website mit diesen beiden Tools funktioniert, ist sie schon ziemlich barrierefrei.
NVDA (NonVisual Desktop Access) ist dein erstes Werkzeug. Es’s kostenlos, quelloffen und das am weitesten verbreitete Tool für barrierefreies Testen.
Geh auf nvaccess.org und lade die aktuelle Version herunter. Wir empfehlen die Installer-Version, nicht die portable Version. Das spart dir später Kopfschmerzen.
Starten Sie den Installer, akzeptieren Sie die Lizenz. Nach der Installation startet NVDA automatisch. Der Willkommens-Dialog ist sehr hilfreich — arbeite ihn durch, bevor du ihn schließt.
Die wichtigsten: Strg+Alt+N schaltet NVDA an/aus. H navigiert zu Überschriften. Tab springt zwischen Links. Mit Strg+Home/End gehst du zum Anfang/Ende der Seite. Drucke dir eine Shortcuts-Liste aus — du brauchst sie.
Jetzt wird’s konkret. Öffne deine Website in Firefox oder Chrome. NVDA ist bereits läuft. Schalte deinen Monitor aus oder wende deinen Stuhl vom Bildschirm weg — ja, wirklich. Wenn du nicht auf den Monitor schaust, merkst du sofort, was nicht funktioniert.
Navigiere mit der Tab-Taste durch deine Seite. NVDA liest dir vor, was ansprechbar ist. Höre genau hin: Sagt NVDA “Link” oder einfach nur eine URL? Ist die Überschrift deutlich als Überschrift erkennbar? Kann der Nutzer wirklich alle Inhalte verstehen, ohne den Bildschirm zu sehen?
Wenn du testen wirst, findest du wahrscheinlich diese drei Probleme wieder und wieder.
Bilder ohne Alt-Texte sind eine Katastrophe für Bildschirmleser. NVDA liest dann nur “Grafik” vor oder gar nichts. Schreib aussagekräftige Alt-Texte — mindestens 30 Zeichen, beschreibend, nicht redundant.
“Hier klicken” oder “Mehr” sagen dem Nutzer nichts. Der Screenreader liest nur den Link-Text vor, ohne Kontext. Besser: “Artikel über WCAG 2.1 lesen” oder “Kontaktformular öffnen”.
Wenn du mit Tab nicht alle interaktiven Elemente erreichen kannst, ist deine Website nicht zugänglich. Überprüfe: Haben alle Buttons und Links ein sichtbares Focus-Styling? Ist die Tab-Reihenfolge logisch?
H1, H2, H3 sollten eine logische Struktur bilden. Wenn du von H1 direkt zu H3 springst, verwirrt das Screen-Reader-Nutzer. Nutze Überschriften als echte Gliederung, nicht zum Styling.
JAWS ist die professionelle Lösung. Es kostet etwa 100 Euro (mit Rabatt für Bildungseinrichtungen), ist aber unglaublich leistungsstark. Viele blinde und sehbehinderte Menschen nutzen JAWS, deshalb solltest du deine Website auch damit testen.
Der größte Unterschied zu NVDA: JAWS hat erweiterte Features wie virtuellen Cursor-Modus, OCR-Funktionen und spezielle Einstellungen für verschiedene Anwendungen. Du wirst merken, dass JAWS manchmal Dinge anders interpretiert als NVDA. Das ist wichtig zu wissen.
Es gibt eine 40-minütige Trial-Version — völlig ausreichend zum Testen deiner Website. Nutze sie. Verglichen mit NVDA wird dir sofort auffallen, wie viel mehr Details JAWS erkennt und ansagt.
Drucke diese Liste aus oder speichere sie. Jedes Mal wenn du mit einem Bildschirmleser testest, gehe diese Punkte durch:
Barrierefreiheit ist kein einmaliges Projekt — es’s ein kontinuierlicher Prozess. Jede neue Seite, jede Funktion sollte mit NVDA oder JAWS getestet werden. Mit der Zeit wirst du ein Gespür dafür entwickeln, was funktioniert und was nicht.
Das Beste daran: Wenn du für Bildschirmleser optimierst, wird deine Website automatisch auch für andere Nutzer besser. Bessere Semantik, klarere Struktur, logische Navigation — das profitiert jedem.
Also: Lade NVDA jetzt herunter. Setz dir Kopfhörer auf. Schalte den Monitor aus. Und teste deine Website so, wie ein echter Nutzer sie erleben würde. Das’s der Anfang.
Entdecke weitere Ressourcen und praktische Anleitungen zur Barrierefreiheit im Web.
Zur Accessibility-ÜbersichtDiese Anleitung ist zu Bildungs- und Informationszwecken gedacht. Die erwähnten Tools und Standards (NVDA, JAWS, WCAG 2.1, BITV 2.0) sind reale Ressourcen. Die Best Practices basieren auf etablierten Accessibility-Standards, ersetzen aber keine professionelle Beratung. Bei kritischen Projekten empfehlen wir, mit Accessibility-Experten und echten Nutzern mit Behinderungen zusammenzuarbeiten. Jede Website ist unterschiedlich — was hier funktioniert, muss nicht überall angewendet werden.