Verbesserter Zugang

(Auszug aus "CSS − Anspruchsvolle Websites mit Cascading Stylesheets" von Rachel Andrew & Dan Shafer)

Sollte sich Ihnen einmal die Gelegenheit bieten, mit einem sehbehinderten Internetnutzer durch das Web zu surfen, nutzen Sie sie! Oder besorgen Sie sich eine Vorlesesoftware, schalten den Monitor ab und hören mal, was passiert.

Sehbehinderte Menschen haben es mit Webseiten, deren Layout mit Tabellen, Bildern und anderem nicht-semantischem HTML aufgebaut ist, sehr schwer. Normalerweise liest ihnen der Screenreader den Seiteninhalt von oben nach unten laut vor. Es ist nicht unüblich, dass Screenreader bei vielen modernen, tabellenbasierten Layouts die Benutzer 30 Sekunden lang oder länger mit Unsinn berieseln, bevor der eigentliche Inhalt der Seite beginnt. Ein Beispiel einer solchen Ansage einer tabellenbasierten Seite folgt nun:

Table with one column and five rows, Table with three columns and one row, Link, Graphic, slash logo underline main dot gif, Table end, Table with two columns and one row, Link, Graphic, slash nav underline about underline us dot gif, Link, Graphic, slash nav underline site underline map dot gif, Table end, Table end, Table with one column and twenty-six rows, Table with one column and seventeen rows …

Wenn Sie jetzt der Meinung sind, dass dies, gelinde gesagt, ärgerlich ist, dann stellen Sie sich vor, dass Sie das für jede und alle besuchten Seiten über sich ergehen lassen müssen!

CSS-Design und semantischer HTML-Code beseitigen diesen Sprachmüll fast vollständig, weil sie sicherstellen, dass jedes im Dokument verwendete Tag eine strukturelle Bedeutung hat, die für den Betrachter oder Hörer sinnvoll ist. Ein akustischer Browser ignoriert die Formatierungseigenschaften, die in der CSS-Datei definiert sind, sodass der Benutzer sich diese nicht anzuhören braucht.

Wenn ein sehbehinderter Benutzer auf eine Seite mit rein semantischem HTML gelangt, muss er sich nicht mehr fragen, ob etwa ein Wort aufgrund seiner Bedeutung in Fettschrift steht oder weil der Designer es nur besser aussehen lassen wollte. Textelemente, die allein aus Designgründen ausgezeichnet werden, sollten ihre Eigenschaften nur durch CSS bekommen. Seitenelemente, die in ihrem semantischen Kontext hervorgehoben werden sollen, werden in HTML mit semantischen Elementen wie <strong> oder <em> ausgezeichnet. Visuelle Browser geben diese Tags zwar auch als Fett- beziehungsweise Kursivschreibung wieder. Ihre eigentliche Bestimmung ist aber, im Gegensatz zu den visuell gleichwertigen Designelementen <b> und <i>, ihre inhaltliche Aussage und nicht ihre Darstellung.

Es gibt viele umfassende Richtlinien für Entwickler, die ihre Sites für benachteiligte Benutzer zugänglich machen möchten. Pflichtlektüre sollten die offiziellen Web Content Accessibility Guidelines 1.0 (WCAG) sein sowie Guideline 3 mit dem Schwerpunkt auf semantischer Auszeichnungsweise. Wir werden bei einigen Projekten in diesem Buch noch darauf zu sprechen kommen.

  

<< zurück

vor >>