3.1.4 Abbreviations

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

What This Means

A mechanism must be available for identifying the expanded form or meaning of abbreviations. When your content uses abbreviations, acronyms, or initialisms, users must have a way to find out what they stand for.

Not everyone knows that "WCAG" means "Web Content Accessibility Guidelines" or that "a11y" means "accessibility." Abbreviations that are obvious within one field may be completely opaque to users outside that domain. This is especially challenging for screen reader users, who hear the abbreviation read aloud and may not recognize it.

The mechanism can be the <abbr> HTML element with a title attribute, an expansion on first use, a glossary, or a combination of these approaches.

Who This Affects

  1. Users with cognitive disabilities — abbreviations add to the cognitive load of reading
  2. Non-native speakers — abbreviations are language-specific and hard to look up
  3. Screen reader users — hear abbreviations spoken as words or spelled out, may not recognize them
  4. Users new to a topic — domain-specific abbreviations are meaningless without context

Common Pitfalls

1. Abbreviations used without expansion

<!-- Bad: abbreviation with no expansion -->
<p>This site conforms to WCAG 2.2 Level AA.</p>

<!-- Good: abbreviation expanded with <abbr> tag -->
<p>This site conforms to <abbr title="Web Content Accessibility Guidelines">WCAG</abbr> 2.2 Level AA.</p>

2. First use not expanded in text

<!-- Bad: no expansion at all -->
<p>The CMS supports SSR and SSG deployment modes.</p>

<!-- Good: expanded on first use, abbreviated thereafter -->
<p>
  The Content Management System (CMS) supports
  Server-Side Rendering (<abbr title="Server-Side Rendering">SSR</abbr>) and
  Static Site Generation (<abbr title="Static Site Generation">SSG</abbr>) deployment modes.
</p>

3. Relying only on the title attribute

<!-- Acceptable but limited: title tooltip only shows on hover, not accessible to all -->
<p>Submit your <abbr title="Request for Proposal">RFP</abbr> by Friday.</p>

<!-- Better: expand in text AND use abbr for subsequent uses -->
<p>Submit your Request for Proposal (RFP) by Friday.</p>
<p>The <abbr title="Request for Proposal">RFP</abbr> must include a budget estimate.</p>

How to Test

  1. Read through the page content and identify all abbreviations, acronyms, and initialisms.
  2. Check that each abbreviation is expanded on first use in the text (e.g., "Web Content Accessibility Guidelines (WCAG)").
  3. For subsequent uses, verify the <abbr> element is used with an accurate title attribute containing the expansion.
  4. If the site has a glossary, check that abbreviations are listed with their full expansions.
  5. Test with a screen reader to hear how abbreviations are announced and whether the expansion is accessible.
  6. Pass: Every abbreviation is expanded on first use and subsequent uses have <abbr> elements with correct title attributes.
  7. Fail: Any abbreviation appears without expansion, lacks an <abbr> element, or has an incorrect title attribute.

How to Fix

  1. Expand every abbreviation on its first use on each page: "Web Content Accessibility Guidelines (WCAG)"
  2. Use the <abbr> element with a title attribute for subsequent uses
  3. Add a glossary of abbreviations for reference, especially on technical or regulatory content
  4. For frequently used abbreviations, consider expanding them on each page's first occurrence
  5. Review all content for abbreviations that may not be universally understood

Resources

  1. WCAG Understanding 3.1.4
  2. How to Meet 3.1.4