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

Описание

Атрибут lang для тега <data> указывает язык содержимого элемента, что помогает браузерам и вспомогательным технологиям правильно интерпретировать текст.

Особенность: В отличие от атрибута value, который содержит машинные данные, lang относится только к видимому текстовому содержимому.
Пример использования:
<p> Перевод: <data value="hello" lang="en">Hello</data> - <data value="hola" lang="es">Hola</data> </p>

Форматы значений:

Тип Пример Стандарт
Код языка lang="fr" ISO 639-1 (2 буквы)
Язык + регион lang="pt-BR" ISO 3166 для региона
Специальные lang="zxx" Для нелингвистического контента

Практическое применение:

<style> data[lang="ar"] { direction: rtl; font-family: 'Traditional Arabic', sans-serif; } </style> <data value="book" lang="ar">كتاب</data>

Совместное использование с другими атрибутами:

<data value="date_2023-05-15" lang="ru" data-format="YYYY-MM-DD"> 15 мая 2023 </data>

Особенности работы:

  • Влияет на автоматическое определение языка для проверки орфографии
  • Может изменять отображение кавычек и типографики
  • Используется скринридерами для выбора голоса
  • Не изменяет форматирование чисел и дат
  • Приоритетнее, чем язык, указанный в родительских элементах

Рекомендации:

  1. Для многоязычных сайтов указывайте язык явно
  2. Сочетайте с dir для RTL-языков
  3. Используйте полные коды языка с регионом при необходимости
  4. Для кодов и идентификаторов применяйте lang="zxx"
  5. Проверяйте поддержку языков в целевых браузерах

Пример с микроданными:

<div itemscope itemtype="https://schema.org/Book"> <span itemprop="name" lang="fr"><data value="book123">Le Petit Prince</data></span> </div>

Примечание: Хотя атрибут lang не влияет на машинное значение в value, его правильное использование улучшает семантику и доступность веб-страниц, особенно при работе с многоязычным контентом.