HTML <link> hreflang attribute specifies the language of the linked resource. It helps search engines understand the language targeting of a document. Without the href attribute, there is no use of this attribute in the link element.
HTML link hreflang Attribute Syntax:
<link hreflang="langauge_code">
HTML link hreflang Attribute Values:
- It contains the language code which specifies the language code for the linked document. A language code is a two-letter code.
HTML link hreflang attribute Example:
This example illustrates the use of hreflang attribute in link Element.
<!DOCTYPE html>
<html>
<head>
<title>
HTML link hreflang Attribute
</title>
<link rel="stylesheet" type="text/css"
href="styles.css" hreflang="en-us">
</head>
<body style="text-align:center;">
<h1>GeeksgorGeeks</h1>
<h2>
HTML link hreflang Attribute
</h2>
</body>
</html>
Output:
Explanation
- In this example we includes a link tag with the hreflang attribute set to "en-us" for language targeting.
- This link connects to an external stylesheet named styles.css.
- The content is styled centrally using inline CSS with the style attribute set to "text-align:center;".
HTML link hreflang Attribute Use-Cases
1. How to set the language of text in the linked document in HTML5 ?
In HTML5, set the language of text in the linked document using the hreflang attribute within the <link> tag, specifying the language code.
2. How to Fix Hreflang Tag Errors with Google Search Console?
To fix hreflang tag errors in Google Search Console, ensure proper implementation by accurately specifying language and regional variations for each page. Review and correct any identified errors.
Supported Browsers: HTML link hreflang Attribute supported browsers are listed below.
- Google Chrome 1 and above
- Edge 12 and above
- Internet Explorer 6 and above
- Firefox 1 and above
- Apple Safari 4 and above
- Opera 12.1 and above