schrankenlos.ch | Konzept |

Es folgt die Navigation. Drücken Sie die Tabulatortaste um sich die Rubriken schrittweise anzuhören.

Einführung «schrankenlos.ch»

Motto
Schrankenloses Webdesign: Einfach für alle

Worum geht es?
Viele Webseiten sind heute zu kompliziert und sie sind für viele Leute nur schwer verständlich. Dies gilt in besonders grossem Masse für die Behinderten aller Art. Auch sie sollen die Möglichkeiten des Internets nutzen können. Es geht um die gleichberechtigte Teilhabe aller Menschen an der Informationsgesellschaft.

Kriterien
Die Kriterien für schrankenloses Webdesign orientieren sich an den folgenden vier Prinzipien:

Wahrnehmbarkeit
Bedienbarkeit
Verständlichkeit und Orientierung
Robustheit

Wahrnehmbarkeit
Alle auf der Website enthaltenen Informationen und Funktionen sollen so zur Verfügung gestellt werden, dass sie von jedem Benutzer erkannt und somit bedient werden können.

Bedienbarkeit
Alle Elemente, die benötigt werden, um sich die Inhalte der Website zu erschliessen, sollen von jedem Benutzer bedienbar sein.

Verständlichkeit und Orientierung
Die Gestaltung der Inhalte und die Handhabung von Bedienelementen sollen leicht verständlich sein. Eine klare und leicht verständliche Sprache kommt allen Besucherinnen und Besuchern einer Website zugute. Texte sollen so kurz und einfach wie möglich sein.

Robustheit
Die verwendeten Webtechnologien sollen es erlauben, dass jeder Benutzer mit aktuellen und möglichst auch zukünftigen Zugangstechnologieren auf die Inhalte der Webseiten zugreifen kann. Menschen mit Behinderungen nutzen zum Teil Zugangstechnologien wie Vergrösserungssoftware, Screenreader-Software oder Spracheingaben.

Zahlenangaben
In der Schweiz leben etwa 500'000 Menschen mit Behinderungen. Zusätzlich haben auch viele Normalos Mühe mit der Zugänglichkeit zum Internet. Es ist wohl kaum übertrieben, wenn wir in unserem Land mit etwa zwei Millionen Adressaten von schrankenlosem Webdesign rechnen.

Grundaussage
Ein barrierefreies oder schrankenloses Webdesign ist nicht nur oft gesetzliche Pflicht, sondern es ist auch:

menschlich
kundenfreundlich
kostengünstig (die Mehrkosten sind geringer als der Mehrnutzen)
ästhetisch
wertsteigernd
innovativ
präventiv
kreativ

Wahrnehmung: Einzelne Punkte

Beschriftung von Grafiken: Bilder und Grafiken sind über das ALT-Attribut klar verständlich beschriftet
Imagemaps: Bei Imagemaps werden die Regionen mittels alt-Attribut und redundanten Textlinks gekennzeichnet
Beschreibung von Grafiken: Wichtige Grafiken werden zusätzlich mit LONGDESC textlich beschrieben
Multimedia: Multimedia-Inhalte werden nicht nur sichtbar, sondern auch hörbar beschrieben
Farbe: Mit Farbe übermittelte Informationen müssen auch ohne Farbe verfügbar sein
Farbkontraste: Der Kontrast zwischen Vorder- und Hintergrundfarbe erlaubt leichtes Lesen, auch bei Invertierung der Farben
Links: Links müssen vom Fliesstext klar unterscheidbar sein
Texte für Links: Texte für Links müssen auch dann noch Sinn machen, wenn sie ausserhalb des Zusammenhangs gelesen werden
Schrift: Die Fontwahl eignet sich für das Vergrössern,es gibt keine Texte in Bildern
Schriftgrösse: Schriftgrösse im Code nicht absolut, sondern relativ festlegen
Textplazierung: Texte linksbündig anordnen
Schriftformatierung: Die Schriftformatierung erfolgt mit CSS
Gestaltung: Die Gestaltung und das Layout erfolgt mit CSS
Aufbau: Aufbau des Dokumentes in logischer Reihenfolge, damit die Abfolge auch bei abgeschaltetem CSS korrekt angezeigt wird
Scripts: Seiten sollen auch bei ausgeschalteten Scripts verwendbar sein
Navigation: Eine Navigationslösung mit CSS soll auch bei ausgeschaltetem Javascipt funktionieren
Noscript: Ist eine Seite bei ausgeschaltetem Script nicht mehr verwendbar, so müssen Informationen auf einer alternativ zugänglichen Seite bereitgestellt werden

Bedienbarkeit: Einzelne Punkte

Formulare: Die Beschriftung eines Formularelementes ist mit dem Element explizit verknüpft
Schaltflächen: Schaltflächen sind so gross, dass sie für Menschen mit eingeschränkter Motorik mit der Maus bedienbar sind
Tabulatoren: Alle Bedienungselemente sind mit der TAB-Taste erreichbar
Navigation: Die Navigation am Seitenkopf ist durch einen Link überspringbar
Reload: Die Seite wird nie automatisch frisch geladen bzw. weitergeleitet
Flackern: Es gibt keine Animationen oder bewegte Bilder, welche ein Bildschirmflackern verursachen
Lesen: Das Lesen wird durch keine blinkenden oder bewegten Inhalte oder Laufschriften erschwert
Toneinblendungen: Toneinblendungen sind abschaltber und stören somit das Arbeiten mit einem Screenreader nicht
Links: Nebeneinander liegende Text- und Bildschirmlinks, welche auf dasselbe Ziel verweisen, werden zusammengefasst
Titel: Jede Seite trägt einen aussagekräftigen Titel

Verständlichkeit und Orientierung: Einzelne Punkte

Datentabellen: Zeilen- und Spaltenbeschriftungen verwenden, Kopfzeilen in nachfolgenden Zeilen referenzieren, Tabelle mit SUMMARY beschreiben
Layouttabellen: Layouttabllen nur verwenden, wenn auch bei einer Linearisierung ein Sinn entsteht
Frames: Frames mit kurzen und aussagekräftigen Namen und Titeln versehen
Text: Texte mit HTML-Strukturelementen in kurze, überschaubare Abschnitte unterteilen
Sprache: Sprache des Dokumenttextes identifizeren und fremdsprachige Elemente kennzeichnen
Abkürzungen: Abkürzungen mit HTML-Attributen kennzeichnen
Formulierungen: Klare und einfache Sprache verwenden
Navigation: Die Navigationsmechanismen werden in stets gleichartiger Form verwendet
Präsentation: Der Präsentationsstil ist über alle Seiten hinweg gleichartig

Robustheit: Einzelne Punkte

Dateien: HTML-fremde Inhalte (PDF-Dateien, usw.) sind beim Link mit Typ und Grösse gekennzeichnet
Pop-Up-Fenster: Pop-Up-Fenster nur nach Vorankündigung öffnen
Doctype: Auf jeder Seite gibt es ein DOCTYPE-Statement mit einer Validierung gegen einen Standard
W3C: Es müssen aktuelle W3C-Techniken genutzt werden
Textversion: Es ist in der Regel auf gesonderte Textversion einer Webseite zu verzichten. Wird das in Ausnahmefällen doch gemacht, so muss die Textversion möglichst vollständig der grafischen Version entsprechen