1.5. Structure primary and secondary navigation menus with <nav role="navigation">

Primary and secondary navigation menus must be marked up with <nav role="navigation">.


The <nav role="navigation"> element is reserved for website’s internal links.

For example:

  • The main menu.
  • The sub-menu.
  • The breadcrumb.
  • The search results page number.

In other words, it must not be used to mark up a list of external links, such as a list of social media links.


Good practice is to add an aria-label attribute to the <nav role="navigation"> tag to specify the type of navigation system.

<header role="banner">[…]</header>
<nav role="navigation" aria-label="Primary menu">[…]</nav>
<nav role="navigation" aria-label="Secondary menu">[…]</nav>
<main role="main">
   <nav role="navigation" aria-label="You are here">[…]</nav>
<footer role="contentinfo">[…]</footer>

Find out more


Add a comment

All fields are mandatory.

Back to top