Appendix C: Web Content Accessibility Guidelines and Accessible Rich Internet Applications guidelines to make digital content accessible for screen readers

WCAG Guideline ARIA Guideline Description
Perceivable (Guideline 1-4)
1.1 Text Alternatives aria-label, aria- labelledby, aria- describedby Provide text alternatives for non- text content. ARIA attributes like aria-label help associate labels with elements for screen reader users.
1.2 Time-based Media aria-live, aria- relevant Provide alternatives and controls for time-based media. ARIA live regions notify screen reader users of dynamically changing content.
1.3 Adaptable role="presentation," role="img," aria- hidden Ensure content can be presented in different ways. Use ARIA roles and attributes to convey semantic meaning and control what is presented to screen readers.
1.4 Distinguishable aria-labelledby, aria-describedby, role="img" Make content visually and auditorily distinguishable. Use ARIA attributes to associate labels with elements and provide context for screen reader users.
Operable (Guideline 5-8) aria-disabled, aria- haspopup, tabindex
2.1 Keyboard Accessible tabindex, focus management, aria- haspopup Ensure all functionality is operable via a keyboard. ARIA attributes help manage focus and indicate elements with pop-up menus or sub-levels.
2.2 Enough Time aria-live, aria- relevant, timeouts, focus control Provide users enough time to read and interact with content. ARIA live regions and timeout management assist in conveying timely information to screen reader users.
146
WCAG Guideline ARIA Guideline Description
2.3 Seizures and Physical Reactions N/A Avoid content that may cause seizures or physical discomfort. This guideline primarily pertains to visual content but can impact screen reader users indirectly.
2.4 Navigable tabindex, skip links, headings, ARIA landmarks Make navigation and operation predictable and consistent. Use semantic HTML elements, ARIA landmarks, and skip links for efficient screen reader navigation.
Understandable (Guideline 9-10) aria-label, aria- labelledby, role="alert"
3.1 Readable text alternatives, language attributes Make text content readable and understandable. Provide language information and ensure that screen reader users receive accurate and meaningful text alternatives.
3.2 Predictable role="alert," ARIA live, aria-relevant Make web pages appear and operate in predictable ways. Use ARIA live regions and relevant settings to notify screen reader users of dynamic content changes.
Robust (Guideline 11) role="presentation," role="img"
4.1 Compatible role="presentation," role="img" Maximize compatibility with current and future technologies. Use ARIA roles appropriately to enhance compatibility with assistive technologies like screen readers.

Note: Web Content Accessibility Guidelines (WCAG) and Accessible Rich Internet Applications (ARIA).

147