SEO для мультиязычных WordPress-сайтов: разбираемся с тегом hreflang

Оптимизация веб-проекта – сама по себе довольно сложная задача, но если мы коснемся мультиязычных сайтов, здесь все становится еще запутаннее.

SEO-оптимизация мультиязычных сайтов затруднительна по двум причинам:

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

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

В первой главе мы рассмотрим теги hreflang.

Что представляют собой теги hreflang

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

• Опыт взаимодействия (UX). Может ли пользователь легко изменить язык сайта? Видна ли кнопка переключения с одного языка на другой на всех страницах? Правильно ли заданы ссылки? Если ответ на эти вопросы – «нет», то необходимо реализовать простое, интуитивно понятное решение, которое поможет посетителям сайта переходить с одной страницы на другую.
• Техническое SEO. Понимают ли поисковые роботы, сколько версий есть у сайта? Связаны ли страницы со своими языковыми версиями (переводами на другие языки)?

Чтобы ответить на последний вопрос, который нас интересует больше всего, нужно проверить наличие тегов rel hreflang. Эти теги сообщают Гуглу (или Яндексу), какой язык используется на конкретной странице, чтобы поисковая система могла предоставить пользователю готовый результат на его языке. Теги могут стоять в хэдере сайта, в карте сайта или в HTTP-заголовке.

У тега hreflang есть своя структура:

<link rel="alternate" href="http://www.esempio.it" hreflang="it-it" /> 

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

Тег состоит из следующих частей:

• href = “url”: URL-страницы на указанном языке.
• hreflang = “it”: язык страницы (в формате ISO 639-1). Также можно указывать код географической зоны (в формате ISO 3166-1 alpha-2) для стран, разговаривающих на одном и том же языке (как пример, en-gb для Великобритании, en-us для США). Можно предлагать контент для пользователей, которые живут в одной географической области, но говорят на разных языках. Пример: можно предложить контент es-us для тех, кто живет в США и говорит по-испански.

Язык – обязательная часть тега hreflang, географическую область же задавать необязательно (в основном это используется для интернет-магазинов с разными подключенными валютами).

Когда использовать теги hreflang

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

Теги используются как для подкаталогов (www.example.com/it), так и для доменов верхнего уровня (www.example.it).

Куда можно вставить эти теги

Как уже было сказано выше, есть три разных способа интеграции этих тегов на сайт:

• В карте сайта. Вы можете указать разные языка сайта в XML-карте сайта. Самый быстрый способ сделать это – сопоставить все URL с их языковыми версиями в Excel, после чего использовать этот инструмент.
• В HTTP-заголовке. Этот параметр в основном используется для файлов, отличных от HTML (к примеру, для PDF). Просто добавляем в .htaccess следующую строку:

  Link: <http://www.esempio.it/es/file.pdf>; rel="alternate"; hreflang="es"> 

• В хэдере сайта (между тегами head). Это решение самое популярное, и именно его мы рассмотрим далее. Теги надо указывать вместе с другими мета-тегами в секции head страницы.

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

Сколько hreflang должно быть на каждой странице

На каждой странице должны быть:

• Тег hreflang, указывающий на исходную страницу.
• Теги для всех версий этой страницы (один hreflang на каждую версию).

Теги должны быть взаимными. Если страница A ссылается на B, то и страница B должна ссылаться на A.

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

 <link rel="alternate" href="http://www.esempio.it/" hreflang="it" /> <link rel="alternate" href="http://www.esempio.it/fr" hreflang="fr" /> 

На французской:

 <link rel="alternate" href="http://www.esempio.it/fr" hreflang="fr" /> <link rel="alternate" href="http://www.esempio.it/" hreflang="it" /> 

Другие примеры использования

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

 <link rel="alternate" href="http://www.esempio.ch/it" hreflang="it-ch" /> <link rel="alternate" href="http://www.esempio.ch/fr" hreflang="fr-ch" /> <link rel="alternate" href="http://www.esempio.ch/de" hreflang="de-ch" /> 

Один и тот же язык, но разные страны. В этом случае задаем еще и географическую область:

 <link rel="alternate" href="http://www.example.com" hreflang="en-us" /> <link rel="alternate" href="http://www.example.com/ireland" hreflang="en-ie" /> <link rel="alternate" href="http://www.example.com/uk" hreflang="en-gb" /> 

Разные языки и разные страны. Вот самый простой пример:

 <link rel="alternate" href="http://www.esempio.it" hreflang="it" /> <link rel="alternate" href="http://www.exemple.fr" hreflang="fr" /> <link rel="alternate" href="http://www.example.com" hreflang="en" /> 

Редирект со сплэш-страницы

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

В таких ситуациях достаточно указать x-default в качестве атрибута hreflang.

<link rel="alternate" href="http://www.example.com/" hreflang="x-default"> 

Есть специальные генераторы, которые позволяют сформировать все hreflang конструкции. Пример по ссылке.

Другие рекомендации

Тег должен находиться на уровне страницы, а не на уровне сайта. Он должен присутствовать на каждой отдельной странице.

При работе с языком, у которого имеются разные варианты написания, вы можете задавать комбинации написания и региона. Как пример, zh-Hans-TW для обозначения упрощенного китайского (zh-Hans) для пользователей в Тайване (tw).

Инструкции по добавлению языковых тегов в WordPress

При работе с WordPress можно воспользоваться плагином, который позволяет добавлять разные мета-теги в head отдельных страниц.

Самый простой и надежный вариант – HREFLANG Tags Lite.

Пункт меню HREFLANG в админке WordPress позволяет задавать требуемые параметры.

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

Далее вам нужно будет отредактировать запись или страницу, для которой вы хотите добавить тег hreflang. На странице редактирования записи вы увидите новый пункт, который называется HREFLANG Tags.

Здесь вы можете добавить URL-адрес для поста, редактируемого в настоящий момент, а также выбрать его язык. Затем нажмите на кнопку + для добавления URL-адресов других переводов. Сохраните изменения.

Более мощные решения для создания мультиязычных сайтов:

• WPML
• MultilingualPress
• Polylang

Выполняем валидацию hreflang

Даже если вы и включили hreflang, зачастую все это может быть сделано с ошибками. Потому стоит провести валидацию hreflang через специальные инструменты.

• Sitrix hreflang tag testing tool. Этот инструмент выводит теги, заданные на вашем сайте, и позволяет узнать, имеются ли какие-либо ошибки с ними.
• Merke hreflang tags testing tool. Еще один полезный инструмент для тестирования hreflang.
• agency hreflang tag testing tool. Этот инструмент выводит ошибки с hreflang.

Источник: marsigliadigital.com

Источник: oddstyle.ru