Тег <nav>


Описание

Тег <nav> (от англ. "navigation") определяет раздел документа, содержащий навигационные ссылки.
Это семантический элемент HTML5, предназначенный для основных блоков навигации по сайту.

Базовый пример:
<nav> <a href="/">Главная</a> <a href="/about">О нас</a> <a href="/contacts">Контакты</a> </nav>

Ключевые особенности:

  • Семантический контейнер для навигационных блоков
  • Может содержать списки, ссылки, выпадающие меню
  • Не обязателен для всех групп ссылок (только для основных)
  • Улучшает доступность (скринридеры распознают навигацию)
  • Полезен для SEO (указывает поисковикам важные разделы)

Рекомендации по использованию:

  • Используйте для основных навигационных блоков сайта
  • Может содержать несколько <nav> на странице (главное меню, футер-навигация)
  • Сочетайте с <ul>/<li> для списков ссылок
  • Не используйте для всех групп ссылок (например, ссылки в футере могут быть без <nav>)
  • Добавляйте ARIA-атрибуты для сложных меню (aria-current="page")

Тег <nav> помогает браузерам, поисковым системам и вспомогательным технологиям идентифицировать основные навигационные разделы веб-страницы.


Атрибуты

accesskey Горячая клавиша для активации элемента
class CSS-классы для стилизации элемента
contenteditable Разрешает редактирование содержимого
data-* Пользовательские данные элемента
dir Направление текста (ltr|rtl)
hidden Скрывает элемент от отображения
id Уникальный идентификатор элемента
lang Язык содержимого элемента
spellcheck Включает проверку орфографии
style Инлайновые CSS-стили элемента
tabindex Порядок перехода при навигации по Tab
title Всплывающая подсказка для элемента
translate Определяет возможность перевода содержимого

Поддержка браузерами

9.0 5.0 11.1 4.0 5.0