The hreflang
attribute on an element specifies the language and country region of the element.
This value is purely advisory.
Elements that accept this attribute include <a>, <area>, and <link>.
An hreflang
attribute on an <a> tag.
This attribute specifies the link is a page in English.
Go to
<a hreflang="en" target="_blank"
href="https://microsoft.com/en-us/">Microsoft</a>.
For additional details see our HTML anchor hreflang Reference.
The hreflang
attribute specifies the language and country region of the linked resource.
Its value is for advisory purposes only.
The first two characters in the hreflang
value represents the language code, such as 'en'.
And, the last two characters in the hreflang
value represents the country code, such as 'US'.
For example, the hreflang
value of 'en-GB' specifies the English language in Great Britain.
<tagname href="URL" hreflang="language-code-country-code" />
Value | Description |
---|---|
language-code-country-code |
The first 2 characters represent the language code of the linked page or resource. The last 2 characters represent the country code (optional). |
The following elements accept the hreflang
attribute.
Elements | Description | |
---|---|---|
<a> | Specifies an anchor link -- see example above | |
<area> | Creates clickable area inside an image map. | |
<link> | Links an external source to the current page. |
An <area> tag with an hreflang attribute.
<img src="/img/html/computer-map.png"
alt="Computer"
usemap="#computermap">
<map name="computermap">
<area hreflang="en-US" shape="rect" alt="Monitor" coords="253,142,16,2"
href="https://www.google.com/search?q=monitor" target="_blank">
<area hreflang="en-US" shape="rect" alt="Keyboard" coords="262,218,0,156"
href="https://www.google.com/search?q=keyboard" target="_blank">
<area hreflang="en-US" shape="circle" alt="Mouse" coords="267,234,22"
href="https://www.google.com/search?q=mouse" target="_blank">
</map>
For additional details see our HTML area hreflang Reference.
A <link> tag with an hreflang attribute.
<link rel="preload" as="video" type="video/mp4"
href="/media/movie.mp4" hreflang="en" />
For additional details see our HTML link hreflang Reference.
Here is when hreflang
support started for each browser:
Chrome
|
1.0 | Sep 2008 |
Firefox
|
1.0 | Sep 2002 |
IE/Edge
|
1.0 | Aug 1995 |
Opera
|
1.0 | Jan 2006 |
Safari
|
1.0 | Jan 2003 |