Ensure lang Attributes Have Valid Values

Casandra Visser

Author

Yotam Flohr

Researcher

Ritvik Shrivastava

Expert

July 29, 2024

Disabilities affected: Blind Hearing

Standards: WCAG 2.2 Level AA

The language specified in an HTML document must be one of the valid languages to ensure text is pronounced correctly by screen readers.

Why It Matters

When setting up a screen reader, users need to select a default language. If the language of a webpage is not specified, the screen reader assumes it is the default language set by the user. This can become a problem for users who speak multiple languages and access websites in more than one language.

Fixing the Issue

Ensure that the language code specified in the lang attribute is a valid language code (e.g. <html lang=”en”> would set the language of the document to English).

Make sure you identify a language in the opening <html> element and spell the attribute correctly.

Good Code Example

Code example

<html lang="en">
document text
</html>

Copy

If you would like, you can even specify some dialects with codes such as “en-US” to signify American English or “fr-CA” for Canadian French. You can find a list of language and dialect codes on the internet.

If the language changes within a document, you can specify this as follows:

Code example

Text in one language text in another language Copy

If you are using a language that is written right to left, be sure to specify this using the dir attribute:

Code example

Arabic text here Copy

If you would like to specify that a language is written left to right, you can fill the value of the dir attribute with the value “ltr”.

Ensure that the language code specified in the <html lang=” “> is a valid and allowed language code.

To identify the primary language of the document as English in the opening <html> element, designate it with the two-letter code “en”.

Code example

<html lang="en"> Copy

Test Cases

For more examples, visit the W3C’s GitHub’s ATC Rules library.