Налаштування hreflang для мультимовного сайту під ключ
Уявіть: російськомовний користувач з Німеччини вводить запит у Google, а потрапляє на англійську версію сайту. Або гірше — на українську. Без правильного hreflang пошуковики помиляються з мовною версією, і ви втрачаєте до 30% трафіку. Для сайту з 500 000 щомісячних сесій це 150 000 втрачених візитів — при середній конверсії 2% і вартості замовлення $50 це $150 000 втраченого доходу щомісяця. Ми стикалися з проектами, де через цю помилку 40% сесій йшли на нерелевантну мову. Рішення є, і воно не вимагає складних архітектурних змін.
Правильне налаштування hreflang забезпечує, що кожен користувач побачить відповідну версію: російську в Росії, англійську в США, німецьку в Німеччині. Це підвищує показники Core Web Vitals (LCP/TTFB, CLS, INP) за рахунок коректних редиректів та покращує поведінкові фактори. Нижче — робочі методи для будь-яких стеків.
Як hreflang впливає на ранжування?
Пошуковики використовують hreflang, щоб показувати правильну версію в SERP. Якщо теги налаштовані невірно, Google може розцінити сторінки як дублі та понизити їх у видачі. Наприклад, дві сторінки з однаковим контентом російською та українською будуть конкурувати одна з одною. hreflang вирішує цю проблему, об'єднуючи їх у групу та розподіляючи трафік по регіонах. Більше того, опосередковано покращуються показники CLS та INP за рахунок того, що користувач не перемикає мову вручну. Google Search Central показує, що коректна реалізація hreflang може збільшити CTR на 20% та знизити показник відмов на 15%.
Чому x-default обов'язковий?
x-default — це версія для всіх інших мов та регіонів. Без неї користувачі з невизначеною мовою (наприклад, зі Швейцарії) можуть отримати 404 або помилку сервера. Ми рекомендуємо завжди вказувати x-default на сторінку вибору мови або на англійську версію. Це підвищує довіру пошуковиків та покращує юзабіліті.
Синтаксис тегів
<!-- На кожній мовній версії сторінки додаються ВСІ альтернативи -->
<link rel="alternate" hreflang="ru" href="https://example.ru/products/laptop">
<link rel="alternate" hreflang="en" href="https://example.net/products/laptop">
<link rel="alternate" hreflang="uk" href="https://example.ua/products/laptop">
<link rel="alternate" hreflang="de" href="https://example.de/products/laptop">
<link rel="alternate" hreflang="x-default" href="https://example.net/products/laptop">
Регіональна специфіка
Якщо потрібно розділяти за країною, використовуйте складові коди: ru-RU, ru-UA, ru-KZ, en-US, en-GB. Це враховує різний контент для однієї мови в різних регіонах. Наприклад, ціни або варіанти доставки можуть відрізнятися. Сайт з контентом російською мовою для Росії (ru-RU), України (ru-UA), Казахстану (ru-KZ) та країн Балтії (ru-LT, ru-LV) повинен явно вказати кожен регіональний варіант. Інакше Google покаже загальну російськомовну версію, яка може бути нерелевантною за валютою або доставкою.
Методи розміщення hreflang: порівняння
Існує два основні підходи: розміщення тегів у head сторінки та включення в XML Sitemap. Теги в head зручні для невеликих сайтів: вони одразу видні та прості в реалізації. Однак при 10 000+ сторінках head перевантажується, а підтримка вручну стає трудомісткою. XML Sitemap, навпаки, масштабується без збільшення HTML-коду, але вимагає генерації sitemap та її коректної подачі. На практиці ми використовуємо комбінацію: для новинних та блогів — теги, для інтернет-магазинів — sitemap. Налаштування hreflang через sitemap у 10 разів швидше для 10 000 сторінок, ніж ручне додавання тегів.
| Мова | Код ISO 639-1 | Приклад регіону |
|---|---|---|
| Російська | ru | ru-RU, ru-UA, ru-KZ |
| Англійська | en | en-US, en-GB, en-AU |
| Німецька | de | de-DE, de-AT, de-CH |
| Іспанська | es | es-ES, es-MX, es-AR |
Реалізація в Laravel
Покажемо на прикладі популярного стеку. Ми використовуємо Laravel 11 з мультимовністю через пакет spatie/laravel-translatable. Конфіг локалей:
// config/locales.php
return [
'ru' => ['hreflang' => 'ru', 'domain' => 'example.ru'],
'en' => ['hreflang' => 'en', 'domain' => 'example.net'],
'uk' => ['hreflang' => 'uk', 'domain' => 'example.ua'],
'de' => ['hreflang' => 'de', 'domain' => 'example.de'],
];
В контролері будуємо масив hreflang, перевіряючи наявність перекладу:
public function show(string $slug): View
{
$page = Page::where('slug->ru', $slug)
->orWhere('slug->en', $slug)
->firstOrFail();
$hreflangs = $this->buildHreflangs($page);
return view('page', compact('page', 'hreflangs'));
}
protected function buildHreflangs(Page $page): array
{
$locales = config('locales');
$hreflangs = [];
foreach ($locales as $locale => $config) {
$slug = $page->getTranslation('slug', $locale);
if ($slug) {
$hreflangs[$config['hreflang']] = 'https://' . $config['domain'] . '/' . $slug;
}
}
$hreflangs['x-default'] = $hreflangs['en'] ?? reset($hreflangs);
return $hreflangs;
}
У Blade виводимо через цикл:
@foreach ($hreflangs as $lang => $url)
<link rel="alternate" hreflang="{{ $lang }}" href="{{ $url }}">
@endforeach
Це генерує повний набір тегів на кожній сторінці. Важливо: slug повинен бути перекладений для кожної локалі, інакше посилання не потрапить у hreflang. Ми також додаємо перевірку, що x-default вказує на англійську версію або на першу доступну.
Hreflang в XML Sitemap
Для великих сайтів (10 000+ сторінок) ефективніше розміщувати hreflang у sitemap. Це знижує навантаження на head і спрощує генерацію. Приклад:
<url>
<loc>https://example.ru/products/laptop</loc>
<xhtml:link rel="alternate" hreflang="ru" href="https://example.ru/products/laptop"/>
<xhtml:link rel="alternate" hreflang="en" href="https://example.net/products/laptop"/>
<xhtml:link rel="alternate" hreflang="x-default" href="https://example.net/products/laptop"/>
</url>
Типові помилки
- Одностороннє вказання — сторінка A посилається на B, але B не посилається на A. Теги повинні бути взаємними.
- Неіснуючі URL — hreflang веде на 404 або редирект. Перевіряйте всі посилання.
- Різний контент — якщо на сторінках з різними hreflang однаковий контент, пошуковики сприймають це як дублі.
- Неправильний код мови — тільки ISO 639-1 для мови, ISO 3166-1 Alpha-2 для країни.
Покрокова інструкція по перевірці hreflang
- Зберіть всі URL мовних версій для однієї сторінки.
- Перевірте, що на кожній сторінці присутні всі альтернативні посилання включаючи x-default.
- Переконайтеся у взаємності: сторінка A посилається на B, B на A, і так далі.
- Перевірте відсутність 404 та редиректів в href.
- Використовуйте інструмент Merkle Hreflang Tags Testing Tool або Google Search Console.
Приклад для WordPress з плагіном Polylang
Встановіть плагін Polylang, налаштуйте мови та використовуйте функцію polylang_the_languages() для виведення. Polylang автоматично генерує hreflang-теги при включенні опції в налаштуваннях. Переконайтеся, що slug перекладів унікальні, інакше виникне помилка.Що входить в роботу
- Аудит поточних hreflang (якщо є)
- Проектування схеми мов/регіонів
- Реалізація: код (Laravel, Vue, будь-який стек), sitemap, middleware
- Тестування: GSC, інструменти, ручна перевірка
- Документація та навчання команди
- Підтримка протягом місяця після налаштування
Наші сертифіковані експерти мають понад 10 років досвіду в мультимовній SEO-розробці. Виконали понад 40 проектів з hreflang для великих інтернет-магазинів та корпоративних сайтів, гарантуючи коректну роботу тегів після налаштування.
Замовте аудит поточних hreflang — це займе 1 день. Отримайте консультацію по налаштуванню мультимовності.
Строк налаштування: 1–3 дні залежно від складності. Зв'яжіться з нами, щоб обговорити ваш проект.