Позиція вашого веб-сайту в рейтингу Google – одне з найскладніших завдань, з яким стикаються багато веб-сайтів, особливо в електронній комерції. Більше того, SEO – це складна концепція, яка постійно змінюється та розвивається. Тому може бути важко встигати за майбутніми оновленнями та алгоритмами.
Однак є деякі важливі фактори, на які вам, як власнику магазину, слід звернути увагу: швидкість веб-сайту, оптимізація зображень, контент. Список можна продовжувати нескінченно.
Концепція, з якою ми хочемо ознайомити вас сьогодні, – це теги hreflang, атрибути hreflang або альтернативні теги hreflang. Ви дізнаєтеся, що таке теги hreflang, чому вони вам потрібні, як вони впливають на ваш веб-сайт і, найголовніше, як додати їх на ваш веб-сайт Magento 2, щоб отримати рейтинг.
Без зайвих слів, почнемо.
Що таке теги hreflang?
Теги hreflang, також відомі як rel="alternate" hreflang="x", – це фрагменти HTML-коду, додані на сторінки вашого веб-сайту, щоб повідомити Google та інші пошукові системи, що у вас є різні альтернативи однієї й тієї ж сторінки.
Альтернативні атрибути hreflang використовуються, якщо на вашому веб-сайті є кілька переглядів магазину та контент розміщується різними мовами. Також, якщо у вас є контент однією мовою для різних регіонів, наприклад, англійська в США, англійська в Великій Британії та англійська в Австралії.
Ви заплуталися?
Те саме стосується Google, коли він бачить, що у вас багато дублікатів контенту. Отже, якщо ви не використовуєте теги hreflang для зв'язування сторінок, пошуковим системам важко вибрати, яку сторінку ранжувати. Зрештою, вони ранжують лише одну сторінку, залишаючи інші сторінки позаду.
Ось чому вам потрібно використовувати теги hreflang, щоб усі сторінки ранжувалися однаково.
Однак, це не так просто.
Як виглядають теги hreflang?
Тепер, коли ви вже знаєте, що таке тег hreflang, давайте детальніше розглянемо цей елемент атрибута link. Отже, альтернативне посилання виглядає так:
< link rel="alternate" hreflang="x" href=" https://www.mywebsite.com ">
Як бачите, тут є три атрибути HTML:
- link rel="alternate" - повідомляє пошуковим системам, що є інші альтернативи цій сторінці
- hreflang="x" - вказує мову альтернативної сторінки (іноді також регіон)
- href=" https://www.mywebsite.com " - вказує посилання на альтернативну сторінку
Однак, існують також різні значення hreflang, які ви повинні використовувати залежно від мови та регіону, на який ви хочете орієнтуватися.
Код мови
Якщо ви не хочете орієнтуватися на якусь конкретну країну, альтернативні теги для ваших сторінок повинні виглядати так:
У цьому прикладі ми встановили теги hreflang для англійської, української, французької та іспанської сторінок веб-сайту.
Досить легко, чи не так?
Так, якщо ви не вкажете країну, на яку хочете орієнтуватися. Однак, коли ви продаєте по всьому світу, вам потрібно забезпечити більш персоналізований досвід.
Мова-код країни
У деяких країнах використовується лише одна мова, а в деяких — кілька мов. У цьому випадку вам потрібно додати код країни до тегів hreflang, щоб вони працювали краще.
Ми розглянемо два різні приклади застосування кодів країн.
Приклад №1 На основі місцезнаходження
Припустимо, ви хочете орієнтуватися лише на англомовних людей з Великої Британії, США та Австралії у вашому магазині. Продукт буде тим самим, але ціни та контент можуть відрізнятися.
Усі сторінки будуть англійською мовою, тому вам слід уникнути дублювання контенту, застосовуючи альтернативні теги hreflang. Вони виглядатимуть так:
Приклад №2 На основі мови
У цьому випадку ваш магазин працює в одній країні, але все ще орієнтований на різні мови. Наприклад, ви продаєте в Канаді, але хочете надавати контент англомовним, франкомовним та іспаномовним людям.
У цьому випадку зверніть увагу на шаблон «мова-країна»:
Важливо зазначити, що код мови завжди йде першим , а за ним йде код країни.
Крім того, кожна альтернативна сторінка повинна містити однаковий набір альтернативних тегів.
Наприклад, якщо у вас є 3 альтернативи головної сторінки англійською, іспанською та французькою мовами, всі 3 з них повинні містити однакові 3 альтернативні теги.
Майте це на увазі, якщо ви хочете уникнути теги hreflang з помилками на своєму веб-сайті.
X‑default Hreflang
Іноді, коли Google аналізує ваш веб-сайт, він не знаходить відповідної сторінки для відображення клієнту в SERP. Тим не менш, він має щось відобразити. У цьому випадку він спирається на атрибут X‑default.
Отже, теги X‑default використовуються для визначення сторінки, на яку пошукові системи повинні повернутися, якщо вони не знаходять жодної іншої сторінки на вибір. Зазвичай вони не є обов’язковими для використання, проте Google рекомендує вам додати їх.
Ви дізнаєтеся, чому це потрібно, пізніше в цій статті.
Сторінка hreflang=" x-default " може бути однією з альтернативних сторінок, які вважаються сторінками за замовчуванням, як тут:
А ось як це виглядає в коді:
Як працюють теги Hreflang?
Google аналізує багато речей, перш ніж показати сторінку вашого веб-сайту в результаті запитів користувачів. Коли на вашому веб-сайті немає тегів hreflang, як ми вже говорили раніше, Google використовує найкращі здогадки, щоб знайти якусь сторінку.
Не дуже надійно, чи не так?
Однак, коли ви додаєте теги hreflang до сторінок вашого магазину Magento, Google працює на основі найкращого збігу після аналізу сигналів країни та мови.
Наприклад, є франкомовний клієнт у Швейцарії, який шукає деякі товари в Інтернеті. Отже, ось кроки, які Google виконає:
Крок 1: аналіз збігу мови та країни (fr-ca)
Крок 2: аналіз збігу мови (fr-be)
Крок 3: перехід до «x-default», якщо не знайде жодних збігів
Чи потрібні вам теги Hreflang у Magento 2?
В електронній комерції та зокрема в Magento існують різні сценарії, коли вам потрібно використовувати теги hreflang, якщо ви продаєте по всьому світу. Іноді ви хочете будь-якими способами покращити рейтинг свого веб-сайту та шукаєте найкращі способи зробити це.
Ми вже частково розглянули це, але давайте перерахуємо найпоширеніші випадки, коли вам потрібно їх використовувати:
- У вас є магазин для однієї країни з місцевими мовами
, наприклад, веб-сайт у США з англійською та іспанською мовами перегляду магазину або веб-сайт у Канаді з каліфорнійською англійською та французькою мовами перегляду магазину
- У випадку, якщо ви продаєте по всьому світу та маєте один веб-сайт з кількома переглядами магазину для різних країн
, наприклад, магазин з іспанською, німецькою, французькою, українською, італійською мовами перегляду магазину та англійською мовою перегляду магазину за замовчуванням
- Якщо у вас є магазин однією мовою, яка має різні варіанти
, наприклад, англомовний веб-сайт для США, Великої Британії та Австралії або німецькомовний магазин для Німеччини, Австрії та Швейцарії
У всіх 3 випадках посилання hreflang будуть різними, залежно від архітектури вашого веб-сайту. Однак вам доведеться налаштувати теги hreflang у будь-якому з них, щоб ваші багатомовні сторінки були видимими для пошукових систем.
Причини використання тегів hreflang у Magento 2
Якщо ви раніше не були переконані в необхідності використання тегів hreflang, то, ймовірно, будете переконані після того, як почуєте про їх переваги. І є кілька ключових моментів, які можуть суттєво покращити ваш магазин Magento 2.
1. Перевага тегів hreflang для SEO
Як ми вже розглядали, щоб отримати високий рейтинг у Google, вам потрібно докласти багато зусиль та оптимізувати багато речей. Теги hreflang безпосередньо пов'язані з SEO, оскільки вони допомагають вам отримати високий рейтинг сторінок вашого багатомовного веб-сайту.
Якщо на вашому веб-сайті є альтернативні сторінки трьома різними мовами, але ви не використовуєте альтернативні теги hreflang, пошукові системи нададуть пріоритет лише одній сторінці та розмістять її в SEPR. Вони не звертатимуть особливої уваги на інші дві.
Тож не дивуйтеся, якщо інші дві сторінки не отримають великої популярності.
За допомогою атрибутів hreflang, навпаки, ви зможете покращити ранжування всіх трьох. Однак, зверніть увагу, що теги hreflang – це лише сигнал, а не директива.
Якщо ви не бачите свої сторінки в першій видачі Google після впровадження тегів hreflang, можливо, є інші речі, які потрібно врахувати.
2. Покращений користувацький досвід
Ми отримуємо тисячі результатів за нашими запитами в Google. Уявіть, що ви шукаєте щось і отримуєте багато результатів англійською мовою, хоча ваша рідна мова – німецька.
Ви натискаєте на результат англійською мовою, оскільки у вас мало вибору. Як тільки ви потрапляєте на сторінку, ви бачите, що можете переключитися на німецьку мову, оскільки є вигляд магазину німецькою мовою, але не радійте.
Чому?
Тому що є багато Extra дій, які ваші клієнти повинні виконати, щоб отримати інформацію, яка їх цікавить. Хіба не було б краще, якби ця німецькомовна сторінка спочатку відображалася в результатах Google?
Саме це й забезпечують теги hreflang. Вони дозволяють вам надавати персоналізовані та більш локалізовані результати для ваших клієнтів і покращувати їхній досвід.
3. Зниження показників відмов та краща конверсія
Чим вищий ваш рейтинг у Google, тим більше людей відвідують ваш веб-сайт. І якщо ви швидко надасте їм інформацію їхньою рідною мовою, ви побачите покращення.
Менше клієнтів залишать ваш веб-сайт, навіть не переглянувши його. Вони залишатимуться на ньому довше та витрачатимуть більше часу на вивчення ваших продуктів.
4. Кращий перемикач магазинів
Якщо у вас є багатомовний веб-сайт Magento 2 і ви продаєте товари по всьому світу, ви можете зіткнутися з проблемами перемикання магазинів. Навіть якщо ви налаштуєте коди магазинів та створите представлення магазинів для різних мов, ваші клієнти можуть зіткнутися з проблемами перемикання.
Наприклад, клієнти потрапляють на представлення магазину англійською мовою за замовчуванням, але їхня рідна мова – німецька, і вони хочуть перейти на німецьке представлення магазину. Однак, коли вони використовують перемикач магазинів, їх перенаправляє на головну сторінку або сторінки 404.
Це трапляється тому, що немає тегів hreflang, які б вказували, що англійська сторінка має німецьку альтернативу.
Як додати теги hreflang у Magento 2?
Ми обговорили всі переваги та випадки, коли вам потрібно використовувати теги hreflang, і тепер настав час дізнатися, як додати їх на ваш веб-сайт Magento. Існує кілька можливих способів зробити це. Однак вони залежать від обсягу зусиль та навичок, які ви хочете цьому присвятити.
Додавання тегів hreflang вручну
Згідно з службою підтримки Google, ви можете додати атрибути hreflang трьома різними способами. Уявімо, що у вас є англомовний веб-сайт для 3 країн, і розглянемо, як працюють теги hreflang у кожному випадку.
Теги HTML
Цей метод є одним із найпростіших способів додавання тегів hreflang. Вам потрібно розмістити їх на тезі
на сторінці вашого веб-сайту. Однак, ви повинні пам'ятати, що теги таОтже, в основному, атрибути hreflang повинні виглядати так у тезі
:
Примітка: хоча це просто, це займає найбільше часу, оскільки всі альтернативні сторінки повинні мати однаковий набір тегів hreflang. А уявіть, що у вас вже є 2 сторінки перегляду магазину, пов'язані з посиланнями hreflang на вашому веб-сайті Magento, і ви вирішили додати ще 2.
Вам доведеться перейти до кожної сторінки, яка вже має альтернативні теги, щоб додати ще 2.
Шалено довгий процес, чи не так?
HTTP-заголовки
Цей метод не є поширеним, оскільки він використовується лише у випадку, якщо на вашому веб-сайті є контент, який не є HTML. Це можуть бути PDF-файли для різних мов, на які ви хочете орієнтуватися. Ось приклади того, як це має виглядати:
Карта сайту
Нарешті, ви можете додати теги hreflang до файлу sitemap.xml вашого веб-сайту. Це включає створення окремих елементів <url> для кожної з ваших альтернативних сторінок та інші важливі кроки. Якщо ви не технічний спеціаліст, додавання тегів hreflang таким чином може бути складним завданням.
Приклад альтернативних тегів у мапі сайту:
Однак, ми рекомендуємо вам дотримуватися детальних інструкцій від Google , щоб правильно налаштувати це.
Розширення Hreflang Tags для Magento 2
Теги Hreflang може бути важко налаштувати, особливо якщо у вас немає технічних знань або ви просто не хочете витрачати на це купу часу. Однак, якщо вам цікаво, чи є простий спосіб, у нас є для вас рішення.
Хоча Magento за замовчуванням не дозволяє додавати теги hreflang з панелі адміністратора, розширення дозволяє. Все, що вам потрібно зробити, це налаштувати альтернативні сторінки в панелі адміністратора, і розширення згенерує альтернативні посилання hreflang у коді.
. Візьмемо як приклад головну сторінку Magento 2 і спробуємо встановити для неї теги hreflang.
Розширення Magento Hreflang Tags додає розділ Альтернативні локалізації перегляду магазину на кожну сторінку, де ви можете знайти список доступних мов. Отже, коли ми знаходимося на англійській версії головної сторінки, ми просто починаємо вводити назву сторінки альтернативною мовою (в цьому випадку українською).
Обидві версії сторінки повинні мати однакові теги hreflang. Однак вам не потрібно переходити до української версії головної сторінки, щоб також встановити атрибути hreflang там. Розширення робить це автоматично.
На українській версії сторінки ми бачимо, що теги hreflang вже встановлені для англійської версії.
Тож процес вдвічі простіший.
І ось що ми отримуємо в результаті:
Більше того, розширення працює для всього веб-сайту: сторінок CMS, дописів у блозі та категорій, а також головної сторінки, яку ми щойно розглянули.
А як щодо сторінок товарів та категорій? - запитаєте ви.
Розширення автоматично генерує для них теги hreflang, якщо сторінки товарів для кількох переглядів магазину мають однаковий ідентифікатор. Якщо ні, ви можете встановити альтернативну сторінку товару або категорії так само, як і інші.
Ви можете додати теги hreflang до сторінок вашого веб-сайту Magento 2 без особливих зусиль, лише за кілька кліків. І це не вимагає жодних технічних знань, оскільки вам не потрібно працювати з кодом сторінки.
Крім того, він пропонує вам низку інших корисних функцій.
Якщо у вас є кілька представлень магазинів однією мовою, ви можете просто ввімкнути опцію Локаль залежить від регіону . А якщо ви не можете знайти потрібну локаль у налаштуваннях Magento за замовчуванням, ви можете встановити Власний код локалі.
Якщо у вас є кілька веб-сайтів Magento, кожен з різними представленнями магазину, ви можете просто обмежити теги hreflang одним веб-сайтом, встановивши Групу локалей. Розширення також охоплює x-default .
– ідеальний варіант для менеджерів магазинів та адміністраторів, оскільки він дозволяє їм додавати теги hreflang набагато швидше та простіше. Перегляньте це на нашому , щоб переконатися!
Теги Hreflang. Так чи ні?
Ого... Це була справжня пригода. Тепер ви знаєте набагато більше про альтернативні теги загалом та Magento 2 зокрема. В електронній комерції потрібно звертати Extra увагу на дрібниці, такі як альтернативні атрибути, особливо на багатомовних веб-сайтах.
Чому дрібниці?
Альтернативні теги hreflang не є обов'язковими. Google може ранжувати ваші сторінки без них. Однак, краще чітко вказати, які сторінки призначені для яких мов або регіонів, щоб уникнути помилок, пов’язаних із тегами hreflang.
Це не лише забезпечує кращий користувацький досвід, але й покращує SEO, збільшує конверсії та зменшує показники відмов. Хоча існує кілька магазинів з однаковими продуктами, ви виділятиметеся, забезпечуючи персоналізований досвід.
Отже, теги hreflang. Так чи ні?
