Where exactly do hreflang tags go?

In the of every language version of a page, as elements. Alternatively, put the same information in an HTTP Link: header or in your XML sitemap.

Do I need a hreflang tag for the page itself?

Yes. Google requires each version to list itself as well as every other version. The set of links is identical on all versions.

Is en-UK a valid hreflang code?

No. UK is a reserved code and has no effect in Google Search. Use en-GB for English in the United Kingdom.

Should I add hreflang in the HTML and the sitemap?

No. Google treats the methods as equivalent and says using more than one brings no Search benefit while making the setup harder to maintain.

How long until Google uses new hreflang tags?

Google has to recrawl the pages involved, so it depends on how often your pages are crawled. Make sure all versions are indexable and linked from your site, and check the translated URLs with URL Inspection in Search Console.

Как добавить теги Hreflang (примеры HTML, заголовка и карты сайта)

Подведите итог этому посту следующим образом: 9 мин чтения

Чтобы добавить теги hreflang, перечислите все языковые или региональные версии страницы, дайте каждой из них код языка (необязательно с указанием региона, например en-GB), а затем поместите тот же полный набор <link rel="alternate" hreflang="…" href="…"> строки в <head> каждой версии, включая строку для самой страницы. Если вы не можете редактировать заголовок HTML, вы можете вместо этого поместить ту же информацию в заголовки HTTP или в карту сайта XML; Google рассматривает все три метода как эквивалентные.

Ключевые выводы

Hreflang переходит на страницы, имеющие переведенные или региональные эквиваленты на других URL-адресах. Одноязычным сайтам это не нужно.
Используйте только один метод: заголовок HTML, заголовки HTTP или карту сайта. Google утверждает, что их объединение не приносит никакой пользы.
Каждая версия перечисляет себя и каждую другую версию с абсолютным https:// URL-адреса. Пары, которые не связаны друг с другом, игнорируются.
Коды представляют собой язык ISO 639-1, а затем дополнительный регион ISO 3166-1 Alpha 2: fr, fr-CA, en-GB. Никогда не бывает региона в одиночку.
Добавлять x-default для посетителей, которые не соответствуют ни одной из ваших версий.
В WordPress, Shopify и большинстве инструментов перевода для вас можно сгенерировать hreflang. Проверьте один раз, а затем проверьте еще раз после изменения темы или плагина.

Прежде чем начать: сопоставьте свои версии

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

Версия	Код	URL-адрес
Английский (по умолчанию)	`en`	`https://example.com/pricing/`
Французский	`fr`	`https://example.com/fr/pricing/`
Французский для Канады	`fr-CA`	`https://example.com/fr-ca/pricing/`
Откат	`x-default`	`https://example.com/pricing/`

В эту таблицу попадают три решения.

1. Только язык или язык плюс регион? Используйте простой языковой код (fr) если только содержание действительно не различается в зависимости от страны, например, по ценам, валюте, орфографии или юридическому тексту. Руководство Google заключается в том, что если у вас есть несколько региональных версий одного языка, хорошей идеей будет также предоставить общую версию для носителей этого языка в других местах (Центр поиска Google). В таблице выше, fr ловит франкоговорящих во Франции, Бельгии и везде, в то время как fr-CA для Канады.

2. Какие коды действительны? Google поддерживает языковые коды ISO 639-1 и региональные коды ISO 3166-1 Alpha 2, а также коды сценариев ISO 15924 для таких случаев, как zh-Hant и zh-Hans. В нем говорится, что другие кодексы, такие как es-419, не поддерживаются, и что зарезервированные значения, такие как EU, UN и UK не оказывают никакого эффекта. Для Соединенного Королевства напишите en-GB. Наш список языковых кодов hreflang имеет общие в одном месте.

3. В чем запасной вариант? x-default называет страницу для посетителей, чьи языковые настройки не соответствуют ни одной из ваших версий. Google утверждает, что он был разработан для страниц выбора языка и лучше всего работает там, но многие сайты указывают его на свою страницу на основном языке.

Также подтвердите, что каждый URL-адрес является окончательным адресом: он возвращает 200, не перенаправляется и является своим собственным каноническим адресом. В канонической документации Google говорится, что при использовании hreflang следует указать каноническую страницу на том же языке (Центр поиска Google).

Метод 1: добавьте теги hreflang в заголовок HTML

Это метод, который использует большинство сайтов. Google рекомендует его, если у вас нет карты сайта или вы не можете задать заголовки HTTP-ответа.

Для страницы цен в таблице каждая из трех версий получает именно этот блок внутри <head>:

<link rel="alternate" hreflang="en" href="https://example.com/pricing/" />
<link rel="alternate" hreflang="fr" href="https://example.com/fr/pricing/" />
<link rel="alternate" hreflang="fr-CA" href="https://example.com/fr-ca/pricing/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/pricing/" />

Шаг за шагом:

Откройте шаблон, который выводит <head> для этого типа страницы (в WordPress обычно это тема header.php или крючок; на статическом сайте - файл макета).
Генерируйте блок на основе данных, а не вручную. Набранные вручную теги на сотнях страниц рассинхронизируются. Создайте список из того же источника, который создает URL-адреса вашего языка.
Включите текущую страницу в отдельный список. Google: “Каждая языковая версия должна перечислять себя, а также все версии на других языках.”
Используйте абсолютные URL-адреса. https://example.com/fr/pricing/, нет /fr/pricing/ или //example.com/fr/pricing/.
Сохраните каждый <link> одноцелевой. Google предупреждает не комбинировать hreflang с другими атрибутами, такими как media в одном теге.
Проверьте, правильно ли сформирована голова. Теги должны находиться внутри действительного <head>. Если скрипт или случайный элемент сломает голову раньше времени, Google может их не увидеть. Если вы не уверены, вставьте отрендеренный HTML-код в валидатор.

Метод 2: добавьте hreflang с заголовками HTTP

Используйте заголовки для файлов, не имеющих заголовка HTML, например PDF-файлов. Сервер возвращает a Link: заголовок, содержащий список всех версий, включая запрошенную, и заголовок идентичен для каждой версии:

Link: <https://example.com/guide.pdf>; rel="alternate"; hreflang="en",
      <https://example.com/fr/guide.pdf>; rel="alternate"; hreflang="fr",
      <https://example.com/guide.pdf>; rel="alternate"; hreflang="x-default"

URL-адреса заключаются в угловые скобки, а записи разделяются запятыми. В Apache или nginx это задается для каждого файла или местоположения; в CDN — с помощью правила заголовка ответа. Проверьте это с помощью curl -I на каждом URL-адресе, чтобы подтвердить, что заголовок отображается на всех из них.

Метод 3: добавьте hreflang в карту сайта XML

Карта сайта хранит все аннотации в одном файле, что подходит для больших сайтов или команд, которые не могут менять шаблоны. Правила из документации Google:

Объявите пространство имен xmlns:xhtml="http://www.w3.org/1999/xhtml" на <urlset>.
Создать отдельный <url> запись для каждой версии, со своей собственной <loc>.
Внутри каждой записи добавьте одну <xhtml:link rel="alternate" hreflang="…" href="…"/> для каждой версии, включая ее саму. Три версии означают три записи, каждая из которых имеет одних и тех же трех детей.
Порядок не имеет значения, а дочерние ссылки не учитываются при определении лимита URL-адресов карты сайта.

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
  xmlns:xhtml="http://www.w3.org/1999/xhtml">
  <url>
    <loc>https://example.com/pricing/</loc>
    <xhtml:link rel="alternate" hreflang="en" href="https://example.com/pricing/"/>
    <xhtml:link rel="alternate" hreflang="fr" href="https://example.com/fr/pricing/"/>
    <xhtml:link rel="alternate" hreflang="x-default" href="https://example.com/pricing/"/>
  </url>
  <url>
    <loc>https://example.com/fr/pricing/</loc>
    <xhtml:link rel="alternate" hreflang="en" href="https://example.com/pricing/"/>
    <xhtml:link rel="alternate" hreflang="fr" href="https://example.com/fr/pricing/"/>
    <xhtml:link rel="alternate" hreflang="x-default" href="https://example.com/pricing/"/>
  </url>
</urlset>

Отправьте карту сайта в Search Console. Имейте в виду, что карта сайта может перечислять URL-адреса только в каталоге, где она размещена, поэтому карта сайта в /fr/ невозможно перечислить английские страницы в корне.

Какой метод выбрать?

Если ваша ситуация…	Использовать
CMS или сайт, где вы (или плагин) управляете головой	HTML-теги
PDF-файлы и другие загрузки на нескольких языках	HTTP-заголовки
Тысячи URL-адресов или шаблонов, которые вы не можете изменить	Карта сайта
Платформа или инструмент перевода, генерирующий hreflang	Встроенный вывод; не добавляйте второй набор

Позиция Google заключается в том, что эти три метода эквивалентны и что использование всех из них не дает “никакой выгоды в поиске”, а только больше для поддержания (Центр поиска Google).

Добавление hreflang на общие платформы

WordPress. Сам WordPress не имеет многоязычного слоя, поэтому hreflang происходит от всего, что создает ваши переведенные страницы. Перед написанием кода проверьте настройки плагина перевода и убедитесь, что плагин SEO также не выводит конфликтующий набор. Если вы используете ConveyThis, см. раздел ниже.

Shopify. Shopify автоматически генерирует hreflang из настроек рынков и языков, когда каждый рынок или язык имеет свой собственный домен, поддомен или подпапку, и добавляет x-default указывая на основной домен. Функция включена по умолчанию и может быть отключена в настройках интернет-магазина (Shopify Справочный центр). Если вы отключите его, чтобы самостоятельно управлять тегами, вы станете нести ответственность за сохранение каждого набора в полном объеме.

Статические сайты и пользовательские приложения. Создайте блок в своем макете из карты одного языка (файл JSON или конфигурации, в котором перечислены каждая локаль и ее шаблон URL-адреса). Создайте карту сайта на основе одной и той же карты, чтобы они никогда не расходились во мнениях.

Контрольный список перед публикацией

Один и тот же набор тегов присутствует в каждой версии страницы.
Каждая версия включает в себя себя.
Каждый URL-адрес является абсолютным, возвращает 200 и является самоканоническим.
Коды — это прежде всего язык; регионы — это настоящие коды ISO (GB, нет UK).
Есть один x-default.
Используется только один метод.
Видимое содержимое страницы на самом деле находится на языке, указанном в теге. Google определяет язык по видимому контенту, а не по коду (Центр поиска Google), поэтому “французская” страница, которая в основном на английском языке, не будет вести себя как французская страница.

Поскольку отчет Search Console International Targeting был отменен в 2022 году (Помощь консоли поиска), проверьте с помощью сканера, который следует за hreflang и сообщает об отсутствии обратных ссылок. На собственной странице Google упоминается инструмент тестирования hreflang от Merkle и генератор Aleyda Solis как популярные сторонние опции, которые компания не поддерживает. Если инструмент сообщает, что вообще ничего не нашел, проработайте наше руководство по предупреждению “без тегов hreflang”.

Как ConveyThis добавляет для вас hreflang

Когда вы переводите сайт с помощью ConveyThis и публикуете каждый язык в отдельной подпапке (/fr/) или поддомен (fr.example.com), hreflang генерируется автоматически. В WordPress плагин выводит альтернативные ссылки в заголовке каждой страницы, по одной на каждый язык плюс x-default указывает на вашу страницу на исходном языке и включает альтернативные языки в свою карту сайта. Теги создаются на основе того же списка языков и правил URL, что и переведенные страницы, поэтому добавление языка обновляет весь набор одновременно.

Это оставляет вам две вещи, которые нужно проверить: что ваш плагин кэша или оптимизации обслуживает заголовок в целости и сохранности, и что никакой другой плагин не устанавливает канонический указатель, указывающий переведенные страницы обратно на оригинал. The многоязычный обзор SEO показывает, как переведенные URL-адреса, метаданные и hreflang работают вместе, настройка переведенных URL-адресов объясняет, как локализовать слизней, и Интеграция WordPress страница посвящена настройке плагина. Для каждого пограничного случая, от региональных вариантов до нумерации страниц, см полное руководство по внедрению hreflang.

Часто задаваемые вопросы

Куда именно идут теги hreflang?

В <head> каждой языковой версии страницы, как <link rel="alternate" hreflang="code" href="absolute-url"> элементы. Альтернативно, поместите ту же информацию в HTTP Link: заголовок или в вашей XML-карте сайта.

Нужен ли мне тег hreflang для самой страницы?

Да. Google требует, чтобы каждая версия перечисляла себя так же, как и любая другая версия. Набор ссылок идентичен во всех версиях.

Является ли en-UK допустимым кодом hreflang?

Нет. UK — зарезервированный код, не имеющий никакого эффекта в поиске Google. Используйте en-GB для английского языка в Соединенном Королевстве.

Стоит ли добавлять hreflang в HTML и карту сайта?

Нет. Google рассматривает эти методы как эквивалентные и утверждает, что использование более одного из них не приносит никакой пользы для поиска, а также затрудняет поддержку настройки.

Сколько времени пройдет, прежде чем Google начнет использовать новые теги hreflang?

Google приходится повторно сканировать соответствующие страницы, поэтому это зависит от того, как часто сканируются ваши страницы. Убедитесь, что все версии индексируются и ссылаются на ваш сайт, а также проверьте переведенные URL-адреса с помощью проверки URL-адресов в консоли поиска.

Пропустите ручную работу

Поддерживать полноту hreflang на каждой странице и языке проще, когда одна и та же система создает переведенные URL-адреса и теги. Ты можешь начните с ConveyThis и подключите свой сайт.