Hreflang is a very useful attribute for any eCommerce store or website that targets international markets. Hreflang tags can be very handy if you have the same content created for audiences from different geographical regions and languages. As a result, these tags play a major role in technical SEO. So, what is hreflang? In this blog, we will cover all the important things you need to know about hreflang tags.Â
With the help of hreflang tags, you get to inform search engines about the language and geographical location of your specific web page. In our comprehensive guide, you will learn about hreflang implementation, common challenges, expert tips and more. So, let us get started!
What Is Hreflang Tag?
Hreflang is an HTML attribute that tells the search engine about the language and geographical location of a particular web page. This tag was originally developed by Google to let users avoid language-related issues. A common example is when the wrong language or regional version of a page is displayed in the search engine to a specific audience. Suppose, a visitor from Japan visits one of your product pages but sees it in English instead of the Japanese language.
For example, you have two versions of a website: one for the English-speaking audience in the UK and another one for the English-speaking audience in the US. Hreflang can help search engines decide that the website visitor from the UK is to be shown UK content. On the other hand, the US visitors will be shown the US content. What is the benefit of this? The result is a more target-specific user experience and a much improved SEO impact.
What Do Hreflang Tags Look Like? How to Build One?
Hreflang tags are placed in the header section of a page of HTML, mostly in the form of links. Here’s what a basic hreflang tag looks like:
<link rel="alternate" href="https://example.com/en-us" hreflang="en-us" />
<link rel="alternate" href="https://example.com/en-gb" hreflang="en-gb" />
The ‘href’ attribute points to the URL of the alternate language version, and the ‘hreflang’ attribute specifies the language and (optionally) region using ISO 639-1 for language codes and ISO 3166-1 for country codes.
Some common Language and Region codes:
- ‘en’: English
- ‘es’: Spanish
- ‘fr’: French
- ‘en-us’: English (United States)
- ‘fr-ca’: French (Canada)
When building hreflang tags, you should be aware of a few key factors. First, check and make a list of all the language and regional versions of your pages. Then, use the correct language and country codes accordingly. Also, use methods like reciprocal links (link exchange between 2 websites) and self referencing which we will discuss more later.
How to Implement Hreflang? Exploring the Most Popular Methods
Now that we have covered the basics of hreflang tags, let us dive a bit deeper. We will now show you how to implement these tags. Please note that there are many ways to do this. Here are three popular ways to implement hreflang tags:
Method 1: HTML Link Tags (in the Header)
Placing hreflang tags in the HTML header section of the page is the most popular option. Every language version of a particular page contains ‘<link>’ tags pointing to itself and its alternate versions. That is why this method can be easily implemented directly in the code of each web page.
Method 2: HTTP Headers
Hreflang tags can be applied not only to HTML documents but also to other formats, such as PDF files. It is especially helpful for downloadable files like PDF documents. This is because HTML headers are not accessible in these cases.
Link: <https://example.com/en-us>; rel="alternate"; hreflang="en-us"
Link: <https://example.com/fr-ca>; rel="alternate"; hreflang="fr-ca"
Method 3: Sitemaps
In large websites, particularly those with many pages, using hreflang tags in an XML sitemap makes the implementation very quick and easy. It also reduces the load time caused by multiple hreflang tags. In your XML sitemap, each URL entry includes a reference using itself as well as each of the alternate language versions. Here is a quick example of what it would look like in XML sitemap:
<url>
<loc>https://example.com/en-us</loc>
<xhtml:link rel="alternate" hreflang="en-us" href="https://example.com/en-us"/>
<xhtml:link rel="alternate" hreflang="fr-ca" href="https://example.com/fr-ca"/>
</url>
Which Method to Go for?
Choose a method that can fit well with the structure of your website and the available resources. Most conventional websites use HTML link tags or sitemaps because of their effectiveness in the process.
Key Points to Remember when Using Hreflang Tags
We are pretty sure you have a clear idea of how hreflang works by now. But did you know you can further optimize your hreflang implementation process? To do this, you need to ensure some crucial steps. By keeping note of these key points, you can ensure more effective results when using hreflang tags:
1. Self Referencing
Every page should ideally have a hreflang tag pointing to itself. This practice is called self referencing. It ensures the retargeting of its own specified language and region. Suppose, you have a French version of your page. This language version should contain rel=”alternate” hreflang=”fr” annotation with a link to itself for self referencing.
2. Bidirectional Linking
If you specify a different language version on a certain page, the alternate version should point to the original one. Known as bidirectional linking, let us look at an example. You have two pages: page A in English and page B in Spanish. If page A links to page B in hreflang annotations, page B should link to page A in exchange.
3. Canonical Tags
Make sure hreflang tags work smoothly with canonical tags between multiple language versions. Usually, every language version will be self canonicalized. Having the canonical URL by default will help prevent the issue of duplicate content.
4. Consistent Codes
Avoid the use of region-specific codes and languages. It is noteworthy that using incorrect codes makes hreflang tags irrelevant. So, simplify the process and remember to check for any errors in the code.
Hreflang Implementation Best Practices
To get the most out of hreflang, you can utilize some best practices during the implementation of the tags. Ensuring these will further optimize your results. So, let us find out more about some of these useful tips.
Tip 1: Audit the URLs of Every Language Version
Check URLs on a regular basis to make sure every language version set up with hreflang tags is working perfectly. Malfunctioning links can confuse search engines and impact your overall SEO results. Use a reliable solution like BetterLinks that comes with advanced link analytics and tracking. With the Advanced Analytics feature of BetterLinks, you can track your links, monitor URL data, carry out split tests etc.
Tip 2: Use the Correct Language & Region Codes
Make sure that you use the correct ISO codes for languages and regions respectively. For example, ‘en-gb’ is different from ‘en-us’. The first one is for English speakers from the UK and the second one is for English speakers from the US. A similar case can be seen when comparing ‘fr’ (for French speakers in France) and ‘fr-ca’ (for French speakers in Canada). Confusing between these similar-looking codes can lead to issues.
Tip 3: Ensure Correct HTTP Status Codes
All language versions should return status code 200 (OK). So remember to check the HTTP status. If a page is redirected or it returns 404 error status, hreflang tags will not be identified. This is why keep this on your checklist.
Tip 4: Avoid Using Excessive Hreflang Tags
When you have a very big website that targets multiple language variations, keep the use of hreflang tags manageable and only cover the most applicable languages. Stay clear of using hreflang excessively and focus on the most relevant languages and regions. Too many tags can make the pages slower. It may also create issues for visitors while downloading or opening anything on the pages.
Tip 5: Utilize Google’s Testing Tools
Google offers a dedicated URL Inspection Tool. This tool is available on the Google Search Console. Using this tool, you can see the status of a URL in the Google index, inspect a live URL, troubleshoot a missing page and more. All of these are super important when it comes to hreflang tag implementation. So, conduct testing with this tool on a regular basis.
Common Hreflang Issues & How to Address Them
If you stay clear of some common mistakes, you can implement hreflang tags even more perfectly. So, let us present some of these issues along with their fixes. Avoiding these errors will save you a lot of time and hassle:
- Incorrect Language or Region Codes: Choosing the wrong code will lead to incorrect audience targeting. Make sure to cross-check each code by using a reference so that there are fewer chances of mistakes.
- Missing Self Referencing Tags: When you fail to include any self referencing hreflang, it makes search engines ignore the tags. So, every page should have a tag that references itself.
- Mismatch between Links in Hreflang & Canonical Tags: If the URL in hreflang is different from the one in canonical tag, search engines tend to prefer the information in the latter. So, canonical and hreflang tags should be pointed to the same URL if possible.
- Broken Links: One of the most typical hreflang issues arises from linking to non-existing pages or broken links. This is why perform a broken link check on a regular basis in order to address these mistakes. You can use BetterLinks Broken Link Checker for this.
- Absence of Bi-Directional Linking: One of the fundamental practices for hreflang implementation is bi-directional linking. Therefore, when linking between pages, ensure that it is done both ways. Hreflang should be designed for one page to point to another which should link back as well.Â
Effectively Guide Search Engines by Implementing Hreflang Tags
We are pretty confident you now know the answer to the question: what is hreflang? SEO experts and webmasters extensively use hreflang tags to enhance the visitor experience and SEO impact when targeting international audiences. By adhering to the best practices outlined in this blog, you can easily implement hreflang tags without any hassle.
Make the best use of hreflang tags in order to increase the functionality of your website and potentially drive SEO in different geographical locations. When applied correctly, hreflang tags are highly effective in making sure that your content reaches your target audiences, no matter where they are located.
We hope you have found this blog useful. Subscribe to our blogs for more informative guides like this. And do not forget to join our Facebook community to get all the latest updates. All the best!
Frequently Asked Questions (FAQs)
Have any questions or confusion? We have compiled some common queries related to hreflang tags. You will get a quick and clear concept from this section. So, let us dive right into the FAQs and their answers.
1. What is hreflang used for?
Hreflang are tags that are used to ensure search engines know the language and country that a specific web page is targeting. These tags help different search engines deliver the relevant version of the page to a visitor depending on their location or language.
2. Are hreflang tags good for SEO??
Yes, hreflang tags help in SEO as they are useful in reducing duplication and providing visitors with a more intuitive experience for multilingual and international sites. When hreflang is set up correctly, it will have a positive impact on your website’s ranking within the local search results.
3. What are some common mistakes when implementing hreflang tags?
Hreflang issues commonly occur when using incorrect language or region codes, missing self referencing tags, using different links in hreflang & canonical tags, linking to non-existing pages or broken links and not implementing bi-directional linking.
4. What is the difference between href and hreflang?
The ‘href’ attribute defines the URL of a link and the ‘hreflang’ tag is used for language and regional targeting for the content of a link. Compared to href, hreflang is used to specify particular language versions.
5. What are some hreflang best practices?
Here are a few tips or best practices for hreflang implementation:
- Audit the URLs of every language version
- Use correct language & region codes
- Ensure correct HTTP status codes
- Avoid using excessive hreflang tags
- Utilize Google’s testing tools