Hreflang tags: A guide to international SEO success

Whether you’re hearing the term hreflang tags for the first time or are seasoned in the school of SEO tags, we’re going to share the things you should know to bolster your multilingual SEO strategy and enhance your user experience.    

In this guide, you’re going to learn precisely what a hreflang tag is and why it’s crucial for your strategy. But before we begin, there are a few things you need to define before launching a website in different languages. 

These include:

• Domain selection
• Geographic and language targeting
• A hosting solution, etc

Once you’ve established these, the best way to achieve international SEO success is to find a web translation agency that offers SEO translation and, when necessary, content localisation.  

An agency can support you in developing a multilingual SEO strategy with essential elements, such as link building and SEO tags. Link building focuses on acquiring hyperlinks from other websites on your own site, while SEO tags, encompassing hreflang tags, involve optimising HTML elements within your own website.   

Here’s what we’ll cover in this article:

• What are hreflang tags?
• The SEO impact of hreflang tags on multilingual sites
• Which search engines support hreflang tags?   
• Hreflang tag structure and placement
• Mistakes to avoid when implementing hreflang tags

What are Hreflang tags?

Hreflang tags are a type of SEO meta-tag. They are HTML attributes that specify the language and geographical targeting of a webpage. Think about when you visit a webpage. Most of the time, you’re shown a version of a page in the language and the location relevant to you. Hreflang tags help search engines determine this. 

The SEO impact of hreflang tags on multilingual sites

By properly implementing hreflang tags, you can improve your website’s visibility in international search results and provide a better experience for users in different language markets.

Some of the benefits include: 

• Improving international SEO by helping search engines understand your site’s language structure.
• Reducing duplicate content issues for multilingual websites.
• Enhancing user experience by offering the most relevant content based on language and location.
• Properly implemented hreflang tags can boost engagement rate and reduce bounce rates
• Helping target content to specific regions that use the same language (e.g. US English vs. UK English).

Which search engines support hreflang tags?

Google

Google uses hreflang tags to serve the most appropriate language or regional version of a page to users in search results.

Bing 

While Bing doesn’t directly support hreflang tags, it uses language meta tags to understand the language of a page. Therefore, you should use the content-language meta tag to specify the language of your page. 

Yandex

This popular search engine in Russia has a similar implementation to Google. It uses hreflang to determine the best version of a page to show users based on their language and location. 

Hreflang tag structure and placement

Now that we know the purpose of Hreflang tags is to tell search engines which language version of a page to show users in different regions, we can interpret the tag’s structure.

Every page available in multiple languages should have a hreflang tag for each language offered. This tells Google which version to display based on the user’s query language and location.

The basic format of a Hreflang tag:

Each tag consists of these components:

• rel=”alternate”: Indicates an alternate version of the page
• hreflang: Specifies the language and optional country code
• href: Contains the URL of the alternate page

Now, let’s look closer at 3 examples: 

English:

<link rel= “alternate”  hreflang= “en-GB”  href= “https://www.example.com/en”  />

German:

<link rel= “alternate” hreflang= “de-DE”  href= “https://www.example.com/de” />

Spanish:

<link rel= “alternate” hreflang= “es-ES”  href= “https://www.example.com/es”  />

You can see that the language codes are in lowercase: “en” for English, “de” for German and “es” for Spanish.

This is followed by the country codes: “GB” for the United Kingdom, “DE” for Germany and “ES” for Spain. So, the first page would be for British English speakers. 

If a page is not available in a specific language and region, the x-default tag can be used:  <link rel= “alternate”  hreflang=”x-default”  href= ” https://www.example.com/en”  />

Note that each page version should have a canonical tag pointing to itself. For example, if we are on the Spanish version of the page, the canonical tag would be: <link rel= “canonical”  href= “http://example.com/es-ES/”>  

 There are three ways to place hreflang tags:

• In thesection of your HTML 

This is the most common and straightforward method. To implement, add the link element with hreflang attributes in thesection of each page. 

•  In your XML sitemap

This slightly more complex method involves adding hreflang information to your XML sitemap. Use the xhtml:link tag within each element in your sitemap.

• In HTTP headers

The last method is used for non-HTML files like PDFs. Here you add link headers to your HTTP response.

Hreflang tag generator tools

It’s no secret that SEO tags can be a little complicated and mistakes can happen. To make your life easier, you can use SEO tag-generating tools like Aleyda Solis.  

Alternatively, depending on your CMS, try using multilingual modules that help implement hreflang tags, such as Polylang for WordPress or Langify for Shopify.   

Mistakes to avoid when implementing hreflang tags

• Placing the tags only on the homepage. 
• Not using the correct country and language codes. Hreflang tags must comply with ISO standards. For example, the region code for the United Kingdom is GB, not UK, which corresponds to Ukraine.
• Not having reciprocal links: if page A links to page B, page B must link back to page A. In other words, if you add a hreflang tag to an English page pointing to a Spanish variant, then the Spanish variant must do the same in return with a hreflang tag pointing to the English page.
• Not including the current page in the hreflang alternate declaration. When using hreflang tags, each page should include a reference to itself, along with references to its alternate language/region versions.

Conclusion

By now, you’ll understand that having great multilingual content isn’t enough to rank highly in various SERPs (Search Engine Results Pages). It takes a well-thought-out multilingual SEO strategy. When hreflang tags aren’t implemented correctly or are missing altogether, search engines struggle to find the right version to display and your target audience struggles to connect with your content. 

At Milega, we simplify your journey to global success. As a dedicated web transition agency, we specialise in high-quality language services tailored to your needs. Whether you require SEO translation, content localisation or transcreation, we’re here to deliver effective solutions. Investing in comprehensive international SEO with us means enhancing user experience, boosting conversion rates and driving sales. Let us help you connect with audiences around the world effortlessly.

Ready to take your site’s SEO to the next level?