Атрибут translate тега <article>


Описание

Атрибут translate указывает, следует ли переводить содержимое элемента <article> при использовании автоматических инструментов перевода (например, Google Translate). Принимает значения "yes" (переводить) или "no" (не переводить).

Пример использования:
<!-- Статья, которую следует переводить --> <article translate="yes"> <h2>Международные новости</h2> <p>Этот контент должен быть доступен на разных языках.</p> </article> <!-- Статья, которую не нужно переводить --> <article translate="no"> <h2>Quantum Physics Formulas</h2> <p>E = mc²; ψ = ψ(x,t); [x̂,p̂] = iħ</p> </article>

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

Значение Поведение Когда использовать
translate="yes" Содержимое может быть переведено (значение по умолчанию) Для обычного текстового контента на естественном языке
translate="no" Содержимое не должно переводиться Для кода, формул, имен собственных, терминов
Не указан Наследует поведение родительского элемента Когда нужно глобальное управление переводом

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

  • Используйте translate="no" для:
    • Научных формул и уравнений
    • Имен людей, компаний, брендов
    • Кода программирования
    • Специальных терминов
  • Для всего документа можно задать атрибут в теге <html>
  • Сочетайте с атрибутом lang для лучших результатов
  • Тестируйте с реальными инструментами перевода

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

<article lang="en"> <h2 translate="yes">Scientific Discoveries</h2> <p translate="yes"> Recent studies in quantum mechanics have revealed new possibilities. </p> <div translate="no"> <p>Schrödinger equation: iħ∂/∂t Ψ(r,t) = Ĥ Ψ(r,t)</p> <p>Einstein's formula: E = mc²</p> </div> <p translate="yes"> These formulas are fundamental to modern physics. </p> </article>

Ограничения: Поддержка атрибута translate зависит от инструмента перевода. Не все системы автоматического перевода учитывают этот атрибут.

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

Сервис/Браузер Поддержка Примечания
Google Chrome Да Встроенный переводчик учитывает атрибут
Google Translate Частично Не всегда последовательно
Microsoft Edge Да На основе Chromium
Другие сервисы Переменная Зависит от реализации

Лучшие практики:

<!-- Хороший пример --> <article lang="en" translate="yes"> <h2>Web Development Guide</h2> <p>This content should be translated for international readers.</p> <div class="code-example" translate="no"> <pre><code> function hello() { console.log("Hello World"); } </code></pre> </div> </article> <!-- Плохой пример --> <article> <h2 translate="no">Important News</h2> <!-- Заголовок должен переводиться --> <p translate="yes">Click <span translate="no">here</span> to continue</p> <!-- Избыточное использование --> </article>

Совет: Для важного контента, который не должен переводиться, рассмотрите возможность предоставления предварительно переведенных версий вместо полагания на автоматические инструменты перевода.

Интеграция с системами управления контентом:

<!-- Пример для многоязычного сайта --> <article translate="no"> <!-- Отключаем авто-перевод --> <h2> <span lang="en">Welcome</span> <span lang="es" hidden>Bienvenido</span> <span lang="fr" hidden>Bienvenue</span> </h2> <div lang="en"> <p>English content version</p> </div> <div lang="es" hidden> <p>Versión en español</p> </div> <div lang="fr" hidden> <p>Version française</p> </div> </article>

Примечание: Атрибут translate является частью стандарта HTML5, но его поддержка может варьироваться в зависимости от используемого инструмента перевода. Всегда проверяйте поведение в целевых браузерах и сервисах.