<nav>

The <nav> tag is used in HTML to define a navigation section in a document.

It is generally used to group navigation links that allow users to easily move around a website.

Structure and syntax of the <nav> tag

Basic structure and syntax

Here is the basic syntax of a <nav> tag:

<nav>
  Navigation content here
</nav>

Usage example

Here is a typical example of navigation:

<nav>
  <ul>
    <li><a href="#home">Home</a></li>
    <li><a href="#about">About</a></li>
    <li><a href="#services">Services</a></li>
    <li><a href="#contact">Contact</a></li>
  </ul>
</nav>

In this example, the <nav> tag is used to group navigation links in an unordered list.

Attributes

The <nav> tag accepts classic HTML attributes such as:

• class: to apply CSS styles.
• id: to identify a unique container.
• style: to apply inline styles.

Best practices

Use the <nav> tag to organize and structure the navigation elements on your website. This improves accessibility by providing search engines and screen readers with a way to quickly locate the navigation.

Avoid using <nav> for non-essential or repetitive navigation elements. For example, do not use it for navigation links in non-main sections like footers or internal menus such as user profile tabs.

Difference with other similar tags

• <header>: The <header> tag is used to define the header of a document, which can include elements like the logo and the site title, whereas <nav> is specifically intended for navigation links.
• <footer>: The <footer> tag is used for the footer, generally for legal and contact information, while <nav> is dedicated to the site's navigation.

Browser compatibility

The <nav> tag is supported by all modern browsers.