Атрибут translate тега <data>
Описание
Атрибут translate для тега <data> определяет, должно ли содержимое элемента переводиться при автоматическом переводе страницы. Этот атрибут позволяет контролировать, какие части машинно-читаемых данных должны оставаться неизменными.
Особенность: Атрибут влияет только на текстовое содержимое элемента, но не на значение атрибута
Пример использования:
value.
<p>
Код: <data value="PRD-0042" translate="no">PRD-0042</data>,
Название: <data value="book" translate="yes">Книга</data>
</p>
Допустимые значения:
| Значение | Описание | Рекомендуемое использование |
|---|---|---|
yes |
Содержимое может быть переведено | Для человеко-читаемого текста |
no |
Содержимое не должно переводиться | Для кодов, идентификаторов, имен собственных |
Практические сценарии:
1. Запрет перевода кодов:
<data value="error_404" translate="no">Error 404</data>
2. Разрешение перевода описаний:
<data value="color_red" translate="yes">Красный</data>
Особенности работы:
- Не влияет на автоматический перевод атрибута
value - Приоритетнее, чем глобальные настройки перевода страницы
- Поддержка зависит от браузера и используемого сервиса перевода
- Для важных элементов лучше использовать явные языковые версии
Рекомендации:
<!-- Хорошая практика: явное указание переводимых частей -->
<data value="status_active" translate="no">Active</data>
<!-- Альтернатива для сложных случаев -->
<data value="welcome_message"
data-en="Welcome"
data-es="Bienvenido"
data-fr="Bienvenue">
Добро пожаловать
</data>
Ограничения и альтернативы:
- Не все сервисы перевода учитывают этот атрибут
- Для полного контроля используйте отдельные языковые версии
- В сложных случаях применяйте JavaScript-решения перевода
- Всегда проверяйте работу в целевых браузерах
Пример с динамическим переводом:
<data id="translatable-text"
value="greeting"
data-lang-en="Hello"
data-lang-es="Hola">
Привет
</data>
<script>
function setLanguage(lang) {
const element = document.getElementById('translatable-text');
element.textContent = element.dataset[`lang${lang}`] || element.textContent;
}
</script>
Примечание: Хотя атрибут translate предоставляет базовый контроль над автоматическим переводом, для профессиональной многоязычной поддержки рекомендуется использовать специализированные системы i18n (интернационализации) и словари переводов.