After determining the best URL structure for your international website, implementing hreflang tags is the next crucial step in optimizing your site for global audiences.
The hreflang attribute helps search engines understand which audience a webpage is intended for, ensuring users see the most relevant version of a site in their search results.
This blog post will explain the hreflang attribute, when it should be used, and provide practical tips for implementation.
What is Hreflang?
The hreflang attribute specifies the language and geographical targeting of a webpage. It helps search engines serve the correct language or regional URL in search results based on the users’ language preference and location.
Example of hreflang
To effectively use hreflang tags, each version of your webpage should include tags pointing to itself and the other language/region versions. For example, if you have pages in English for the US (en-US), English for the UK (en-GB), and Spanish for Spain (es-ES), each page should have hreflang tags for all three versions.
<link rel="alternate" hreflang="en-US" href="http://example.com/en-us/" />
<link rel="alternate" hreflang="en-GB" href="http://example.com/en-gb/" />
<link rel="alternate" hreflang="es-ES" href="http://example.com/es-es/" />
What is the Difference Between HTML Lang and Hreflang?
The lang attribute specifies the language of the content within an HTML element, helping browsers and screen readers handle the text correctly; while the hreflang attribute is used in links to indicate the language of the linked content, assisting search engines in delivering the correct language version to users.
⭐ Pro Tips:
Google doesn’t use hreflang or the HTML lang attribute to detect the language of a page. Instead, they use the content of your page to determine its language. So make sure you are using a single language on your page.
When Should You Use the Hreflang Attribute?
1. Multiple Language Versions of a Website
If your website is available in multiple languages, using the hreflang attribute is essential. For example, if you have an English version and a Spanish version of your site, hreflang helps ensure that English-speaking users are directed to the English version while Spanish-speaking users are directed to the Spanish version. This is particularly important for global businesses aiming to cater to diverse linguistic audiences.
2. Regional Variations of the Same Language
Websites often create different versions of a page for various regions where the same language is spoken. For instance, British English (en-GB) and American English (en-US) have distinct spelling, terminology, and cultural references. Using hreflang in this scenario helps present the appropriate version to users based on their geographical location, enhancing relevance and engagement.
3. Avoiding Duplicate Content Issues
Duplicate content can negatively impact your site’s SEO. When you have similar content across different URLs targeting different languages or regions, search engines might consider it duplicate content. Implementing the hreflang attribute helps search engines understand that these pages are meant for different audiences.
Do You Need Hreflang on Every Page?
It’s not necessary to use the hreflang attribute on every page of your website. The hreflang attribute should be used on pages that have equivalents in other languages or regions. If a page is only available in one language, there’s no need to include hreflang tags.
So, let’s say if your blog article is only in English, then you don’t need to add any hreflang on your blog post, even though your homepage is localised in other different languages.
Do You Need Hreflang Tags on a Single Language Site?
If your website is entirely in a single language and not targeting multiple regions with different versions of the same language, you do not need to use hreflang tags.
For example, if your website is solely in English and intended for a global audience without regional variations (like en-US vs. en-GB), hreflang tags are unnecessary. However, if your single-language site targets different regions with distinct versions, such as separate pages for UK and US audiences, then using hreflang can still be beneficial.
7 hreflang best practices
1. Use correct language and region Codes
I have noticed that people use the wrong code in the hreflang, especially if the language and country has a different yet similar code.
So, make sure that you’ve checked the list to select the correct ISO 639-1 language codes and, if necessary, the ISO 3166-1 alpha-2 region codes.
Let’s say you have a version of your website in Swedish for users in Sweden. You should use sv for Swedish (language) and SE for Sweden (country):
<link rel="alternate" hreflang="sv-SE" href="http://example.com/se/" />
Do you see how confusing it can be?
2. Maintaining consistent hreflang tags across all versions
Ensure that each version of your page includes hreflang tags for itself and all other versions. This means every page should list all the alternate language and regional versions, creating a comprehensive network of hreflang references.
If you receive a missing return link in your SEO audit report, it means that you have a page in one language linked to another version, but that version does not link back.
For example, if the English version links to the French version, the French version must also link back to the English version.
⭐ Pro Tips:
If you’re using x-default, make sure all the language versions are using the same default pages as well.
Don’t use ‘en’ as the default page on your English version but use ‘fr’ as default on the French one.
3. Include self-referencing hreflang
Self-referencing hreflang tags help search engines understand the relationship between different language versions of your pages and ensure that each page is indexed correctly.
Without self-referencing hreflang tags, search engines might not fully understand the intended audience of a page, potentially leading to indexing and ranking issues.
4. Combine with canonical URL
Each language version should have a canonical tag pointing to itself to indicate that it is the preferred URL for that language or region. I also make sure that I’m using the canonical URL of the specific country/language version when it’s linked via hreflang.
Too many times I notice that someone accidentally adds or removes the trailing slash in the hreflang link, which creates an unnecessary internal 301 redirect (especially if you use a language dropdown which has the wrong URL).
So, double check if the URLs in your hreflang tags are correct and correspond to the actual pages. Any mismatch can result in search engines disregarding your hreflang tags.
5. Use x-default for default pages
If you have a default page that serves users whose language isn’t specifically targeted, use the x-default hreflang attribute as a fallback option. This tells search engines to serve this page when no other language versions are more appropriate.
6. Use absolute URLs
When implementing hreflang tags, always use absolute URLs rather than relative URLs. Absolute URLs include the full path, which helps avoid confusion and ensures that search engines can correctly locate and interpret the links.
This is useful because websites often undergo structural changes, such as moving to a different domain or altering the directory structure. If relative paths are used, these changes can break the links or lead to incorrect references. Absolute URLs remain consistent and unaffected by such changes, ensuring that hreflang tags always point to the correct locations.
Also, for websites that have different language versions hosted on different domains, using relative paths is not feasible. Absolute URLs are necessary to specify the exact location of the alternate language pages across multiple domains.
7. Regular Audits
Regularly audit your hreflang implementation to catch and fix any issues. Tools like Screaming Frog can be useful to crawl and verify your hreflang setup.
By following these best practices, you can optimize your site for international audiences and improve your overall SEO performance.
Conclusion
The hreflang attribute is a powerful tool for any website aiming to reach a global audience. By ensuring that users are directed to the most relevant version of your site, you can improve user experience, boost engagement, and enhance your SEO efforts.