Identify the Language of Specific Text Passages

Disabilities Affected: Visual

Success Criterion: 3.1.2

Level: AA

The human language of specific passages or phrases in the content must be programmatically determinable if it differs from the default language of the page.

Why It Matters

Just as the primary page language needs identification (WCAG 3.1.1), sections of text in a different language also need to be identified. This allows screen readers to switch pronunciation rules for that specific section, ensuring foreign words or phrases are read correctly rather than being mispronounced using the default language’s rules.

Fixing the Issue

Use the lang attribute on the specific HTML element (like <span>, <p>, <blockquote>, <li>) that contains content in a different language. Set the lang attribute’s value to the appropriate ISO language code for that content.

Good Code Example

Identifying a French phrase within an English page:

Markup

<!DOCTYPE html>
<html lang="en"> <head>
  <meta charset="UTF-8">
  <title>Page with Multiple Languages</title>
</head>
<body>
  <p>Welcome to our website!</p>
  <p>As the French say, <span lang="fr">"C'est la vie"</span>. That's life!</p>
  <blockquote lang="es"> "El conocimiento es poder."
  </blockquote>
  <p>Which means "Knowledge is power."</p>
</body>
</html>

Bad Code Example

Foreign language text is not identified with the lang attribute:

Markup

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Page with Unidentified Language Parts</title>
</head>
<body>
  <p>He had a certain <span class="italic">je ne sais quoi</span>.</p>
  </body>
</html>

Search Ultimate Guide

Free eBook

Integrating Accessibility Compliance Into Your Budget

A Practical Guide for Healthcare Leaders Navigating the New HHS Ruling

Learn More

Need Help with Compliance?

Our team is here to guide you through the process of meeting accessibility standards. Contact us today to get started.

Schedule Consult