HTML5 - Nav Element

Nav Element

The nav element, a new block element, has been introduced in HTML 5 for defining a better page structure.

<nav></nav>
Represents a section of the document intended for navigation.

The nav element is pretty straight forward in purpose.

If it has to do with navigation of any kind place it in a nav element.

You can use it as a standalone tag, or place it in headers, footers, articles, sections and even asides.

It accepts global attributes so that you can use the class attribute and create different styles for different purposes.

Navigation Devices

You can build your navigation device with any available elements like paragaphs or lists. The nav element accepts all.

Explore our collection of drop down navbars created using lists and CSS.

New Elements and Beginners

Some of the new tags used as shown below might make the body code of a basic HTML5 document easier to read.

This structure can be used instead of using class customized divisions .

<body>
<header></header>
<nav></nav>
<div class="main"></div>
<footer></footer>
</body>

as well as:

<body>
<header><nav></nav></header>
<section class="main"></section>
<footer></footer>
</body>

 

*Use of the new tags article, section, header, footer, hgroup, nav and aside is a matter of the taste or the need of the author.

Note: some of these overlap in purpose.

For a complete list of New Elements visit W3.org

 

See also: Header Element and Footer Element