Всё про атрибут hreflang: как указать языковые версии страниц
Когда ваш сайт ориентирован на международную аудиторию, очень важно правильно указать языковые версии страниц. Именно для этого был разработан атрибут hreflang. В этой статье мы подробно разберем, что такое атрибут hreflang, как его использовать для указания языковых версий страниц, а также роль атрибута lang в HTML.
Что такое атрибут hreflang?
Hreflang — это атрибут, который используется для указания языковой и региональной версии страницы. Он помогает поисковым системам, таким как Google, правильно показывать пользователям страницы на их языке или в соответствии с их региональными предпочтениями.
Если у вашего сайта есть несколько языковых версий, атрибут hreflang указывает поисковой системе, какая страница должна быть показана пользователю в зависимости от его языка или географического положения. Например, вы можете иметь одну версию сайта на русском языке для пользователей из России и другую для русскоязычных пользователей из Украины.
Зачем нужен атрибут hreflang?
Правильное использование атрибута hreflang поможет вам:
- Улучшить индексацию многоязычных и много региональных сайтов.
- Убедиться, что пользователи видят страницы, соответствующие их языковым предпочтениям или региону.
- Избежать дублей контента, что может негативно повлиять на SEO.
Без использования атрибута hreflang поисковые системы могут не правильно интерпретировать и показывать страницы на языке, который не является целевым для пользователя, что приведет к плохому пользовательскому опыту.
Как работает атрибут hreflang?
Атрибут hreflang используется для связи различных версий страниц. Например, если ваш сайт имеет страницы на английском и французском языках, вы можете использовать hreflang для указания, что одна версия страницы предназначена для англоязычных пользователей, а другая — для франкоговорящих. Это помогает Google и другим поисковым системам показывать нужную страницу в зависимости от языка пользователя.
Пример использования hreflang:
<link rel="alternate" href="https://example.com/en/" hreflang="en" />
<link rel="alternate" href="https://example.com/fr/" hreflang="fr" />
В этом примере Google будет знать, что первая ссылка относится к англоязычной версии страницы, а вторая — к французской.
Атрибут hreflang и региональные различия
Важно не только указать язык страницы, но и регион, для которого эта версия предназначена. Например, английский язык может быть использован в разных странах с некоторыми различиями. Для этого атрибут hreflang позволяет уточнять не только язык, но и страну.
Пример для английского языка для США и Великобритании:
<link rel="alternate" href="https://example.com/us/" hreflang="en-US" />
<link rel="alternate" href="https://example.com/uk/" hreflang="en-GB" />
В этом случае поисковые системы будут понимать, что первая страница предназначена для пользователей из США, а вторая — для жителей Великобритании.
Как правильно указывать атрибут hreflang?
Для того чтобы hreflang работал корректно, нужно учитывать несколько важных аспектов:
1. Указание всех языковых версий страницы
Каждая страница вашего сайта должна содержать ссылки на все другие языковые и региональные версии этой же страницы. Это необходимо для того, чтобы поисковые системы могли корректно сопоставить страницы.
2. Использование правильных кодов языка и региона
Для указания языка используется стандартный код ISO 639-1, а для региона — код ISO 3166-1 Alpha 2. Например:
- en — английский язык
- fr — французский язык
- en-US — английский язык для США
- en-GB — английский язык для Великобритании
3. Указание hreflang в различных местах
Вы можете указать атрибут hreflang несколькими способами:
- В теге <link> в <head> на каждой странице.
- В заголовках HTTP (если страницы динамические).
- В карте сайта (XML sitemap).
Пример указания hreflang в карте сайта:
<url>
<loc>https://example.com/en/</loc>
<xhtml:link rel="alternate" hreflang="en" href="https://example.com/en/"/>
<xhtml:link rel="alternate" hreflang="fr" href="https://example.com/fr/"/>
</url>
4. Правильное использование атрибута lang в HTML
Атрибут lang в HTML также используется для указания языка страницы. Это важно не только для поисковых систем, но и для обеспечения доступности. lang сообщает браузеру, какой язык использовать для рендеринга страницы, и помогает инструментам доступности, таким как экранные читалки, правильно интерпретировать текст.
Пример использования атрибута lang:
<html lang="ru">
<head>
<title>Пример страницы</title>
</head>
<body>
<h1>Добро пожаловать на наш сайт</h1>
</body>
</html>
Здесь атрибут lang="ru" сообщает браузеру, что страница написана на русском языке.
5. Проверка корректности hreflang
Важно убедиться, что атрибут hreflang правильно настроен и работает корректно. Google предоставляет инструмент для проверки ошибок, связанных с hreflang, в Google Search Console. Также можно использовать различные сторонние инструменты для анализа hreflang.
Пример использования hreflang и lang
Для страницы на русском языке и французском языке:
<html lang="ru">
<head>
<link rel="alternate" href="https://example.com/fr/" hreflang="fr" />
<link rel="alternate" href="https://example.com/ru/" hreflang="ru" />
</head>
<body>
<h1>Добро пожаловать на наш сайт</h1>
</body>
</html>
Здесь у нас есть страница на русском языке с правильным атрибутом lang="ru" и указаны ссылки на альтернативные языковые версии с использованием атрибута hreflang.
Ошибки при использовании hreflang
Несмотря на очевидные преимущества использования hreflang, важно избегать распространенных ошибок, таких как:
- Указание неверных языковых кодов.
- Неправильная настройка страницы для конкретных регионов.
- Пропуск указания всех версий страницы.
- Ошибки в синтаксисе атрибутов.
Заключение
Атрибут hreflang — это мощный инструмент для оптимизации многоязычных сайтов. Он помогает поисковым системам правильно индексировать страницы в зависимости от языка и региона пользователя. Не забывайте использовать атрибут lang в HTML для правильного отображения языка страницы. Правильная настройка этих атрибутов обеспечит вашему сайту более высокую видимость в поисковых системах и улучшит пользовательский опыт.
Чтобы гарантировать успешное использование hreflang, всегда проверяйте настройки с помощью инструментов, таких как Google Search Console, и убедитесь, что страницы на всех языках правильно связаны между собой.
Вас может заинтересовать:
Оцените статью