Last modified: February 9, 2011

Bevor es wieder nach vorne gehen kann, noch ein weiterer Rückblick zu einem Thema, dass mich gleich zweifach beschäftigt hat: Barrierefreiheit optimieren mit der Web Developer Toolbar.

Es gibt zwar eine durchaus stattliche Anzahl von Browser-Erweiterungen, die sich dazu eignen, die Barrierefreiheit von Webseiten zu optimieren. Die Web Developer Toolbar ist neben der Erweiterung Firebug mittlerweile ein selbstverständliches Werkzeug für die tägliche Arbeit eines Webentwicklers. Dass die Toolbar auch noch helfen kann, etwa die Überschriftenhierarchie zu kontrollieren, Datentabellen zu optimieren und die Webseite ohne Farben darzustellen, macht sie noch unverzichtbarer.

Im Artikel Barrierefreiheit optimieren mit der Web Developer Toolbar habe ich mich mit diesen drei Optimierungen genauer beschäftigt. Freilich gibt es für die Überschriftenhierarchie und die Datentabellen eigene Spezial-Erweiterungen, aber wenn man verschiedene Optionen in der Toolbar kombiniert, lässt sich doch sehr viel damit herausholen. Hier auszugsweise zur Überschriftenhierarchie:

Die Dokumentengliederung ist hilfreich, um sich einen generellen Überblick zu verschaffen. Mit der Option Hervorheben > Überschriften hervorheben werden die Überschriften auf der Webseite angezeigt. Die Option Hervorheben > Elementnamen beim Hervorheben einblenden sollte man ebenso aktivieren, um den Namen des HTML-Elements anzuzeigen. Mit dieser Kombination kann man Struktur und Positionen der Überschriften kontrollieren. Im Bedarfsfall erkennt man schnell, wo noch Überschriften fehlen oder wo die Verteilung noch nicht wirklich stringent ist.

Quelle:Egger, Sylvia: Barrierefreiheit optimieren mit der Web Developer Toolbar, in: Webkrauts 12/2008

Das Thema habe ich noch einmal aufgegriffen im Rahmen der Technikwürze 127: Accessibility Tests mit der Web Developer Toolbar (zusammen mit Sascha Postner, Länge: 1:08 Stunde). Dort habe ich noch weitere Themen wie Formulare, Linearisierung, Sprachauszeichnung, Akronyme und Abkürzungen und Userstyles erläutert. Kurz habe ich auch Alternativen wie die Erweiterungen Accessibar oder den Table Inspector vergleichend dargestellt.

Abgesehen von der Problematik, im Rahmen eines nicht-visuellen Podcasts all die Optionen nachvollziehbar darzustellen, konnte ich das Thema doch umfassend behandeln. Trotz allem waren beide Herangehensweisen noch immer zu kursorisch, daher möchte ich diese Thematik demnächst hier vertiefen und auch Alternativen adäquat darstellen.