Internetseite auf Barrierefreiheit testen
a
Checkliste: Barrierefreie Website testen
Du möchtest herausfinden, wie barrierefrei dein Internetauftritt derzeit ist? Diese Aspekte sind wichtig:
- Ausreichender Kontrast zwischen Vorder- und Hintergrundfarbe
- Links und Schaltflächen sind über die Tastatur bedienbar
- Website ist für Screenreader lesbar
- Verständliche Sprache nutzen
- Formulare barrierefrei gestalten
Bitte beachte, dass diese Checkliste keine vollständige Qualitätskontrolle ersetzen kann. Sie ist nicht gleichwertig mit einem gründlichen, systematischen Test. Ausführliche Tests werden nach dem internationalen „Web Content Accessibility Guidelines“-Standard (WCAG) oder der deutschen Barrierefreie-Informations-Technik-Verordnung (BITV) durchgeführt.
Ausreichender Kontrast zwischen Vorder- und Hintergrundfarbe
Bestimmte Farbkombinationen haben wenig Kontrast. Steht zum Beispiel hellgraue Schrift auf weißem Hintergrund ist das für viele Menschen schwer lesbar. Gleiches gilt für Grafiken mit kontrastschwachen Farben. Für Menschen mit einer Sehbehinderung oder Farbfehlsichtigkeit (zum Beispiel Rot-Grün-Schwäche) sind solche Darstellungen häufig nur schwer oder gar nicht lesbar. Die Barrierefreiheit ist eingeschränkt.
Wichtig ist daher, verwendete Farben immer auf einen ausreichenden Kontrast zu prüfen. Grafiken sollten außerdem Farben nie als einziges Unterscheidungsmerkmal einsetzen. Hohe Kontraste unterstützen übrigens auch die mobile Nutzung: Inhalte bleiben so etwa trotz direkter Sonneneinstrahlung im Freien erkennbar.
Test: Kontraste
Mit dem „Contrast-Checker“ kannst du einfach prüfen, ob die Farb-Kontraste auf deiner Website ausreichen.
Links und Schaltflächen sind über die Tastatur bedienbar
Einige Nutzer*innen haben Schwierigkeiten, kleine Links und Schaltflächen auszuwählen. Was mit einem Mauszeiger noch funktioniert, wird bei der Bedienung mit dem Finger auf einem Tablet oder mit dem Smartphone schnell zu einer Herausforderung.
Interaktive Elemente wie Links oder Schaltflächen sollten daher über die Tabulator-Taste ↹ erreichbar sein. Die angewählten Flächen sollten außerdem gut sichtbar visuell hervorgehoben werden. So können Nutzer*innen schnell erkennen, welcher Button oder Link mit Enter ausgelöst wird.
Tastaturbedienbarkeit
Sind alle Links und Schaltflächen für die mobile Nutzung optimiert? Schaltflächen für Links und Buttons müssen mindestens 24 Pixel hoch und breit sein. Ausgenommen davon sind Textlinks im Fließtext.
Website ist für Screenreader lesbar
Blinde Menschen oder Menschen mit Sehbehinderung nutzen Vorleseanwendungen (Screenreader) zum Lesen eines Textes oder für die Beschreibung von Bildern oder Grafiken. Dazu ist es notwendig, dass die Überschriftenstrukturen von Websites korrekt ausgezeichnet sind (H1 – H6). Auf diese Weise navigieren sich die Nutzer*innen von Screenreadern durch den Text.
Damit der Screenreader Bilder oder Grafiken auf einer Seite korrekt beschreiben kann, muss eine Bildbeschreibung (auch ALT-Text) für jedes Bild hinterlegt werden. Der Alternativtext dient als Ersatz für das Bild. Er muss kontextbezogen relevante Bildinformationen vermitteln. Prägnant und objektiv.
Übrigens: Auch Suchmaschinen werten ALT-Texte aus und beziehen sie in das Ranking ein.
Test: Screenreader-Kompatibilität
Mit dem Tool WAVE kannst du die Struktur deiner Seite anzeigen und analysieren. Und hinterlegte Alternativtexte überprüfen.
Verständliche Sprache nutzen
Lange Schachtelsätze, Fremdwörter oder unklare Abkürzungen machen Website-Texte kompliziert und unverständlich. Für Menschen, die Schwierigkeiten beim Lesen haben. Aber auch für alle anderen.
Formuliere kurze Sätze mit einfachem Satzbau. Verzichte auf Fremdwörter oder erkläre diese. Dann wird deine Website für alle schnell und einfach verständlich. Und Nutzer*innen kommen gerne wieder.
Test: Verständliche Sprache
Verwende ein Programm zur Analyse von Grammatik, Rechtschreibung und Stil. Das KI-basierte Programm "LanguageTool“ korrigiert deine Texte in verschiedenen Sprachen und bietet dir alternative Formulierungen an.
Formulare barrierefrei gestalten
Damit deine Besucher*innen mit deiner Website oder Applikation interagieren können, kommen Formulare zum Einsatz. Der Klassiker ist das Kontaktformular. Doch auch Sterne-Bewertungen, Warenkörbe und Bezahlvorgänge enthalten Formularelemente. Nur wenn diese Formulare barrierefrei sind, können alle Kunden online mit dir in Kontakt treten oder bei dir einkaufen.
Test: Formulare
Klicke in deinem Formular auf die jeweilige Beschriftung eines Eingabefeldes (zum Beispiel auf das Wort „Vorname“). Springt der Mauszeiger dabei in das Eingabefeld, ist das Feld mit der Beschriftung verknüpft. Dies ist eine wichtige Voraussetzung für barrierefreie Formulare.
Wissen für die Praxis
Barrierefreie Webseite: Vom Test zur Umsetzung
Du hast deine Website auf Barrierefreiheit getestet und festgestellt, dass es an einigen Stellen Verbesserungsbedarf gibt? Dann erfährst du hier, wie du nun vorgehen kannst, um deine Website barrierefrei zu gestalten.
Studie zur Barrierefreiheit deutscher Online-Shops
Die Aktion Mensch und Google haben die Barrierefreiheit der in Deutschland meistbesuchten Online-Shops testen lassen. Das Ergebnis zeigt: Das Internet, und vor allem Webseiten von gewerblichen Anbietern, sind zu einem großen Teil nicht barrierefrei nutzbar.
Das könnte dich auch interessieren
Was ist ein Overlay?
Website-Overlays versprechen Barrierefreiheit auf einen Klick. Leider funktioniert es so einfach in der Regel nicht.
Kosten und Finanzierung barrierefreier Internetseiten
Digitale Barrierefreiheit umsetzen – welche Kosten kommen dabei auf mich zu?
Barrierefreie Websites gemäß BFSG
Was ist das Barrierefreiheitsstärkungsgesetz (BFSG). Und was bedeutet es für Website-Betreiber*innen?