Description

The lang attribute is used to identify the language of the content on a web page, when it’s applied to the html element, or within a given section on a web page, when it’s applied to a div, span, a, or any other element that may contain content in a language that differs from that used on the rest of the page. Changing the language at a lower level in the document tree overrides the language code that’s set higher up, but only for the nested element to which the different language code is applied.

The intention of the lang attribute is to allow browsers (and other user agents) to adjust their displays. For example, if you use the q element, a browser should be able to identify the language in use and present the appropriate style of quotation marks. In practice, though, poor support for the q element sees few developers use it—instead, many hard-code quotation marks. This is something of a catch-22 situation.

The lang attribute is helpful to users of assistive technology such as screen readers that can adjust the pronunciation depending on the language used. For example, the word penchant, meaning “a strong and continued inclination,” is French in origin. When the screen reader JAWS encounters the word, it pronounces it similar to “pen-chunt,” but when the word is marked up as <span lang="fr">penchant</span>, JAWS reads it using the proper French pronunciation, “pon-shont.”

It may also be possible that marking up documents or sections of a document in this way benefits search engines that display results to users who have filtered their searches on the basis of language preferences. However, the way in which search engines actually deal with content marked up in this way is a secret they tend to keep to themselves. As such, the potential for this attribute to make content more search engine friendly should be considered little more than a lucky bonus.

Value

lang takes as its value approved International Standards Organisation (ISO) 2 letter language codes only (refer to the language codes reference for details).

Compatibility

As I mentioned in the description above, browsers don’t provide great support for the lang attribute, but it offers benefits that extend beyond the browser itself (including advantages for search and assistive technology). Language should be indicated for these reasons, as well as for the purpose of forwards compatibility.