What Is the HTML 5 nav Tag?

In HTML 5, the nav tag defines a section of a page used for navigation.

When Do You Use the nav Tag in HTML 5?

In HTML 5, the nav tag is new, and the specification is not entirely clear about it, so I take it to mean either that there is some developer flexibility in how to use it, or that the spec is not yet fully developed.

Either way, right now it’s possible to use the nav tag in a grouping of links, an ordered, or an unordered list of links. Anything that can be considered navigation on the page can now be semantically marked up as navigation. See the examples below. Note that I’ve added class attributes to each so I can easily specify how I want to style them.

How Is the nav Tag Used in HTML 5 Documents?

Here are some examples:


<nav class="pages">
<h2>Page Navigation</h2>
<a href="/index">Home</a>
<a href="/about">About Us</a>
<a href="/contact">Contact Us</a>
</nav>
<nav class="categories">
<h2>Category Navigation</h2>
<ul>
<li><a href="/jackets">Jackets</a></li>
<li><a href="/gloves">Gloves</a></li>
<li><a href="/hats">Hats</a></li>
</ul>
</nav>

This entry was posted in HTML 5. Bookmark the permalink.

Comments are closed.