R I S K M O N I T O R

Loading

Intelligent Cybersecurity Check for vulnerabilities now

Ensuring HTML Documents Have a Language Attribute

Rule ID: html-has-lang
Ruleset: axe-core 4.10
User Impact: Serious
Guidelines: WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), Trusted Tester, EN 301 549


How to Fix the Problem

To comply with accessibility guidelines and improve usability for screen reader users, ensure that the <html> element of your document includes a lang attribute specifying the primary language of the content.

Basic Implementation

Add the lang attribute to the opening <html> tag. For example, if the primary language is English:

html
<html lang="en">
<!-- Head and body content -->
</html>

Specify Regional Dialects

For more precision, include regional codes:

  • American English: <html lang="en-US">

  • Canadian French: <html lang="fr-CA">

You can find a full list of standardized language and dialect codes online (e.g., ISO 639-1 and ISO 3166-1 alpha-2).

Handling Multilingual Content

When a document contains text in multiple languages, use the lang attribute on specific elements:

html
<p>Welcome <span lang="es">bienvenido</span> to our site.</p>

Text Direction for Right-to-Left (RTL) Languages

For languages written right-to-left, like Arabic or Hebrew, use the dir attribute:

html
<p lang="ar" dir="rtl">مرحبا بك</p>

For left-to-right languages (most languages), you may optionally specify:

html
<p lang="en" dir="ltr">Hello!</p>

Why it Matters

When screen reader users browse the web, they rely on the lang attribute to ensure correct pronunciation and intonation. If this attribute is missing, screen readers default to the user’s preset language, which can lead to incorrect pronunciation, confusion, and misunderstanding—particularly for multilingual users.

Screen readers use specific language libraries to pronounce words accurately. Without a specified language, the wrong library may be used, leading to unintelligible output (e.g., a Spanish sentence read with an English voice).

Correct use of the lang attribute helps:

  • Accurately pronounce content

  • Enhance comprehension for multilingual users

  • Support proper switching between languages mid-document


Rule Description

Every HTML document must include a valid lang attribute in the <html> element. The value must be a valid language code representing the document’s primary language. This enables assistive technologies, especially screen readers, to render content correctly for users who prefer languages other than the browser or system default.


The Algorithm (in simple terms)

The accessibility engine checks:

  1. Whether the <html> element exists.

  2. If it includes a lang attribute.

  3. Whether the attribute contains a valid language code.

If the lang attribute is missing or contains an invalid code, the rule fails.

Leave A Comment