Barrierefreie Gestaltung von Webseiten

Die hier vorgestellten Gestaltungsregeln beziehen sich primär auf die Bedürfnisse sehbehinderter Internetnutzer. Es ist daher notwendig, deren eingeschränkte visuelle Aufnahme von Inhalten durch eine einfache und klare Darstellung auszugleichen. Layout, Bilder, Farben und Schrift bilden die Hauptbestandteile der Gestaltungselemente.

Layout

Beim Webseitendesign ist es ratsam, Seiten auch für kleinere Bildschirmauflösungen zu optimieren. Besonders ältere und sehbehinderte Menschen verringern die Auflösung auf 800x600 Pixel, um eine vergrößerte Darstellung zu erreichen.

Ihr Layout sollte sich an verschiedene Bildschirmauflösungen mühelos anpassen bzw. anpassen lassen. Ihre Webseitenstruktur sollte einfach und übersichtlich sein. Teilbereiche sollten deutlich erkennbar sein. Speziell der Inhaltsbereich sollte ohne Navigationselemente und Seitenrand-Infos problemlos überblickt und zugeordnet werden können.

Bilder

Blinde Nutzer verwenden Screen-Reader und ähnliche Ausgabegeräte, um sich den Inhalt einer Webseite vorlesen zu lassen. Diese können Grafiken und Bilder nicht vorlesen. Statt dessen werden die hinterlegten ALT-Attribute oder der Dateiname vorgelesen. Jedes grafische Seitenelement sollte also ein ALT-Attribut verwenden, das entweder sinnvoll gefüllt oder leer ist. Ist es leer wird der Dateiname einer Grafik nicht vorgelesen. Dies ist z.B. bei unsichtbaren Grafiken erforderlich.

Die grafische Darstellung von Text ist aus Gründen der Barrierefreiheit und im Hinblick auf Suchmaschinen nicht ratsam. Sinnvoll ist dies nur bei Logos und speziellen Schriften, beispielsweise in grafischen Menüs.

Durch den überlegten Einsatz von Bildern und Multimediaelementen wird die Ladezeit einer Webseite erheblich reduziert, da die Zahl und Größe der zu übertragenden Daten geringer ist. Dies kommt auch Anwendern mobiler Ausgabegeräte wie PDA und Handy zu Gute.

Farben

Farben sollten nicht als alleiniges Unterscheidungsmerkmal zwischen Teilbereichen einer Webseite verwendet werden. Dies führt meist bei farbfehlsichtigen Nutzern zu Problemen.

Kritische Farbkombinationen in diesem Zusammenhang sind:

Grün/Rot
Farben mit geringem Helligkeits- bzw. Farbkontrast

Für eine barrierefreie Gestaltung werden folgende Farben empfohlen:

Schwarz/Weiß
Blau auf Weiß
Gelb auf Blau
Weiß auf Rot
Große weiße Flächen können einen Blendeffekt hervorrufen. Hintergründe sollten besser mit einem hellen Grau gefüllt werden.

Schrift

Für die gute Lesbarkeit von Texten im Internet empfiehlt sich die Schrift Verdana, da sie auf die speziellen Anforderungen ausgerichtet ist.

Grundsätzlich wichtig ist der Schrifttyp, die Schriftfarbe, die Schriftgröße und der Hintergrund. Ihre verwendeten Schriften müssen sich im Browser skalieren, d.h. vergrößern lassen.

Siehe auch Leichte Sprache

und extern den BITV-Test