Пример атрибута hreflang и как его протестировать

Существует масса способов добавить атрибут hreflang – его может поддерживать CMS-система, которой вы пользуетесь, или вы сами можете установить плагин/расширение для мультиязыкового сайта. Неважно, как именно вы включите поддержку нескольких языковых версий своего ресурса; hreflang – это клей, соединяющий одинаковые страницы на разных языках, и его нужно применять.

Давайте разберем на примере, как работает атрибут и на что нужно обращать внимание при его использовании.

Пример атрибута hreflang и как его протестировать

Международные веб-сайты

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

Пример атрибута hreflang

Для примера возьмем веб-сайт, с которым вы наверняка знакомы — Hubspot.com. Сайт работает на:

  • — английском;
  • — немецком;
  • — испанском;
  • — французском;
  • — японском;
  • — бразильском португальском (отличается от португальского, на котором разговаривают в самой Португалии).

Выбор языка доступен в шапке сайта. А так выглядит кусок кода, который реализует эту функцию:

<!— INTERNATIONAL —>
<link rel=»alternate» href=»https://www.hubspot.com» hreflang=»x-default»>
<link rel=»alternate» href=»https://www.hubspot.com» hreflang=»en»>
<link rel=»alternate» href=»https://www.hubspot.de» hreflang=»de-DE»>
<link rel=»alternate» href=»https://www.hubspot.es» hreflang=»es»>
<link rel=»alternate» href=»https://www.hubspot.fr» hreflang=»fr-FR»>
<link rel=»alternate» href=»https://www.hubspot.jp» hreflang=»ja-JP»>
<link rel=»alternate» href=»https://br.hubspot.com» hreflang=»pt-BR»>

Справа мы видим атрибут hreflang. Кстати, это лишь один из нескольких способов использовать hreflang на сайте. Здесь он включен в <head>, но также атрибут можно использовать через XML-карту сайта или HTTP-заголовки.

Более подробно об этом можно найти в окончательном руководстве по hreflang, о котором упоминалось ранее.

В нашем примере легко выделить три элемента:

  • — варианты (alternate);
  • — ссылки на страницы;
  • — языки.

Язык по умолчанию установлен в теге <html> шаблона, и у нас есть несколько языковых вариантов.

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

Атрибут hreflang указывает поисковой машине ссылку, по которой находится альтернативный контент, и язык, для которого предназначена эта альтернатива. «de_DE » означает немецкий в Германии, «pt_BR» — португальский для геолокации (региона, в котором находится посетитель) в Бразилии.

Еще один вариант языка в этом примере – «es», он означает испанский для всех испаноговорящих регионов мира. Для регионов или языков, которые не указаны, выводится страница на языке, установленном по умолчанию.

Тестирование hreflang

Теперь, когда вы знаете, что проверять в исходном коде, используем Google для контроля выдачи языковой версии страницы посетителю, например, из Бразилии. Вот где нам пригодится знание структуры адресных ссылок Google.

Если мы посмотрим на этот адрес, в глаза бросятся две вещи:

https://www.google.com/search?hl=pt&q=hubspot&gl=BR

И не потому что они выделены цветом.
hl – это язык интерфейса (или host language), а gl – геолокация. Мы видим, что Google продвигает результат для Бразилии на португальском. Если вы используете в качестве браузера Google Chrome, то получите такой результат:

Пример атрибута hreflang и как его протестировать

Как можно заметить, показывается бразильский сайт, судя по адресу сайта https://br.hubspot.com. Кажется, атрибут hreflang работает! Аналогично тестируем немецкий, японский и французский языки, чтобы убедиться в правильной выдаче.

Можно даже проверить язык, который не включен в список вариантов (например, итальянский), чтобы увидеть, работает ли возврат к странице по умолчанию.

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

 

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован.

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам:

Подробнее в SEO
Атрибут hreflang
Атрибут hreflang как его использовать для указания языка

Атрибут hreflang (тег) - это техническое решение для сайтов, которые публикуют один и тот же контент на разных языках. Владельцы...

Закрыть