Атрибут lang тега <nav>

Описание

Атрибут lang определяет язык содержимого элемента <nav>. Это важно для:

  • Правильного отображения текста (шрифты, кавычки, переносы)
  • Доступности (скринридеры выбирают правильное произношение)
  • SEO (поисковые системы учитывают язык контента)
  • Многоязычных сайтов (разные навигации на разных языках)
Пример использования:
<nav lang="ru"> <ul> <li><a href="/">Главная</a></li> <li><a href="/about">О нас</a></li> </ul> </nav>

Популярные языковые коды:

Код Язык Пример
ru Русский lang="ru"
en Английский lang="en"
es Испанский lang="es"
ar Арабский lang="ar"

Пример с многоязычной навигацией:

<nav lang="ru"> <ul> <li><a href="/ru/">Главная</a></li> <li><a href="/ru/about">О нас</a></li> </ul> </nav> <nav lang="en"> <ul> <li><a href="/en/">Home</a></li> <li><a href="/en/about">About</a></li> </ul> </nav>

Динамическое изменение языка:

<nav id="language-nav"> <!-- Навигация --> </nav> <button onclick="setNavLanguage('ru')">Русский</button> <button onclick="setNavLanguage('en')">English</button> <script> function setNavLanguage(lang) { document.getElementById('language-nav').lang = lang; // Здесь может быть код для загрузки перевода } </script>

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

  • Указывайте язык для всех навигационных элементов
  • Для многоязычных сайтов используйте разные элементы <nav> с разными lang
  • Сочетайте с атрибутом dir для RTL-языков
  • Используйте правильные языковые кода (ISO 639-1)
  • Для региональных вариантов используйте подтеги (ru-RU, en-GB)

Пример с региональным вариантом:

<nav lang="pt-BR"> <ul> <li><a href="/">Página inicial</a></li> <li><a href="/sobre">Sobre nós</a></li> </ul> </nav>

Ограничения и совместимость:

  • Поддерживается всеми браузерами
  • Не влияет на автоматический перевод страниц
  • Для полной поддержки нужно указывать язык документа (<html lang>)
  • Скринридеры могут игнорировать, если не совпадает с системным языком

Примечание: Правильное использование атрибута lang особенно важно для многоязычных сайтов и веб-приложений. Он помогает обеспечить корректное отображение и доступность навигационных элементов для пользователей разных языков.