Foreign-language passages and the ADA

When one page speaks more than one language

A page can be mostly English and still contain a Spanish notice, a Vietnamese greeting or a quoted legal phrase. Assistive technology that reads the whole page in English will garble those parts. WCAG 2.1 success criterion 3.1.2 (Level AA) asks that the human language of each passage or phrase can be programmatically determined, which in HTML means a lang attribute on the element that wraps the foreign text.

What you do not have to mark

The criterion carves out four exceptions:

• Proper names, such as a person or a brand.
• Technical terms, such as "hertz" or "habeas corpus".
• Words of indeterminate language, where the language cannot be identified.
• Words that have become part of the vernacular of the surrounding text, such as "rendezvous" in English.

So you mark passages and phrases that are clearly in another language, not every borrowed word. If you are unsure whether a term has been absorbed, ask whether an English-speaking reader would pronounce it as English.

Where it matters on public sites (ADA angle)

Language-access notices are a staple of government pages: a "Se habla español" line on a clinic page, interpreter-availability banners, translated emergency notices, and a language chooser in the header. The chooser is a frequent weak spot, because the language names are written in their own language but not marked up. A person who relies on a screen reader and needs those services is the one least able to skip over garbled speech. For site-wide patterns, see common barriers.

Code examples: notices, language chooser, quotes, right-to-left

Interpreter notice on a county clinic page

<p>Interpreters are available. Se habla español.</p>

<p>Interpreters are available. <span lang="es">Se habla español.</span></p>

Language chooser in the header

<nav aria-label="Language">
  <a href="/es/">Español</a>
  <a href="/vi/">Tiếng Việt</a>
  <a href="/zh/">中文</a>
</nav>

<nav aria-label="Language">
  <a href="/es/" lang="es" hreflang="es">Español</a>
  <a href="/vi/" lang="vi" hreflang="vi">Tiếng Việt</a>
  <a href="/zh/" lang="zh-Hans" hreflang="zh-Hans">中文</a>
</nav>

Welcome sign quoted in the library page

<blockquote>
  Chào mừng đến thư viện. Chúng tôi mở cửa từ 9 giờ sáng.
</blockquote>

<blockquote lang="vi">
  Chào mừng đến thư viện. Chúng tôi mở cửa từ 9 giờ sáng.
</blockquote>

Arabic passage in a school enrollment notice

<p>مرحباً بكم في التسجيل المدرسي</p>

<p lang="ar" dir="rtl">مرحباً بكم في التسجيل المدرسي</p>

Native apps

Native platforms attach language to spans of text through their own accessibility APIs; those are not covered by the web examples above. As a design rule, keep foreign-language passages in short, separate text elements so they can be tagged individually.

Testing it

1. Scan the page by reading it and note every passage or phrase that is in another language, including menu labels.
2. Inspect those elements and look for a lang attribute with the right code.
3. Listen with a screen reader that supports automatic language switching and check that the voice changes for the marked passage.
4. Tools: scripts can list elements with lang and flag invalid codes. No tool reliably detects unmarked foreign text, so human reading is the main check.

Slips to avoid

• Setting the page language to the foreign language to "fix" one passage.
• Wrapping a whole paragraph in lang when only one phrase is foreign.
• Writing lang="spanish" or lang="sp". The code for Spanish is es.
• Marking up proper names or technical terms that do not need it, creating noise for little benefit.

Ship it when

• Every full passage or phrase in another language is wrapped with a valid lang.
• The language chooser labels carry their own language codes.
• Best practice: right-to-left passages also carry dir="rtl".

Sources

• Understanding SC 3.1.2: Language of Parts (W3C), opens in a new tab
• 28 CFR Part 35, Subpart H: Accessibility of Web Information and Services (eCFR), opens in a new tab

Standard version: WCAG 2.1 (W3C Recommendation, 5 June 2018), as named in the Title II web rule. This page is for informational purposes only and is not legal advice. For binding requirements, refer to the official ADA statute and regulations, and ask a lawyer how they apply to you.