Identify Languages of HTML Documents

Majority of screen readers can read several different languages. During the installation process, users are able to select a default language for their screen reader. Users who speak only one language may only access web pages in their native language. Users who speak more than one language, though, will want to access websites in different languages. Naturally, users will want to hear the language read correctly. If HTML documents do not specify a primary language and language changes within the content, a screen reader will read the document in the user's default language setting, and possibly cause the user to hear improper pronunciation and wrong accents.

We can identify the primary language of the document in the opening html element. In the example below, the two-letter code "en" specifies English as the primary language of the document.

<html lang="en">

To specify language changes within the document, we can apply the lang attribute to inline elements as well as block elements. The example below shows the attribute being applied to a span element to indicate a language change.

<p>My friend isn't very good at speaking Spanish. While we were in Spain, everyone kept saying to her "<span lang="es">No comprendo nada de lo que dices.</span>"</p>

Lastly, we want to ensure that languages that are read right-to-left are read in that direction in the document. We can use the dir attribute within an element with the rtl value to render languages right to left.