3.1.4 Abbreviations
What¶
Introduction¶
Abbreviations on a web page must be clearly described to ensure that all users can understand their meaning. This can be achieved in the following ways:
- Expand the abbreviation the first time it appears on a page.
- Use markup such as the
<abbr>
element to provide a tooltip with the full term. - Provide a glossary or an accessible description elsewhere on the page.
This ensures that users who are unfamiliar with the abbreviation can fully comprehend the content.
Why¶
Why is this important?¶
Some users may not recognize abbreviations. This applies especially to the following:
- Users with cognitive disabilities: Who may struggle with shortened words.
- Screen reader users: Who use assistive technology, which may not be able to automatically expand or pronounce abbreviations correctly.
- New visitors to your website: Who may not be familiar with internal terminology or industry-specific acronyms.
For example, all users might not understand that WCAG refers to Web Content Accessibility Guidelines unless it is expanded or described.
Examples¶
This section provides some pass and fail examples of this check.
Pass examples¶
Expanded abbreviation on first use
Implementation:
<p>The Web Content Accessibility Guidelines (WCAG) define accessibility standards for digital content.</p>
<p>According to WCAG 2.1, websites must be perceivable, operable, understandable, and robust.</p>
- Why this works:
- The full term is provided before the abbreviation is used later in the text.
Use of the <abbr>
element
Implementation:
<p>The <abbr title="World Health Organization">WHO</abbr> is a global health organization.</p>
- Why this works:
- When users hover over the WHO, a tooltip shows the expanded text.
- Screen readers can announce the full term when they read the abbreviation.
Provide a glossary of abbreviations
Implementation:
<h2>Glossary</h2>
<ul>
<li><strong>SEO</strong>: Search Engine Optimization</li>
<li><strong>UX</strong>: User Experience</li>
</ul>
- Why this works:
- Users can refer to the glossary for clarification.
Fail examples¶
How¶
This section provides instructions on how to review and fix this issue.
How to review it¶
- Identify capitalized words that may be abbreviations.
- Check if they are defined or expanded when they are used for the first time.
- Ensure that the proper markup is used, such as:
- The
<abbr>
element for tooltip descriptions. - A glossary section is provided for commonly-used terms.
- Test with assistive technologies to confirm that screen readers can correctly interpret the abbreviations.
How to fix it¶
Additional resources¶
WCAG criteria¶
3.1.4 Abbreviations