Die 7 wichtigsten Faktoren für barrierefreie Webseiten

Die Lesbarkeit von Texten oder Grafiken ist ein überaus bedeutender Faktor für die Barrierefreiheit einer Website oder Webanwendung. So sollte der Kontrast zwischen Text oder Elementen und Hintergrund nicht zu gering sein. Andernfalls leidet die Lesbarkeit darunter und die Webinhalte können nicht richtig erkannt werden. Zudem wird Farbe oft als Informationsträger genutzt, wie beispielsweise Rot als Warn- und Signalfarbe. Bei der Verwendung farbiger Elemente oder Schriften zu beachten, dass sie auch etwa bei Farbenblindheit gut erkennbar sein sollten. Das heißt, dass die entsprechende Information (bei Rot die Warnintention) nicht ausschließlich über die Farbe vermittelt werden darf

Alle Webseiten bedienen sich grundsätzlich der gleichen Bausteine, die in Symbiose eine komplette Webanwendung ergeben. Besagte Bausteine erfüllen ihren optimalen Zweck aber erst, wenn der semantischen Struktur Genüge getan ist. Dies wird z. B. benötigt, um Menschen mit Sehbeeinträchtigung Orientierung am allgemeinen Aufbau der Seite zu geben. Mit folgenden Elementen strukturieren Sie Ihre Website oder mobile Webanwendung und vereinfachen damit die Lesbarkeit:

• Überschrift und Zwischenüberschriften
• Absätze
• Auflistungen und Aufzählungen
• Tabellen
• Audio- und Video-Elemente wie Bilder, Grafiken, Tonspuren oder Videos

Eine Webseite sollte auf jedem Endgerät, sei es ein Computer, ein Tablet oder ein Smartphone, gut erkenn- und bedienbar sein. Viele Menschen nutzen die Vergrößerungsfunktion ihres Browsers, um Text (in kleiner Schriftgröße) oder Bilder besser erkennen zu können. Dennoch sollte der Inhalt noch gut les- und erkennbar sein, auch ohne lästiges horizontales Scrollen oder Hin-und-her-Schieben.

Kurze Sätze mit simplem Satzbau sind zu bevorzugen. Wenn möglich sollte die Sprache in Hochdeutsch gehalten sein. Komplexe, stark verschachtelte Sätze und Fachwörter, die die lesende (oder hörende) Zielgruppe nicht versteht, sollten unbedingt vermieden werden.

Bei der Navigation sprechen wir nicht nur von einer guten Erreichbarkeit und Bedienung der allgemeinen Haupt-Navigation am Anfang einer Webseite oder einer Webanwendung. Alle weiterführenden und interaktiven Elemente der Seite wie Links, Buttons, Formulare etc. sollten bestenfalls nicht nur mit der Maus, sondern auch mit der Tastatur ansteuerbar sein.

Wie Links barrierefrei (und SEO-freundlich) gestaltet werden können, lesen Sie in unserem Magazinbeitrag "Interne Verlinkung: 4 Tipps zum Nachahmen".

Im Quelltext einer Website finden sich Angaben zu Titel und Meta-Description der Seite. Durch sie sollte das Thema einer Seite leicht erkennbar sein. Deshalb wählen Sie Seitentitel und Meta-Description sinnvoll und achten Sie auf eine angemessene Zeichenzahl. Diese Daten werden auch von Suchmaschinen wie Google genutzt und auf den Suchergebnisseiten ausgegeben. Setzt man z. B. keine Meta-Description, sucht sich die Suchmaschine einen von ihr als sinnvoll erachteten Textausschnitt und bildet ihn in den Suchergebnissen ab.

Die sogenannten alt-Attribute (auch alt-Tags) sollten für Bilder und Grafiken genutzt werden, um das Abgebildete zu beschreiben. Dieser Alternativtext hilft, den Inhalt zu verstehen, wenn das Bild nicht angezeigt oder erkannt werden kann. Auch Links können bspw. title-Tags tragen, um das Link-Ziel entsprechend zu beschreiben. Sowohl alt-Texte als auch title-Texte werden für die Sprachausgabe einer Webanwendung benötigt.