keine Kommentare

Navigationen - oben oder unten?

Aus einer unverfänglichen Frage im Forum (Warum soll die Navigation im Quelltext neuerdings über dem Haupttext stehen?) entwickelte sich ein umfangreicheres Projekt, das noch nicht ganz abgeschlossen ist:

Position des nav-Elements im HTML-Markup

Mit Erwartungskonformität (ISO 9241-110)[1][2] werden Konventionen zusammengefasst, die dem Nutzer eine einheitliche, ihm vertraute Gestaltung sichern.

Nutzer sind es gewöhnt, die Hauptnavigation auf einer Webseite oben vorzufinden. Oder links. (Schreibrichtung von links nach rechts, Zeilen von oben nach unten vorausgesetzt.) Man bräuchte schon sehr gute Gründe, um von dieser Konvention abzuweichen.

Oben bzw. links heißt: am Anfang im DOM. Die visuelle Reihenfolge sollte der Reihenfolge im DOM entsprechen; andernfalls dürften sehende Tastaturnutzer und sehende Screenreader-Nutzer ziemlich verwirrt sein. [3]

Ein Flyout-Menü

Aus der folgenden Diskussion um Skip-Links, die es ermöglichen direkt zum Inhalt zu springen, sollte ein neues Beispiel für das SELF-Wiki entstehen:

HTML/Tutorials/Navigation/Flyout-Menü

Bis jetzt finden sich dort zwei Varianten:

  1. Eine Variante erreicht die Interaktivität des Auf- und Zuklappens mit ein bisschen JavaScript.
  2. Die zweite Variante wählt die vermeintlich „einfachere“ Version mit dem details-Element. Allerdings zeigten Tests, dass hier die Zugänglichkeit nicht 100%ig gegeben ist, was in einem anderen Thread heiß diskutiert wurde. [4]

Sobald es beruflich etwas ruhiger wird, wird der Wiki-Artikel fertig gestellt! Versprochen!

  1. Die EN ISO 9241 - 10 ↩︎

  2. Dialogprinzipien wurden überarbeitet und heißen jetzt Interaktionsprinzipien – Usability-Norm ISO 9241-110 in neuer Auflage erschienen ↩︎

  3. Gunnar Bittersmann im SELF-Forum ↩︎

  4. SELF-Forum: Menü mit details und summary im Screenreader VoiceOver ↩︎

eingeordnet unter:

veröffentlicht von Matthias Scharwies

Antwort verfassen Antwort mit Zitat verfassen