From semantic HTML to WAI-ARIA: a comprehensive technical training for truly accessible interfaces
Writing HTML code is straightforward. Writing accessible HTML is a different challenge. When elements, attributes, and components aren't used in the right way, the experience of people with disabilities suffers, often without the development teams being aware of it. With the proliferation of frameworks, libraries and interactive components, the risk of error is increasing. And WAI-ARIA, when applied incorrectly, can make problems worse rather than correct them.
This training provides a comprehensive tour of the web components (simple, form, or interactive), showing how each of them should be coded to comply with WCAG 2.2 standards as well as accessibility best practices, enabling compliance with regulations such as AODA, government standard SGQRI 008 3.0, or CAN/ASC - EN 301 549:2024.
Is it for you ?
Web integrators, web developers and designers with knowledge of HTML. Also recommended for accessibility specialists who support development teams.
Prerequisites
Basic knowledge of HTML is required to take full advantage of this training.
What You'll Walk Away With
- ✓ Code every web component in accordance with accessibility standards
- ✓ Use WAI-ARIA attributes wisely, and avoid their common pitfalls
- ✓ Evaluate the impact of your technological choices (frameworks, libraries) on accessibility
- ✓ Identify the right HTML elements to use based on the nature and function of each component
Training content
1 Technical foundations of accessibility
- Understand how the function and nature of HTML elements influence accessibility
- Recognize the role of semantic HTML in assistive technology interpreting content
- Identify CSS-related accessibility considerations, including content hidden from screen readers, properties that affect how elements are announced by assistive technologies, and the visual indication of keyboard focus.
- Assess the influence of technologies, frameworks, and component libraries on accessibility
2 WAI-ARIA: understanding and applying it well
- Understand the role of WAI-ARIA in the accessibility of web interfaces
- Demystify the most used ARIA attributes
- Know how assistive technologies interpret ARIA attributes
- Recognize common mistakes and pitfalls in using it
3 Development of the basic components
- Develop accessible images, links, buttons, lists, and tables
- Properly structure headings, sections and navigation mechanisms
- Develop components that respect the behaviors expected by users of assistive technologies and the HTML nature of the elements
4 Forms development
- Develop accessible input fields and multi-line fields
- Properly integrate labels, instructions, and input assistance
- Develop drop-down lists, radio buttons, and checkboxes that comply with best practices
- Manage field groups and relationships between form elements
- Integrate accessible error handling mechanisms
- Ensure forms are compatible with assistive technologies
5 Development of interactive components
- Develop accessible modal windows, drawers, tabs, and carousels
- Properly manage context switchings and keyboard focus
- Develop accessible loading mechanisms, notifications and tooltips
- Understand expected keyboard and screen reader behaviors
- Prevent common accessibility issues in interactive interfaces
6 Media and entertainment
- Know the accessibility requirements for videos, audio, and moving elements
- Identify the requirements for an accessible media player
- Set up appropriate subtitles, text transcripts and alternatives
- Develop mechanisms to control or interrupt animations
7 Modern Web Applications
- Understand the accessibility issues specific to single-page applications (SPAs)
- Manage dynamic content changes in an accessible way
- Ensure that focus is maintained during interface updates
- Adequately communicate state changes to assistive technologies
📌 Practical information
Our training sessions are offered in Montreal or Quebec City, in person or in a virtual classroom. Dates and locations are specified when you select your session below. If you have any questions, check out our FAQ.
