nav

Das HTML Element <nav> zeichent einen Seitenbereich aus, der dazu bestimmt ist Navigationslinks bereitzustellen, die entweder zum aktuellen Dokument oder zu anderen Dokumenten zeigen. Häufige Beispiele für Navigationsbereiche sind Menüs, Inhaltsverzeichnisse oder andere Verzeichnisse.

Inhaltskategorien Fließender Inhalt, Unterteilender Inhalt, Fühlbarer Inhalt.
Erlaubter Inhalt Fließender Inhalt.
Tag Wegfall Keine, sowohl das Anfangs- als auch das End-Tag sind erforderlich.
Erlaubte Elternelemente Alle Elemente die fließenden Inhalt akzeptieren.
Erlaubte ARIA-Rollen Keine
DOM interface HTMLElement

Attribute

Dieses Element besitzt nur die globalen Attribute.

Verwendungshinweise

  • Es ist nicht nötig, dass alle Links in einen <nav> Element enthalten sind. Die Benutzung von <nav> ist nur für wichtige Abschnitte von Navigationslinks beabsichtigt; normalerweise enthält das <footer> Element eine Liste von Links, welche nicht in einem <nav> Element beinhaltet sein müssen.
  • Ein Dokument darf mehrere <nav> Elemente enthalten, zum Beispiel, eins für die Seitennavigation und eins für seiteninterne Navigation. aria-labelledby kann benutzt werden um Barrierefreiheit zu fördern (siehe Beispiel).
  • User-Agents, wie Bildschirmleser zur Unterstützung von Menschen mit Behinderung, können dieses Element benutzen, um zu entscheiden, ob das anfängliche Rendering von Navigationsinhalt ausgelassen werden kann.

Beispiel

In diesem Beispiel wird das <nav> Element benutzt, um eine ungeordnete Liste (<ul>) von Links. Mit entsprechenden CSS kann dies als Seitenleiste, Navigationsleiste oder Drop-Down-Menü verwendet werden.

<nav class="menu">
  <ul>
    <li><a href="#">Startseite</a></li>
    <li><a href="#">Über</a></li>
    <li><a href="#">Kontakt</a></li>
  </ul>
</nav>

Spezifikationen

Spezifikation Status Anmerkung
HTML Living Standard
Die Definition von '<nav>' in dieser Spezifikation.
Lebender Standard Keine Änderung seit dem letzten W3C Schnapschuss.
HTML5
Die Definition von '<nav>' in dieser Spezifikation.
Empfehlung Anfängliche Definition

Browser-Kompatibilität

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidFirefox für AndroidOpera für AndroidSafari auf iOSSamsung Internet
navChrome Vollständige Unterstützung 5Edge Vollständige Unterstützung JaFirefox Vollständige Unterstützung 4IE Vollständige Unterstützung 9Opera Vollständige Unterstützung 11.1Safari Vollständige Unterstützung 4.1WebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung 11.1Safari iOS Vollständige Unterstützung 4.2Samsung Internet Android Vollständige Unterstützung Ja

Legende

Vollständige Unterstützung  
Vollständige Unterstützung

Siehe auch