# 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. [^1]: [Die EN ISO 9241 - 10](http://www.kommdesign.de/texte/din.htm) [^2]: [Dialogprinzipien wurden überarbeitet und heißen jetzt Interaktionsprinzipien – Usability-Norm ISO 9241-110 in neuer Auflage erschienen](https://www.procontext.de/aktuelles/2020/06/iso-9241-110-in-neuer-auflage-erschienen.html) 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] [^3]: Gunnar Bittersmann im [SELF-Forum ](https://forum.selfhtml.org/self/2022/apr/25/warum-soll-die-navigation-im-quelltext-neuerdings-uber-dem-haupttext-stehen/1798778#m1798778) # 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ü](https://wiki.selfhtml.org/wiki/HTML/Tutorials/Navigation/Flyout-Men%C3%BC) 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] [^4]: SELF-Forum: [Menü mit details und summary im Screenreader VoiceOver](https://forum.selfhtml.org/self/2022/may/01/menu-mit-details-und-summary-im-screenreader-voiceover/1798815#m1798815) Sobald es beruflich etwas ruhiger wird, wird der Wiki-Artikel fertig gestellt! Versprochen!

# 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. [^1]: [Die EN ISO 9241 - 10](http://www.kommdesign.de/texte/din.htm) [^2]: [Dialogprinzipien wurden überarbeitet und heißen jetzt Interaktionsprinzipien – Usability-Norm ISO 9241-110 in neuer Auflage erschienen](https://www.procontext.de/aktuelles/2020/06/iso-9241-110-in-neuer-auflage-erschienen.html) 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] [^3]: Gunnar Bittersmann im [SELF-Forum ](https://forum.selfhtml.org/self/2022/apr/25/warum-soll-die-navigation-im-quelltext-neuerdings-uber-dem-haupttext-stehen/1798778#m1798778) # 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ü](https://wiki.selfhtml.org/wiki/HTML/Tutorials/Navigation/Flyout-Men%C3%BC) 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] [^4]: SELF-Forum: [Menü mit details und summary im Screenreader VoiceOver](https://forum.selfhtml.org/self/2022/may/01/menu-mit-details-und-summary-im-screenreader-voiceover/1798815#m1798815) Sobald es beruflich etwas ruhiger wird, wird der Wiki-Artikel fertig gestellt! Versprochen!

# Position des nav-Elements im HTML-Markup Mit '''Erwartungskonformität''' ([ISO 9241-110])[^1][^2] werden Konventionen zusammengafasst, die dem Nutzer eine einheitliche, ihm vertraute [^1]: [Die EN ISO 9241 - 10](http://www.kommdesign.de/texte/din.htm) [^2]: [Dialogprinzipien wurden überarbeitet und heißen jetzt Interaktionsprinzipien – Usability-Norm ISO 9241-110 in neuer Auflage erschienen](https://www.procontext.de/aktuelles/2020/06/iso-9241-110-in-neuer-auflage-erschienen.html) *Ich will auf der Webseite das Menü suchen müssen.* — kein Nutzer, jemals 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.

Servus! Herzliche Grüße Matthias Scharwies -- Einfach mal was von der [ToDo-Liste](https://wiki.selfhtml.org/wiki/Kategorie:ToDo) auf die Was-Solls-Liste setzen.“