DEV 1.9 – Specify the default language of the page and any language changes
Why is this important?
Browsers and assistive technology can reference metadata to communicate information about a page's contents. This helps users to more effectively navigate and understand the contents of the page, especially when using assistive technology.
Specifying the language of a page, and any change of language, will allow screen readers to correctly pronounce any language changes that occur in the content.
Identify the primary language of the page
Use the lang attribute on the <html> tag to specify the default language of the page – choose a specification from the ISO language codes to ensure it is recognised correctly.
Indicate any changes in language
If any text on a page is in a different language to the one specified on the <html> tag, you must indicate that so that screen readers know how to pronounce it;
Specifying a page’s language, or a momentary change in the language on the page, relies on providing a container element (span or div) around just the changed language text, and setting the lang attribute on that element.
Specifying languages in Word documents
- Select the text you want to specify a language for (select all of the content if you want to set the language for an entire Word document);
- On the “Review” ribbon, the “Language” option will provide a list of languages from which you can choose the appropriate one.
Specifying languages in PowerPoint documents
- Select the shapes you want to specify a language for;
- Under the “Tools” menu, the “Language” option will provide a list of languages from which you can choose the appropriate one.
An example of good practice
“Aujourd’hui”, the French word for “today”, in Word, with the correct language selected:
An example of bad practice
“Aujourd’hui”, the French word for “today”, in Word, with the language still set to English (UK):
Correct code examples
Setting the primary language of a page.
Specifying a temporary change in language:
<p>How do you say "today" in French?</p>
<p>You say <span lang="fr">Bonjour</span></p>
<p>And in German?</p>
<p lang="de">Guten tag </p>
<p lang="ga"><a href="irish-version.html">as gaeilge</a></p>
EN 301 549 v 2.1.2
- 220.127.116.11 Language of Page
- 18.104.22.168 Language of Parts