Beispiele für gute Barrierefreiheit auf Ihrer Website

Barrierefreie Bilder

Bilder, die Informationen enthalten, brauchen einen Alternativtext (oft nach der HTML-Schreibweise Alt-Text abgekürzt): Eine Beschreibung der Bildes, welche die enthaltene Information vollständig zusammenfasst. Rein dekorative Bilder können als solche ausgezeichnet werden, indem das alt-Tag leergelassen wird.

Barrierefreie Text

Barrierefreie Video- und Audioinhalte

Nicht-textliche Inhalte wie Video und Audio brauchen eine schriftliche Repräsentation ihres Inhalts, um Barrierefreiheitstandards zu genügen. Bei Audio bedeutet das ein komplettes Transkript. Videos brauchen Untertitel. Beide Medienarten sollten niemals automatisch abspielen und ihre Bedienelemente natürlich mit jeder Art von Input-Gerät erreichbar sein.

Website-Struktur und Navigation

Semantisches HTML Arbeitstitel

Eine logische und konsistente Seitenstruktur ist der Schlüssel zur Barrierefreiheit im Webdesign. Die Inhalte sollten da verortet sein, wo die User*innen nach ihnen suchen, und jede einzelne Unterseite sollte mit semantischem HTML arbeiten, um Bedeutung und Struktur für User*innen und Bedienhilfen klar zu machen.

Barrierefreies Schriftbild

Farbkontrast

Bevor die erste Zeile Code geschrieben ist, können Sie die Accessibility Ihrer Website bereits verbessern: Indem Sie die Barrierefreiheit im Webdesign direkt mitdenken und Farben mit hohen Kontrasten auswählen. Achten Sie auch darauf, dass Ihre Kontraste in unterschiedlichen Farbmodi robust bleiben, also auch im Dark Mode deutlich sind.

Anpassbare Schriftgröße

Den User*innen die Option zu geben, die Schriftgröße anzupassen, hilft, dass Ihre Texte die Leser*innen nicht ermüden und für Menschen mit unterschiedlich ausgeprägten Sehfähigkeiten lesbar bleiben.

Formulare und Interaktionselemente

Alle interaktiven Elemente auf einer Webseite – egal ob Buttons, Menüs, Links oder Eingabefelder, müssen mit der Tastatur erreichbar sein, um barrierefrei zu sein. Jedes Feld in einem Formular muss deutlich machen, welche Art von Eingaben es erwartet und wie gültige oder ungültige Eingaben aussehen. Wenn eine Eingabe fehlerhaft ist, muss eine Fehlermeldung darüber aufklären, wie man den Fehler korrigieren kann.