hreflang tag explained for multi-language sites

As you prepare to launch or maintain a multi-language website, one crucial aspect of your online presence is often overlooked: hreflang tags. These tiny pieces of code play a vital role in helping search engines understand the language and region of your content. When setting up an hreflang tag for your multi-language site, it's essential to consider the nuances of internationalisation. You'll need to identify the primary language and region for each page or resource on your site, and then specify this information using the hreflang attribute in your HTML tags. This will enable search engines to display content from the correct country or region when a user searches in that location. For example, if you have an e-commerce site with English content but also serve customers in France, you

Getting Started

Key Considerations

When implementing hreflang tags on a multi-language site, it is essential to consider the content and target audience of each language version. The hreflang attribute should be used consistently across all pages, with separate values for each language, to avoid confusion for search engines. Furthermore, it's crucial to use rel="alternate" instead of rel="canonical", as the latter can lead to duplicate content issues, and ensure that the hreflang tags are correctly formatted to reflect the primary language version of each page. Additionally, the hreflang tag should be used in conjunction with the XML sitemap and robots.txt file to provide a comprehensive understanding of the site's structure and content.

Practical Steps

To implement hreflang tags on a multi-language site, start by identifying the primary language of your website and creating a separate version for each target language. You will need to create unique content for each language, as well as corresponding hreflang tags in the HTML code of each page. The hreflang tag should be placed within the head section of each webpage and should contain the target language code preceded by 'rel="alternate"'. For example, if you are targeting both English and French versions of your site, your hreflang tag might look like this: ''. By doing so, search engines will be able to understand the language intended for

Implementing hreflang Correctly

The hreflang attribute tells search engines which language and regional version of a page to show a given user. Add a set of link elements in the head, one for each version, using language and optional region codes such as en-GB or fr-FR. Every version must reference every other version, including itself, so the set is complete and reciprocal. You can also declare an x-default version for users whose language you do not specifically target. Consistency across the whole set is what makes it work.

A Worked Example

A shop sells to the UK and France with English and French pages. Each product page lists hreflang tags for en-GB and fr-FR pointing to the matching version, plus a self-reference. Now a French searcher is served the French page and a UK searcher the English one, instead of the two versions competing or the wrong language appearing. The reciprocal tagging is what prevents search engines ignoring the signal.

Common hreflang Mistakes

• Non-reciprocal tags, where page A points to B but B does not point back.
• Using incorrect or invented language and region codes.
• Pointing hreflang at URLs that redirect or return errors.
• Forgetting the self-referencing tag on each version.

Testing Your Setup

Because hreflang errors are easy to make and hard to spot, validate the setup. Search Console reports hreflang issues under its international targeting data, and several free validators will crawl a page and confirm the tags are reciprocal and use valid codes. Fix any mismatches promptly, because a single broken reference can cause search engines to disregard the whole set and serve the wrong language version to your visitors.

For those embarking on an SEO journey, we've compiled practical guides and checklists to help webmasters and small business owners assess their site's readiness for search engine optimisation. — Editor, EnlightenIt