What is rel=”alternate” hreflang=”x”?

Hreflang is used to determine language of the content on the page, it helps search engine (like: Google) to identify language on the page so they can serve it to right reader base.

<link rel="alternate" href="http://ashishuideveloper.in” hreflang="en" />

OR

<link rel="alternate" href="http://ashishuideveloper.in” hreflang="en-in” />

hreflang is introduced by Google in December 2011. It is useful when site has more then one languages. Adding it specifies to search engine this site has localise content for specific region or language, so search engine can show-up search result accordingly.

Let’s take an example of an international e-commerce company called “X” having it’s customer base in India, US, English, France, Germany. The company X do not want to show a price in Dollar ($) to their users in Germany or France, right? So to fix this confusion company X should add rel=”alternate” hreflang=”fr-FR” tag for Franch and rel=”alternate” hreflang=”de-DE” tag for Germany based customers.

// With Price tags in $ and English language

<link rel="alternate" href="http://some-ecom.com" hreflang="en" />

// With Price tags in Euro and with French language

<link rel="alternate" href="http://some-ecom.com/fr" hreflang="fr-FR" />

// With Price tags in Euro and with German language

<link rel="alternate" href="http://some-ecom.com/de" hreflang="de-DE" />

So when user form these region search the search engines will display the link according to their location. Means for a user in France it will show a “http://some-ecom.com/fr” link and a user in Germany, it will show “http://some-ecom.com/de” link and as we have hreflang=”en” in the first example it will show “http://some-ecom.com” link for rest of the English speaking countries like US, India, etc…

Where to put Hreflang?

The Hreflang can be placed on sitemap, on HTTP header or on-page markup. The Hfrelang attribute should be present on each pages with all the language/locale instances. Specifying this hreflang atrribute on the page does not mean that the site is only visible to those locations, it will be available to rest of the world as well but on other places it will be shown with default language in our case it is English (en).

For language/country selectors or auto-redirecting homepages, you should add an annotation for the hreflang value “x-default” as well:

<link rel="alternate" href="http://ashishuideveloper.in” hreflang="en-default” />

Supported Language Codes

The Hreflang attribute identifies the ISO language codes. Google uses the ISO 639-1 Codes.

  • en – Specifies all the English spoken countries.
  • en-GB – Specifies English content for GB users.
  • de-DE – Specifies German content for German users.
  • de-ES – Specifies German content for Spanish users.

Read more on Google

Web/ UI & Front-end developer based in Ahmedabad, GJ, India. Here to help/ discuss community to spread web awareness.

Leave a reply:

Your email address will not be published.