Finding your way: the nav element

It won’t come as a surprise to anybody that the nav element is defined in the HTML spec as representing “a section of a page that links to other pages or to parts within the page” and “a section with navigation links.” But not all links are created equal. The spec goes on to say that “the element is primarily intended for sections that consist of major navigation blocks.”

What qualifies as a “major navigation block” worthy of the nav element? One way to figure it out is to think of the search results for the page. Search crawlers will one day scrub web pages for various HTML5 elements, including the nav element. Think of the scrubbed information that will appear in search results. What navigation links for the page would you like people to click directly from the search result?

For example, say you have a group of “See also” links following an article on your page. Should you apply the nav element to the links? You probably wouldn’t want the links to appear in the page’s search result on Google. So in this case, no, the “See also” links are not nav-worthy.

The answer is not definitive because it could change depending on the page. Say you’re revamping a prehistoric HTML research report from 1995 with no main menu or any other links except for some “See also” links. Then you could argue that the “See also” links are a major navigation block and thus nav-worthy.

But wait, there’s more. The nav element can also make pages more accessible in the long run. Future screen readers could use the element to identify and skip navigation blocks, sparing listeners boring recitals of links. The element could also allow screen readers to scan and then out read the links to users on demand. All good stuff.

You can start using the nav element today to prepare for these and future developments in web technologies.

Spec: the nav element