Using the HTML lang attribute
What do an American actor, a British sitcom character and an HTML attribute have in common? If you’ve ever watched Mary Poppins and winced at Dick Van Dyke’s attempt at an English accent, or found yourself laughing at Delboy Trotter trying to speak French in Only Fools and Horses, you may well guess the answer.
lang attribute is used to identify the language of text content on the web. This information helps search engines return language specific results, and it is also used by screen readers that switch language profiles to provide the correct accent and pronunciation.
To set the primary language for a document, you use the
lang attribute on the
<html lang="en"> ... </html>
lang attribute takes an ISO language code as its value. Typically this is a two letter code such as “en” for English, but it can also be an extended code such as “en-gb” for British English.
lang attribute must also be used to identify chunks of text in a language that is different from the document’s primary language. For example:
<html lang="en"> ... <body> <p>This page is written in English.</p> <p lang="fr">Sauf pour ce qui est écrit en mauvais français.</p> </body> </html>
lang attribute is forgotten surprisingly often, perhaps because it makes no apparent difference unless you use a screen reader or you are a search engine. If you’re in any doubt at all what a difference it makes though, listen to this screen reader demo!