3.1.6 Pronunciation

Level: AAA | Principle: Understandable | Since: WCAG 2.0 | Automation: Manual

What This Means

A mechanism must be available to identify the specific pronunciation of words where the meaning is ambiguous without knowing the pronunciation. This primarily applies to homographs — words that are spelled the same but have different meanings depending on how they are pronounced.

For example, "lead" can mean to guide someone (rhymes with "feed") or a metal (rhymes with "bed"). "Read" can be present tense (rhymes with "feed") or past tense (rhymes with "bed"). "bass" can be a low sound (rhymes with "face") or a fish (rhymes with "class"). Without pronunciation guidance, screen readers may choose the wrong pronunciation, and users who lip-read or rely on text-to-speech may misunderstand the content.

The mechanism can be inline phonetic spelling, a pronunciation guide, ruby annotations (common in CJK languages), or links to audio pronunciation.

Who This Affects

Screen reader users — text-to-speech may choose the wrong pronunciation for ambiguous words
Users learning to read — homographs are confusing without pronunciation clues
Non-native speakers — may not know which pronunciation applies in context
Users with reading disabilities — ambiguous pronunciation adds cognitive load

Common Pitfalls

1. Ambiguous homographs with no pronunciation hint

<!-- Bad: "lead" is ambiguous — does the screen reader say "leed" or "led"? -->
<p>The team will lead the project using lead-free materials.</p>

<!-- Good: pronunciation provided for clarity -->
<p>
  The team will <span aria-label="leed">lead</span> the project using
  <span aria-label="led">lead</span>-free materials.
</p>

2. Technical terms with unexpected pronunciation

<!-- Bad: no pronunciation guide -->
<p>The <span lang="la">veni, vidi, vici</span> approach to project management.</p>

<!-- Good: pronunciation guide provided -->
<p>
  The <span lang="la">veni, vidi, vici</span>
  <span class="pronunciation">(WAY-nee, WEE-dee, WEE-kee)</span>
  approach to project management.
</p>

3. Names that could be mispronounced

<!-- Good: Ruby annotations for CJK characters -->
<ruby>
  漢字<rp>(</rp><rt>かんじ</rt><rp>)</rp>
</ruby>

<!-- Good: pronunciation key for non-obvious names -->
<p>Contact <span aria-label="shuh-VAHN">Siobhan</span> for details.</p>

How to Test

Read through the page and identify any homographs or words with ambiguous pronunciation (e.g., "lead," "read," "bass," "wind").
Check if pronunciation guidance is provided: phonetic spelling in parentheses, aria-label with correct pronunciation, ruby annotations for CJK characters, or links to audio pronunciation.
Test with a screen reader and listen for ambiguous words being mispronounced.
Check foreign-language phrases for pronunciation aids (phonetic guides, audio clips).
Pass: Every word with ambiguous pronunciation has a pronunciation mechanism (phonetic spelling, aria-label, ruby text, or audio link).
Fail: Any homograph or ambiguous word lacks pronunciation guidance, potentially causing screen reader mispronunciation.

How to Fix

Identify all homographs and words with ambiguous pronunciation in the content
Add phonetic pronunciation in parentheses after the first use of each ambiguous word
Use aria-label to provide correct pronunciation hints for screen readers
For CJK content, use <ruby> and <rt> elements to provide pronunciation annotations
Consider linking to audio clips of correct pronunciation for specialized or foreign terms