Barrierefrei

Diese Website ist konform zu Level Triple-A Web Content Accessibility Guidelines 1.0. Das heißt sie erfüllt strenge Kriterien zur Barrierefreiheit. Diese stellen sicher, daß auch Menschen mit verschiedensten Einschränkungen bzw. Behinderungen problemlos hier unterwegs sein können. Die Kriterien lassen sich teilweise automatisch prüfen; einen guten Anhaltspunkt gibt der Online-Überprüfungsdienst WebXAct.

Automatisch generieren lassen kann man sich für meine Homepage

• den WebXAct-Report oder
• die WAVE Analyse.

CSS statt Tabellen

Für das Layout werden keine Tabellen eingesetzt, da viele Vorleseprogramme damit Schwierigkeiten haben. Stattdessen basiert das Layout vollständig auf Cascading Style Sheets (CSS). Tabellen erschweren sehbehinderten Nutzern das Lesen der Seite, da die dafür notwendigen Vorleseprogramme nur die Struktur der Tabellen sehen können, nicht jedoch, was der Autor graphisch damit bezwecken will.

Neben der einfacheren Handhabung hat dies den Vorteil, daß die Seite gegenüber einem tabellenbasierten Layout bei konsequenter Anwendung um ein Viertel weniger Plattenplatz beansprucht, gemessen an meinen Seiten.

Zudem kann man einfach zwischen verschiedenen Darstellungsarten wechseln. Leistungsfähige Browser wie Firefox/Mozilla oder Opera können dies von Haus aus (Menü Ansicht–Seitendarstellung/Style verwenden), für die anderen existieren JavaScript-Funktionen zum umschalten. So kann man sich diese Seite anschauen im Standardstil, in der Druckansicht, oder ganz ohne Layout. Zusätzlich wird die Wahl des Layout für die aktuelle Sitzung in einem Cookie gespeichert, damit die Einstellung über die Seiten hinweg erhalten bleibt.

Serialisierbarkeit

Damit geht einher, daß die Seiten auch sinnvoll rein serialisiert, also ohne spezielle graphische Anordnung der Elemente zu lesen sein müssen. Um dies zu sehen, können Sie bei Ihrem Browser die Interpretation von CSS ausschalten oder einen Textbrowser wie Lynx versuchen. Sinn und Zweck ist es natürlich, daß auf diese Weise auch sogenannte Screen Reader, also Vorleseprogramme, gut mit der Seite zurechtkommen.

Unvorhergesehene Ereignisse

Wenn etwas passiert, was der Anwender nicht unbedingt erwartet, dann sollte man ihn darauf hinweisen. Prominentes Beispiel: Meine externen Links öffnen alle ein neues Fenster, sofern der Benutzer dies wünscht. Darauf weise ich in einem Tooltip hin, in dem auch der letzte Besuch der referenzierten Seite steht, und zusätzlich mit einem speziellen Piktogramm:  . Den gleichen Informationszweck verfolgt das Piktogramm für Dateidownloads:  . Interne Links sind nicht speziell gekennzeichnet, da diese ja nichts außergewöhnliches darstellen.

Das Verhalten bei externen Links ist vom Benutzer wählbar über eine Auswahlbox und wird in einem Cookie gespeichert, damit sie für den jeweiligen Benutzer auf allen meinen Seiten gültig ist.

ALT-Attribut für Graphiken

Wirklich alle eingebundenen Graphiken haben ein ALT-Attribut, das einen Alternativtext für die jeweilige Graphik beinhaltet. Ist die Graphik rein kosmetischer Natur und hat keine inhaltliche Relevanz, ist das ALT-Attribut leer, ansonsten enthält es eine Erklärung des Inhalts oder der Funktion der Graphik. Das ALT-Attribut ist auch nicht der richtige Platz für den Bildtitel, denn dafür gibt es das TITLE-Attribut.

Nebenbei bemerkt fordert der XHTML-Standard das ALT-Attribut für Graphiken.

Logisches Markup

Eine Überschrift ist nicht in erster Linie ein visuell hervorgehobenes Element, sondern ein logischer Bestandteil eines Textes. Und somit sollten sie, aber auch nur sie echte Überschriften mittels HTML als solche gekennzeichnet werden. Selbiges gilt für hervorgehobenen Text aller Art wie Zitate, Betonungen u.ä.

Ein Beispiel dafür ist auch das Navigationsmenü. Wenn Sie einmal zur Druckansicht wechseln, dann siehen Sie, daß das Navigationsmenü eine einfache geschachtelte Liste ist, die also abgesehen von der graphischen Aufbereitung auch strukturelle Information enthält.

Javascript

Javascript ist ein nettes Hilfsmittel, um bestimmte Funktionalitäten realisieren zu können. Hinsichtlich der Barrierefreiheit muß aber sichergestellt sein, daß diese Funktionalität auch ohne aktiviertes Javascript erreicht werden kann, und der Mehrwert rein kosmetischer Natur ist.

Bestes Beispiel ist das Öffnen externer Links in einem neuen Fenster. Ist dies ausschließlich mit Javascript realisiert, hat ein Besucher ohne Javascript keine echte Freude an der Seite, da sich nichts tut. Nebenbei können auch Suchmaschinen nichts mit JavaScript-Links anfangen. Sinnvollerweise funktioniert der Link also auch ohne.

Diese Seiten funktionieren ohne nennenswerte Einschränkungen auch ohne aktiviertes Javascript. Die einzigen beiden Funktionen, die Javascript wirklich benötigen, sind der Scrollmechanismus der Navigationsleiste und das Ändern des Ansichtsmodus. Wie oben erwähnt, beherrschen moderne Browser jedoch letzteres ohnehin selbst.

Maus und Tastatur

Die Website ist sowohl mit Maus als auch mit Tastatur bedienbar; alles, was auf Maus reagiert, reagiert auch auf die entsprechenden Tastatureingaben, so zum Beispiel die Navigationsleiste.

Versuch es selbst: Hangeln Sie sich mit der Tabulatortaste durch die Seite oder probiere die Tastaturkürzel in den Formularen auf der Feedback- und Gästebuchseite aus!

Inhaltliches

Sind mehrere Verweise in einer Gruppe, so sind diese durch ein Trennzeichen separiert, auch in den Menüs. Durch CSS ist dies in der graphischen Version nicht zu sehen.

Ein Wort zu Netscape 4.x 

Nachdem sich aus der Erfahrung gezeigt hat, daß der alte Netscape-Browser mit vielen CSS-Eigenschaften absolut unvorhersehbare Ergebnisse erzeugt, wird mit diesem Browser nicht das Standardlayout angezeigt, sondern ein der Druckansicht ähnliches. So sieht ein Netscape-4-Benutzer den vollständigen Inhalt in derselben textuellen Fassung wie alle anderen auch, nur das Design bleibt ihm jedoch verborgen. Angesichts der rückläufigen Verbreitung des Browsers halte ich dies für vertretbar, zumal ja keine Fehler oder funktionalen Schwächen den Besucher behindern, sondern nur einige Designelemente anders dargestellt werden.

Wenn Sie ein Benutzer von Netscape 4.x sind, dann empfehle ich Ihnen dringend einen neuen Browser. Wie wäre es denn zum Beispiel mit Firefox oder Opera?