Wie barrierefrei ist deine Webseite wirklich? Wir zeigen dir, worauf du achten musst, um dein Webangebot barrierefrei zu gestalten und stellen dir geeignete Test-Tools für die verschiedenen Kriterien vor.
Du möchtest herausfinden, wie barrierefrei dein Internetauftritt derzeit ist? Diese Aspekte sind wichtig:
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.
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.
Mit dem „Contrast-Checker“ kannst du einfach prüfen, ob die Farb-Kontraste auf deiner Website ausreichen.
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.
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.
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.
Mit dem Tool WAVE kannst du die Struktur deiner Seite anzeigen und analysieren. Und hinterlegte Alternativtexte überprüfen.
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.
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.
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.
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.
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.
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.
Website-Overlays versprechen Barrierefreiheit auf einen Klick. Leider funktioniert es so einfach in der Regel nicht.
Digitale Barrierefreiheit umsetzen – welche Kosten kommen dabei auf mich zu?
Was ist das Barrierefreiheitsstärkungsgesetz (BFSG). Und was bedeutet es für Website-Betreiber*innen?