Eine Frage des Glaubens

Barrierefreies Webdesign und Suchmaschinen

Meistens stellt man sich unter "Barrierefrei" den verbesserten Zugang für blinde Menschen vor. Tatsächlich ist der Anteil von Blinden an der Gesamtbevölkerung relativ gering: nur 0,1 bis 0,2%; und von diesen sind wiederum die meisten (ca 70%) erst im Alter von über 60 Jahren erblindet. Aus diesem Grund ist auch die Braille-Schrift nicht so verbreitet, nur etwa 30% aller Blinden beherrschen sie.

Barrierefreies Webdesign bedeutet aber auch, dass auch Menschen mit irgendeiner Form der Behinderung die Webseiten benutzen können. Es ist für jeden nachvollziehbar, die ein Gehörloser eine Seite wahrnimmt - es reicht, den Lautsprecher auszuschalten. Eine sehr häufige Behinderung ist auch Fehlsichtigkeit; ebenso einfach zu überprüfen: Omas Brille aufsetzen oder die eigene ab. Mit nur 4 Dioptrien Kurzsichtigkeit kann ich selbst zB viele Webseiten ohne Brille nicht mehr entziffern. Zur Überprüfung, wie eine Seite für Farbenblinde wirkt gibt es Hilfsprogramme. Hier eine umfangreiche Aufstellung vieler Tools.
Zusätzliche Aspekte für barrierefreies Webdesign beziehen sich auf im weitesten Sinne "geistig" behinderte Menschen, etwa Menschen mit starken Lern- oder Orientierungsschwierigkeiten.

Der Zusammenhang zwischen barrierefreiem Webdesign und Suchmaschinen beginnt erst dort, wo spezielle Programme oder Geräte direkt auf den Quellcode der Seite zugreifen. Ebenso wie der GoogleBot tut das etwa auch ein Screenreader für Blinde.

Tabellen oder tabellenloses Webdesign

Folgendes Beispiel wird gerne verwendet, um die Problematik von Tabellen zu verdeutlichen:

Bildtext 1 Bildtext 2 Bildtext 3

Für sehende Menschen sind hier 3 Bilder, jedes davon hat eine Bildunterschrift. Der von überflüssigen Tags bereinigte Quellcode - und damit der "lesbare" Inhalt ist aber "Bild 1" - Bild 2 - Bild 3 - Bildtext 1 - Bildtext 2 - Bildtext 3. Die Reihenfolge ist also falsch.

Im Quellcode kommen also zuerst die 3 Bilder, dann die 3 Bildtexte. Damit wären wir bei der Tabellen-Problematik: Mit Tabellen passiert es leicht, dass eigentlich zusammengehörige Elemente voneinander getrennt werden.

Die Lösung hier wäre simpel:

Bildtext 1 Bildtext 2 Bildtext 3

Hier ist die Reihenfolge auch im Quellcode richtig und würde damit auch von jedem Screenreader richtig gelesen werden: Bild 1 - Bildtext 1 usw.

Eine analoge Problematik ergibt sich natürlich auch mit CSS: mit div-Containern kann noch viel mehr Unsinn getrieben werden, weil jeder Textblock frei positioniert werden kann. So kann ähnlich dem vielzitierten "Tabellentrick" mit CSS eine Menüleiste ganz einfach zwar links oben positioniert sein, aber ganz zuletzt im Quellcode - für Blinde natürlich ein Fiasko, weil jede Seite durchgelesen werden muss, um zur Navigation zu gelangen.

Der "Tabellentrick" Der (vermeintliche) Trick dient dazu, die tatsächliche und die sichtbare Reihenfolge zu vertauschen. (Code in Kurzform) <table> <tr><td>(leer oder BlindGif)</td> <td rowspan="2">Inhalt</td></tr> <tr><td>Menüleiste</td></tr> </table>

.... Inhalt .... .... Menü- leiste ... ...

Wichtig ist darauf zu achten, dass der Inhalt auch im Quellcode in der richtigen Reihenfolge enthalten ist. Ob man das mit CSS oder mäßigem Einsatz von Tabellen bewerkstelligt ist aber egal.

Es gibt aber auch Fälle, in denen der "Tabellentrick" durchaus Berechtigung hat, etwa wenn wesentliche Texte aus optischen Gründen rechts positioniert sind. Auf der Site faltzelte.at habe ich ihn zB verwendet, um die für Spider und für Sehbehinderte ungeeigneten Auflistungen ans Ende des Codes zu schieben.

Frames

Frames stellen kein technisches Problem dar, es gilt letztlich dasselbe wie für Tabellen. Dort wo Frames zur Trennung von Menü und Inhalt verwendet werden, bereiten sie sogar weniger Probleme.

Semantisch richtige Auszeichnungen

Gemeint sind vor allem die Tags <h1> bis <h4>, die Headlines. Für Suchmaschinen sind sie ganz wichtig, besonders wenn sie in "natürlicher" Häufigkeit vorkommen. Für das tatsächliche Aussehen interessiert sich eine Suchmaschine nicht, solange es "vernünftig" aussieht. Klar: ein 2px H1 kommt heute nicht mehr so gut an.
Siehe dazu: Bewertung der Headlines <H1> - <H6>

 

Konkret:

Wer seine Website barrierefrei macht, macht sie prinzipiell auch für Suchmaschinen zugänglich, zum Teil gilt auch der Umkehrschluss. Darüber hinaus hat das eine mit dem anderen wenig zu tun, vor allem dort, wo die Tricks beginnen (Hidden Text usw)

Wieder einmal will ich aber in Erinnerung rufen: Wir machen Websites für Menschen und nicht für Suchmaschinen.