Hreflang tags for SEO
Hreflang tags are attributes in HTML that mark the language and region of web pages. They are important so that search engines like Google can determine which version of a page to show to users based on their location and language settings. This is especially critical for sites that are available in multiple languages and target different regions.
When developing a multilingual website, it is important to use hreflang tags to ensure that search engines understand the purpose of each page. This helps the site be indexed more effectively, improves its visibility in search engines, and makes the content more relevant to the target audience.
Why hreflang is so important for SEO
Hreflang tags serve several important functions for multilingual and multi-regional websites. They:
1. Improve regional ranking:
1. Help search engines determine which version of a site should be displayed to users from different countries or regions.
2. Ensure your site's improved appearance in search results for specific geographic locations by making content as relevant as possible.
2. Improve the quality of user experience:
1. Improve user experience by providing content in their native language.
2. They promote long-term stay on the site, interaction with content and performance of target actions, which has a positive effect on SEO due to the fact that search engines take into account behavioral factors.
3. Prevent duplicate content issues:
1. Helps avoid the negative consequences of having the same content in different languages, which search engines may mistakenly consider duplicate.
2. Allows you to clearly indicate that pages are intended for different languages and regions, which ensures correct indexing and display of the site in search results.
What does the hreflang tag look like?
<link rel="alternate" href="https://site.com" hreflang="en-us" >Tag link rel="alternate" used to indicate alternative versions of a page.
Attribute href="https://site.com" in this context provides the URL of an alternative page.
Attribute hreflang="en-us" defines the language and region for which the alternative is intended, in this case English and the United States, respectively. Specifying the country in hreflang not necessarily and depends on the specifics of the target audience.
How to implement correct hreflang tags
You can use one of several approaches to creating hreflang tags for your site, depending on your team's resources and capabilities:
1. Contact the developers – You can send the technical task (TT) to the developers, including examples of similar functions already implemented and a link to the official Google documentation at: Google Developers. This option is suitable if you have experienced developers on your team who can implement this most effectively.
2. Using Google Sheets – Create tags yourself using Google Sheets to create the desired tag structure. After that, you can pass the resulting data to developers for implementation on the site. This method is good for those who prefer to control the process of creating tags and have basic knowledge of working with tables.
3. Using tag generators – Use ready-made tools for creating hreflang tags, for example, the generator from Aleyda Solis, available at the link: Hreflang Tags Generator by Aleyda Solis. This is a good option for those looking for a quick and easy solution without the need for deep technical knowledge.
The choice of method depends on the technical skills of the team and the available resources, as well as the complexity of your project and its scale.
Implementing hreflang tags
Your website may have different language and regional versions that need to be indexed correctly for search engines. Here are the main ways to implement hreflang annotations to improve SEO of international sites and the best practices for using them:
Ways to implement hreflang annotations
1.1. In the HTML code of the page
The most common method is to place tags in the HTML code of each page. Here is an example of code to specify English version for the US and Spanish version for Spain:
<link rel="alternate" hreflang="en-US" href="http://example.com/en-us" />
<link rel="alternate" hreflang="es-ES" href="http://example.com/es-es" />1.2. In HTTP headers
If it is not possible to change the HTML code of the page, you can use HTTP headers. This approach is good in situations where the content is managed via a CMS that does not allow changing the HTML directly:
Link: <http://example.com/en-us>; rel="alternate"; hreflang="en-us", <http://example.com/es-es>; rel="alternate"; hreflang="es-es"1.3. In XML sitemap
This method is suitable for large sites with many pages, where managing hreflang in the HTML code of each page becomes inconvenient. Example in XML sitemap:
<url>
<loc>http://example.com/</loc>
<xhtml:link rel="alternate" hreflang="en-us" href="http://example.com/en-us"/>
<xhtml:link rel="alternate" hreflang="es-es" href="http://example.com/es-es"/>
</url>Best practices for implementing hreflang interlinking
Using hreflang tags can be done not only effectively, but also wisely, so that search engines can correctly recognize and index different versions of a site.
2.1. Mirror links
Each language version must contain links to all other available language versions, including a link to itself (self-referencing tag).
2.2 Self-referencing hreflang
Don't forget to add an hreflang tag for the page itself, which will point to the page itself, thus confirming that this is the version of the language or region the page is intended for.
2.3. Specifying the x-default tag
The x-default tag should be used to specify a version of the page for users whose language/region does not fall into any of the above categories. This is especially useful for multimedia, multi-regional sites that serve content to a global audience:
<link rel="alternate" hreflang="x-default" href="http://example.com/">By following these methods and practices, you can greatly improve the visibility of your site on the international stage, ensuring that the correct version of the page is displayed correctly to users in different parts of the world.
What mistakes can be made when implementing hreflang
Implementing hreflang tags into an international website is important for SEO because it helps search engines understand which version of the site is intended for a specific language or geographic market. However, there are many common mistakes that can negatively impact a site's performance in search engines. Here's a detailed discussion of each:
1. Missing tag with x-default attribute
Problem: Many people forget to specify `x-default`, which can lead to incorrect display of pages for users from regions that are not covered by specific localizations.
Solution: Add a `` tag that points to a version of the site intended for users with an unspecified language or country.
2. Links to non-canonical pages
Problem: Hreflang points to URLs that are not canonical, creating confusion for search engines.
Solution: Make sure that all URLs in hreflang tags match the canonical URLs of the pages specified via ``.
3. Links to pages with response code not 200
Problem: If hreflang references URLs that return an error or are unavailable, it can negatively impact the indexing of pages.
Solution: Check all URLs specified in hreflang tags for server response codes and make sure they always return 200 OK.
4. Incorrect localization or language
Problem: Errors in language or country codes (e.g. `en-US` or `fr-FR`) incorrectly specified in hreflang tags.
Solution: Use standard ISO 639-1 language codes and ISO 3166-1 alpha-2 country codes to denote regions.
5. Different target languages are specified for one page
Problem: Incorrect use of multiple hreflang tags for one page with different language versions.
Solution: Ensure that each language version has its own unique URL and that hreflang tags correctly display pages intended for the appropriate languages and regions.
6. Missing cross hreflang link
Problem: The language versions of the page do not link to each other.
Solution: Add mutual links from all available language versions to each of them, ensuring full interlinking.
7. Mismatch between the language in the hreflang attribute and the HTML of the target page
Problem: The language specified in hreflang does not match the language of the page content.
Solution: Check the language match between the page content and the one specified in hreflang to avoid ranking and relevance issues.
By avoiding these common mistakes, you can greatly improve your multilingual site's search engine optimization and strengthen your global SEO presence.
