Ocezy

International SEO: Hreflang Tags Explained

When your website targets audiences in multiple countries or who speak multiple languages, you need a way to signal this to search engines. You want to ensure that a user in Germany sees the German version of your site, and a user in Mexico sees the Spanish version.

The primary technical tool for communicating this is the hreflang attribute.

The hreflang attribute is an HTML tag that you use to tell Google about the different language and regional variations of your pages. Implementing it correctly is one of the most critical and challenging aspects of international SEO.

What is the hreflang Attribute?

The hreflang attribute is a link element that is placed in the <head> section of a webpage's HTML. It tells Google two things:

  1. What language and/or region the current page is targeting.
  2. The URLs of all the other variations of that page for different languages and regions.

Why it's important:

  • It helps Google serve the correct version of your page to the right user, based on their language and location settings. This provides a much better user experience.
  • It prevents duplicate content issues. Without hreflang tags, Google might see your US English version and your UK English version as duplicate content. The hreflang tag clarifies that they are simply alternate versions for different audiences.

The Structure of an hreflang Tag

An hreflang tag looks like this:

<link rel="alternate" hreflang="lang_code" href="url_of_page" />

  • rel="alternate": This tells the browser that there is an alternate version of this page.
  • hreflang="lang_code": This is where you specify the language and, optionally, the region. The language code must be in ISO 639-1 format (e.g., en for English, de for German), and the region code must be in ISO 3166-1 Alpha 2 format (e.g., US for the United States, GB for Great Britain).
  • href="url_of_page": This is the full URL of the alternate page.

Common hreflang Value Examples:

  • en-US: English content for users in the United States.
  • en-GB: English content for users in the United Kingdom.
  • de-AT: German content for users in Austria.
  • es: Spanish content, not targeted to any specific region.

The Two Golden Rules of hreflang Implementation

1. hreflang Tags Must Be Reciprocal

This is the most important rule. If Page A links to Page B in its hreflang tags, then Page B must link back to Page A in its hreflang tags. The annotations must be a complete, two-way set. If they are not, they will be ignored by search engines.

2. Every Page Needs a Self-Referencing hreflang Tag

Every page in a hreflang set must also include a hreflang tag that points to its own URL.

A Complete Example

Imagine you have a page that is available in English for the US and in German for Germany.

On the English page (https://yoursite.com/en-us/page):

<link rel="alternate" hreflang="en-US" href="https://yoursite.com/en-us/page" />
<link rel="alternate" hreflang="de-DE" href="https://yoursite.com/de-de/page" />

On the German page (https://yoursite.com/de-de/page):

<link rel="alternate" hreflang="en-US" href="https://yoursite.com/en-us/page" />
<link rel="alternate" hreflang="de-DE" href="https://yoursite.com/de-de/page" />

Notice that the block of hreflang tags is identical on both pages, and each page includes a tag that points to itself.

The x-default Attribute

It's also a best practice to include an x-default hreflang tag. This tag specifies the default or fallback page that should be shown to users whose language or region settings do not match any of your other specified versions.

Example:

<link rel="alternate" hreflang="x-default" href="https://yoursite.com/en-us/page" />

How to Implement hreflang Tags

There are three ways to implement hreflang tags:

  1. In the HTML <head>: This is the most common method, as shown in the examples above.
  2. In your XML Sitemap: This can be a cleaner method for very large websites, as it doesn't require adding code to every single page.
  3. In your HTTP Headers: This is used for non-HTML files, like PDFs.

For most businesses, implementing the tags in the HTML <head> is the most straightforward approach.

Common Mistakes to Avoid

  • Using the wrong language or country codes.
  • Forgetting to make the links reciprocal.
  • Using a relative URL instead of an absolute URL in the href attribute.
  • Implementing hreflang tags on pages that are blocked by robots.txt or have a noindex tag.

Conclusion

The hreflang attribute is a complex but essential part of international SEO. It is the definitive way to signal your site's language and regional targeting to search engines. While it can be tricky to implement correctly, getting it right is crucial for ensuring that your global audience finds the right version of your content, providing a better user experience and maximizing your international search visibility. If you are unsure about your implementation, it's often best to work with an SEO professional who has experience with international websites.

Disclaimer

The information provided on this website is for general informational purposes only and may contain inaccuracies or outdated data. While we strive to provide quality content, readers should independently verify any information before relying on it. We are not liable for any loss or damage resulting from the use of this content.

Ready to Build a Website That Works for You?

Your website should be your best employee. At Ocezy, we build fast, beautiful, and effective websites that attract customers and grow your business.

Get a Free Consultation

Keep Reading

Accessibility in Color Choices for Branding

A guide to color accessibility in branding. Learn why accessible color choices are important and how to check your brand's color palette for sufficient contrast to meet WCAG standards.

Optimizing Your Website Content for SEO: A Step-by-Step Guide

A practical, step-by-step guide to on-page SEO. Learn how to optimize your website content, from keyword placement and title tags to images and internal linking, for better search rankings.

Video Marketing Analytics: What to Track

A guide to video marketing analytics. Learn which key metrics to track on platforms like YouTube and Wistia, from watch time and audience retention to engagement and conversions.