What Are Hreflang Tags? A Quick Guide

When was the last time you visited a website in a different language? You likely remember your browser asking if you wanted to translate the website into your chosen language. This prompt happens because of hreflang tags, which communicate a piece of content’s language to search engines.

When you’re focusing your efforts on other aspects of marketing, it’s easy to miss the importance of using hreflang tags. These HTML attributes ensure your content is available and accessible to an international audience. Don’t miss out on reaching different audiences because you haven’t configured them in your web pages’ code.

What do hreflang tags look like?

A hreflang tag appears as the following syntax in web page code — <link rel=”alternate” hreflang=”x” href=”https://example.com/alternate-page”/>. Every time you add a hreflang tag to your web page’s HTML, you’ll customize the syntax to match the corresponding web page. Three parts make up the syntax:

1. The first (link rel=”alternate”) tells the search engine the webpage is an alternate version of the original.
2. The second (hreflang=”x”) exhibits the web page’s language.
3. The third (href=”https://example.com/alternate-page”/) highlights the URL of the alternative web page.

Let’s say that you’re customizing your “Contact Us” web page so that people who speak French can read it. The syntax would appear as follows — <link rel=”alternate” hreflang=”fr-fr” href=”https://example.com/contact-us”/>. Whenever someone with an IP address located in France navigates to that URL, they’ll be able to click a prompt that translates the content to French.

How do hreflang tags work?

These tags revolve around language and country codes. In the example above, we used “fr-fr” to translate a web page into French for users with IP addresses in France. Every hreflang tag includes that combination, which is set depending on the intended user language and location for a web page.

If your original web page is set to “en,” which is English, that’s the version that will appear to English-speaking users — based on their IP addresses. Then, you can create an identical web page with another hreflang tag for a different language. Alternatively, you can place numerous tags on the same page — just make sure they’re relevant to your audience.

This list of supported language and region codes is what you’ll use for all hreflang tags.

Why should websites use hreflang tags?

Hreflang tags help users find your website in search results faster and more easily. When a user from France is searching for your business, for example, you don’t want to hinder their search by presenting them with the English version of a web page. Instead, you can use hreflang tags to ensure they’re presented with the appropriate option.

In other words, hreflang tags are fundamental for a better user experience — more people can understand and navigate your content. These tags are also crucial for boosting conversion rates. When someone whose chosen language is represented through your content, they’ll have no issues deciphering what they’re seeing and are more likely to become a customer.

These tags are also key for search engine optimization (SEO). Since you’re just creating an alternative version of the same page in another language, Google prefers that websites use hreflang tags to index their web pages. This way, the search engine will understand what you’re aiming to accomplish. Following Google’s recommendations is one of the most fool-proof ways to ensure you’re ranking.

Ultimately, failing to use hreflang tags — especially when you cater to an international audience — will only hinder your online presence.

Tips to remember when adding hreflang tags

Here are a few quick points to keep in mind as you add hreflang tags to your web pages:

• Remember to index: Be sure to index each web page — original and alternative — as you add hreflang tags. This method ensures Google sees and understands the tags.

• Include return links: Always include a return link when dealing with an original web page and an alternative web page. This link ensures that when the original version directs users to the alternative one, the reverse will happen, too. In other words, remember that hreflang tag web pages come in pairs.

• Use the right language and region codes: Be sure to double-check that you’re incorporating the correct language and region codes. If you think you might need help with the syntax, you can use a free online hreflang tag generator to do the work for you.

• Keep regional languages in mind: While people from Mexico and Spain both speak Spanish, that doesn’t mean you can give them the same version of a web page. Ensure you’re paying attention to the region part of the syntax as much as the language to deliver the best possible user experience.

• Try a checker tool: Consider using a hreflang tag checker tool after you’ve implemented a hreflang tag into one of your web pages. This way, you’ll be able to see if it worked or if you need to make some changes.

Optimize your website with SEO.com

There’s much more to SEO than hreflang tags. Try SEO.com for free! Our beginner-friendly tool helps you uncover SEO opportunities faster, discover keywords, track competitors, and more.

Discover Your SEO Potential

Pinpoint opportunities on your website faster and increase your visibility online with SEO.com!

Try It for Free