Marco: Wohin mit <nav>?

Hi, wenn ich nach <nav> suche, finde ich bisher nur welchen Inhalt es haben kann, leider nie, wo es innerhalb einer html-Datei stehen muss. Kann mich jemand aufklären?

  1. Hallo Marco,

    wenn ich nach <nav> suche, finde ich bisher nur welchen Inhalt es haben kann, leider nie, wo es innerhalb einer html-Datei stehen muss. Kann mich jemand aufklären?

    Also das Wiki verweist im Artikel über nav auf https://wiki.selfhtml.org/wiki/HTML/Tutorials/HTML5/Seitenstrukturierung.

    Viele Grüße
    Robert

    1. Ich gehe mal davon aus, dass Du DAS Navigationsmenü meinst.

      https://wiki.selfhtml.org/wiki/HTML/Tutorials/HTML5/Seitenstrukturierung:

      Während es früher oft empfohlen wurde, das Navigationsmenü unterhalb des Inhalts am Ende der Seite zu notieren und erst mit CSS oben zu positionieren, ist es heute üblich die Navigation unterhalb des header zu platzieren und Benutzern von Screenreadern bei umfangreichen Menüs einen Skip-Link zum Überspringen anzubieten.

      Es geht hier um die Position der Notierung im HTML-Quelltext. Ich persönlich bin ein Freund der früheren Methode und würde (für Screenreader) eher einen Skip-Link zum Menü anbieten...

      Die Darstellung der Navigation wird dann durch das CSS entschieden:

      Große Bildschirme: klassisch neben dem dem Inhalt. Bei kleinen Bildschirmen erscheint das "Hamburger-Menü" also ein Button, bei dessen Gebrauch das Menü „aufscheint“.

      Screenreader halten sich, soweit ich das weiß an die Reihenfolge im HTML-Quelltext. Ich teste also mit Programmen, die Webseiten in Terminals darstellen: Lyncs, Links, w3m.

      Wenn Du die benutzt kannst Du herausfinden was „richtig“ ist. Versuche einfach auf Deiner Website (der Gesamtheit der Seiten also) schnell an Informationen zu kommen.

  2. Hallo Marco,

    grundsätzlich: da, wo Du es brauchst und nicht da, wo nur noch Text erlaubt ist.

    Formal: Es gibt recht strenge Regeln zu Inhaltskategorien. Die sind mit HTML5 eingeführt worden. Für jedes Element ist festgelegt:

    • welche Art von Inhalt stellt es dar
    • welche Art von Inhalt darf es enthalten

    nav ist ein Fluss-Element (=es stellt fließenden Inhalt (flow content) dar). Das ist die allgemeinste Kategorie - was aber andersrum heißt, dass es nur dort erscheinen darf, wo diese allgemeine Kategorie auch zulässig ist.

    Frag mich nicht, warum die HTML Spezifikation dazu "fließender Inhalt" sagt. Unter Fließtext verstehen wir im deutschen genau das Gegenteil, nämlich das, was die Spec "phrasing content" nennt. Und "phrasing content" ist einer der heißesten Begriffe überhaupt, weil alle Übersetzungen, die man dafür findet, scheußlich sind. "phrasenbildender Inhalt", "phrasierender Inhalt" - brrr. Wir schwimmen im Wiki zwischen "Stil"- und "Aussagen"-Elementen.

    Letztlich muss man es nachgucken. In unserem Wiki findest Du:

    • eine Übersicht über die Kategorien

      • welche Kategorien gibt es und welche ist eine Teilmenge welcher anderen
      • welche Elemente sind in welcher Elternkategorie erlaubt
    • Bei den Elementreferenzen steht, welches Element welche Kategorie enthalten darf. Zum Beispiel:

      • h1 - darf Text und Stil-Elemente („phrasing content“), enthalten, also kein nav.
      • main - darf Fluss-Elemente enthalten, also nav

    Es ist leider nicht trivial und mit Übersichten kaum lösbar.

    Rolf

    --
    sumpsi - posui - obstruxi
    1. Hi,

      Formal: Es gibt recht strenge Regeln zu Inhaltskategorien. Die sind mit HTML5 eingeführt worden.

      Ist das so? Mindestens bei HTML 4 gab's das doch auch schon.

      Siehe z.B. HTML 4 Specification

      cu,
      Andreas a/k/a MudGuard

      1. Hallo MudGuard,

        meinst Du das davor? block vs inline Elements? Block darf Block oder Inline enthalten und Inline nur Inline? Ja, das war HTML4, relativ grobschlächtig und das kann man noch nicht Kategorien nennen. HTML5 differenziert das.

        Oder verstund ich Dich miss?

        Rolf

        --
        sumpsi - posui - obstruxi
        1. Hi,

          meinst Du das davor? block vs inline Elements? Block darf Block oder Inline enthalten und Inline nur Inline? Ja, das war HTML4, relativ grobschlächtig und das kann man noch nicht Kategorien nennen. HTML5 differenziert das.

          %flow, %inline, %heading, %list, %preformatted, %phrase, %fontstyle usw.

          Mag ja sein, daß HTML 5 das noch etwas genauer aufteilt, aber Kategorisierung und strenge Regeln, was wo vorkommen darf, gab es eben schon vorher. Das wurde nicht, wie Du behauptest, mit HTML 5 eingeführt.

          cu,
          Andreas a/k/a MudGuard

          1. Hallo MudGuard,

            ich verstehe von der DTD Sprache zu wenig, um das da herauslesen zu können. Wenn Du es sagst, muss ich es glauben.

            Rolf

            --
            sumpsi - posui - obstruxi
            1. @@Rolf B

              Hallo MudGuard,

              ich verstehe von der DTD Sprache zu wenig, um das da herauslesen zu können.

              Ich sehne mich ein bisschen nach der Zeit zurück, als HTML über eine recht leicht lesbare Grammatik in Forn einer DTD definiert wurde.

              Wenn Du es sagst, muss ich es glauben.

              MudGuard kannste glauben. Er war mein Lehrmeister, der mich immer wieder gepusht hat, die Spec richtig zu verstehen.

              😷 LLAP

              --
              “When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon
  3. Hallo Marco,

    wenn ich nach <nav> suche, finde ich bisher nur welchen Inhalt es haben kann, leider nie, wo es innerhalb einer html-Datei stehen muss.

    Es muss nirgendwo stehen, ist ja kein Pflichtelement (korrigiert mich wenn falsch).

    Kann mich jemand aufklären?

    Innerhalb des <body> spielt es keine Rolle wo und wieviele <nav> du schreibst. Nur besser ist es schon einigermassen deinem Layout entspreched, ohne dass CSS das wieder im richtigen Rahmen frickeln muss, wenn nicht notwendig.

    Darüber hinaus sieht man oft Navigationslinks im Footerbereich, dort brauchst du natürlich auch kein <nav> um ein paar Links zu platzieren.

    Gruss
    Henry

    --
    Meine Meinung zu DSGVO & Co:
    „Principiis obsta. Sero medicina parata, cum mala per longas convaluere moras.“