Add Language Declarations For Multilingual Pages

This post originally appeared on the Yahoo! Accessibility Blog.

In an increasingly global Internet web sites must be built for a diverse audience of users who may speak one or more languages. This includes establishing the base language for the page and changing the language for foreign words within the content. In making your pages language-aware you not only please your users, particularly those using screen reading software, but also search engines.
Luckily adding language awareness to your pages is fairly easy to handle. The first thing is to add a language declaration to your site.

Sample code for assigning the document's language


<html lang="en-US">

The language is defined with a series of characters, divide by hyphens. "en" means it is English. "-US" tells us this is American English. "en-GB" would be for Great Britain and "en-CA" is for Canadian English.

Defining foreign languages in a page

The following is a list of the word Potato in different languages. Each item will have the appropriate lang="foo-bar" attribute.

Sample code for defining language on subsections of a site

<dl >
<dt>U.S. English </dt>
<dd>Potato </dd>
<dt>British English</dt>
<dd lang="en-GB">Potato</dd>
<dt>German</dt>
<dd lang="de-DE">Kartoffel</dd>
<dt>French (France)</dt>
<dd lang="fr-fr">pommes de terre</dd>
<dt>Spanish (Spain)</dt>
<dd lang="es-ES">apa</dd>
<dt>Italian</dt>
<dd lang="it-IT">di patate</dd>
</dl>

A list of potatoes with different languages

U.S. English

Potato

British English

Potato

German

Kartoffel

French (France)

pommes de terre

Spanish (Spain)

papa

Italian

di patate

Listen: You should notice the voice change its inflection and pronunciation for the various languages. JAWS announces various translations of "potato" with correct language declaration

Missing language attributes

The following list is missing the language attributes. This will help you notice the difference it makes.

U.S. English

Potato

British English

Potato

German

Kartoffel

French (France)

pommes de terre

Spanish (Spain)

papa

Italian

di patate

Listen: You should notice the voice does not change and treats the words as if they were English. JAWS announces various translations of "potato" that do not have language declarations