Techniken für WCAG 2.0

Zum Inhalt

-

C27: Dafür Sorge tragen, dass die DOM-Reihenfolge passend zur visuellen Reihenfolge ist

Anwendbarkeit

CSS benutzt mit HTML und XHTML

Die Technik bezieht sich auf:

Beschreibung

Das Ziel dieser Technik ist es sicherzustellen, dass die Reihenfolge des Inhalts im Quellcode die gleiche ist, wie in der visuellen Darstellung des Inhalts. Die Reihenfolge des Inhalts im Quellcode kann vom Autor mit CSS zu jeder erdenklichen Anzahl an visuellen Darstellungen geändert werden. Jede Reihenfolge kann an sich sinnvoll sein, aber dies kann bei Benutzern von assistierenden Techniken zur Verwirrung führen. Dies könnte dadurch passieren, dass der Benutzer die vom Autor festgelegte Darstellung ausschaltet, indem er direkt vom Quellcode aus auf den Inhalt zugreift (wie beispielsweise mit einem Screenreader) oder indem er per Tastatur mit dem Inhalt interagiert. Wenn ein blinder Benutzer, der die Seite mit einem Screenreader, der dem Quellcode folgt, liest, zusammen mit einem sehenden Benutzer arbeitet, der die Seite in der visuellen Reihenfolge liest, dann können sie verwirrt werden, wenn sie in unterschiedlicher Reihenfolge auf Informationen treffen. Ein Benutzer mit einem verringerten Sehvermögen, der eine Vergrößerungssoftware in Kombination mit einem Screenreader benutzt, kann verwirrt sein, wenn es erscheint, als würde die Lesereihenfolge auf dem Bildschirm springen. Ein Tastaturbenutzer kann Probleme damit haben vorherzusehen, wo der Fokus als nächstes liegen wird, wenn die Reihenfolge des Quellcodes nicht der visuellen Reihenfolge entspricht.

Es kann auch Situationen geben, in denen die visuell dargestellte Reihenfolge notwendig für das Gesamtverständnis der Seite und wenn die Quellcode-Reihenfolge anders dargestellt wird, kann es viel schwieriger sein, sie zu verstehen.

Wenn die Quellcode-Reihenfolge der visuellen Reihenfolge entspricht, dann liest jeder den Inhalt in der gleichen (korrekten) Reihenfolge und interagiert damit in der gleichen (korrekten) Reihenfolge.

Anmerkung: Das tabindex-Attribut in HTML hat zwei Funktionen. Eine ist es, ein Element fokussierbar zu machen und die andere ist es, dem Element eine Position in der Fokus-Reihenfolge zuzuweisen. Ein tabindex von 0 macht ein Element fokussierbar, fügt es aber der Fokusreihenfolge in der Reihenfolge der Quellcode-Elemente hinzu. Die Fokusreihenfolge folge den positiven Werten des tabindex in aufsteigender Reihenfolge. Das Festlegen von tabindex-Werten, das in einer Reihenfolge, die sich von der Reihenfolge der Elemente im Document Object Model (DOM) unterscheidet, resultiert, kann bedeuten, dass die Reihenfolge für Benutzer mit assistierenden Techniken nicht korrekt ist. Dies liegt hauptsächlich daran, dass die tabindex-Eigenschaft im HTML oder XHTML und nicht im CSS festgelegt wird. Es kann sein, dass sich dies in zukünftigen Spezifikationen ändert. Es kann sich außerdem von der Reihenfolge der visuellen Darstellung unterscheiden.

Beispiele

Ressourcen

Ressourcen sind nur zu Informationszwecken und keine offizielle Empfehlung.

Tests

Vorgehensweise

  1. Untersuchen Sie visuell die Reihenfolge des Inhalts auf der Webseite, so wie dies dem Endbenutzer präsentiert wird.

  2. Untersuchen Sie die Elemente im DOM, indem Sie ein Werkzeug benutzen, das es ihnen erlaubt, das DOM zu sehen.

  3. Stellen Sie sicher, dass die Reihenfolge des Inhalts in den Quellcode-Abschnitten der visuellen Präsentation des Inhalts auf der Webseite entsprechen. (z.B. ist die Reihenfolge für eine Seite in englischer Sprache von oben nach unten und von links nach rechts.)

Erwartete Ergebnisse

Wenn dies eine ausreichende Technik für ein Erfolgskriterium ist, dann bedeutet das Scheitern an diesem Testverfahren nicht zwangsläufig, dass das Erfolgskriterium nicht auf irgendeine andere Art und Weise erfüllt wurde, sondern nur, diese Technik nicht erfolgreich implementiert wurde und nicht benutzt werden kann, um die Konformität zu erklären.