Языки сайта: lang, hreflang и перевод

lang — атрибут HTML, который сообщает язык страницы или фразы диктору, браузеру и поисковику. hreflang связывает версии страницы на разных языках.

Язык страницы

Страница на русском должна сказать об этом. Атрибут lang у элемента html вы ставили ещё на первом уроке. Зачем он на самом деле?

• Программа чтения с экрана выбирает голос и правила произношения по языку. Русский текст, прочитанный английским голосом, неразборчив.
• Браузер по нему расставляет переносы и кавычки, проверяет орфографию и решает, предлагать ли перевод.
• Поисковик подтверждает по нему язык страницы.

Язык ставят не только странице. Если внутри русского текста есть фраза на другом языке, ей дают собственный lang: <span lang="en">online</span>. Диктор прочитает слово по-английски, а не по буквам. Язык указывают двух- или трёхбуквенным кодом (ru, en, de), при необходимости с регионом (en-GB, pt-BR).

Проверьте себя: зачем помечать lang слово на другом языке в тексте?

Чтобы диктор прочитал его нужным голосом, а не как набор русских букв.

Сайт на двух языках

Если у проекта в брифе два языка, у вас две версии каждой страницы. Три вопроса: как различать адреса, как связать версии и как перевести.

Адреса

Три способа:

• подпапка это example.ru/ru/ и example.ru/en/: проще всего, всё на одном домене;
• поддомен это en.example.ru: удобно, если версии ведут разные люди;
• отдельный домен это example.ru и example.com: полезно для рынков разных стран, но всё надо вести дважды.

Выберите один способ и держитесь его. Страницы в обеих версиях удобно называть в соответствии с языком: /ru/uslugi/ и /en/services/. Так адрес и читается, и хорошо понятен поиску.

Связь между версиями

Поисковик сам не поймёт, что две страницы переводы друг друга. Ему говорят об этом в head каждой версии:

<link rel="alternate" hreflang="ru" href="https://example.ru/ru/">
<link rel="alternate" hreflang="en" href="https://example.ru/en/">
<link rel="alternate" hreflang="x-default" href="https://example.ru/">

Правила: адреса полные; связь взаимная (если русская указывает на английскую, английская указывает на русскую, иначе связь игнорируют); страница перечисляет и саму себя; запись x-default показывает, что выбрать, если язык посетителя не подошёл. Это подсказка поисковику, а не команда. Для Google правила описаны в документации, и они общие для разных поисковиков, а для Яндекса загляните в справку Вебмастера.

Поиграйте на схеме: поменяйте язык посетителя и связь.

Язык посетителя: русскийанглийскийнемецкий

Связь hreflang: взаимнаятолько в одну сторонунет есть x-default

/ru/

<html lang="ru"> hreflang="ru" (сама) hreflang="en" → /en/ hreflang="x-default" → /ru/

/en/

<html lang="en"> hreflang="en" (сама) hreflang="ru" → /ru/

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

Проверьте себя: что будет с односторонней связью hreflang?

Поисковик её проигнорирует. Взаимность обязательна: обе страницы должны ссылаться друг на друга.

Переключатель

Для людей нужна ссылка на другую версию в шапке. Её подписывают на самом языке: «English», а не «EN» и не флаг. Человек, который знает английский, найдёт её, даже если не понимает остальной страницы. Ссылке дают hreflang="en" и lang="en".

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

Перевод

Перевести интерфейс (кнопки, меню) несложно. Перевести настоящий текст куда труднее, и вот что стоит знать.

• Машинный перевод хорош для понимания «о чём это», но не для выпуска. Нужно, чтобы перевод вычитал человек, знающий предмет и язык.
• Юридические и профессиональные тексты это особая зона риска. Один и тот же термин в разных странах значит разное: должность, звание, документ, вид экспертизы не имеют точных соответствий. Одно слово в перевод может изменить обязательства или ввести клиента в заблуждение. Для экспертов, юристов, врачей перевод стоит доверить тому, кто разбирается, и проверить.
• Не всё надо переводить. Имена, названия документов, адреса лучше оставить и объяснить.

И последнее: две версии нужно вести обе. Лучше один язык, который вы поддерживаете, чем два, один из которых устарел.

Практика

Разметьте языки своей страницы. Если по брифу у вас один язык, всё равно сделайте самоссылку и x-default: когда придёт второй язык, структура готова. Если два, добавьте и ссылку на другую версию.

Что было не так с 2014 годом

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