The <nav>
element
Short for ‘Navigation’. Contains content that is mainly intended to provide navigational links to other pages, or other parts of this page.
Usage
This element is intended for menus, breadcrumbs, and other navigation aids that are often found on web pages.
It acts like a <section>
element, showing the page's structure, and telling browsers that this content is distinct from the main content of the page.
There might be several different navigational areas on one page.
For example, a page could have a main menu at the top containing links to the top-level sections of a website, and a separate menu listing documents within the current section.
Each of these should be contained in its own <nav>
element.
A list of links internal to the page, such as a table of contents linking to the fragment identifiers of each section heading, could also be put in a <nav>
.
Not every list or group of hyperlinks needs to be wrapped in a <nav>
.
A list of items given by an article, which happen to all be links, could just be marked up as a normal <ul>
or <li>
list.
A footer might have several links to administrative pages (contact form, privacy policy, etc.), but simply putting it in a <footer>
element should be sufficient.
Browser support
You can start using this element right away without problems, except that you'll need the html5shiv JavaScript to make CSS apply to it in older versions of IE.
As far as I know there aren't any browsers that treat <nav>
specially yet.
It's possible that future versions of accessibility tools like screen readers will be able to make use of this, for example by automatically skipping over reading out long lists of links in a <nav>
, or by providing a special keyboard shortcut for jumping to a navigation part of the page.
Full list of attributes
All the usual HTML global attributes are available