The files in this repository accompany the "Web Accessibility for Developers" course, and eBook, created by The Chang School of Continuing Education at Ryerson University, in Toronto, Canada.
Web Accessibility for Developers
There are 10 widgets included in this repository (plus one example widget), that are purposely inaccessible. As part of the course activities, participants learn about WAI-ARIA, and apply what they learn to fix the accessibility of these widgets.
Widgets include:
- Toggle Buttons (Example)
- Progressbar
- Accordion
- Carousel
- Tree Menu
- Navigation Menu
- Slider
- Tooltips
- Tab Panel
- AutoComplete Form
- Sortable List
To use these files, course participants (or anyone interested in creating accessible widgets) should:
- Fork this repository into their own GitHub account
- Rename the forked repository to [username].github.io in the repo's settings
- If you already have a GitHub Pages site, rename the repository to "learnaria" and enable it as a subdirectory under your existing site in the repo's settings.
- Test your GitHub Pages site by opening https://[username].github.io. (You may need to wait a few moments for the site to become available)
- For those with an existing GitHub Pages site, open https://[username].github.io/learnaria
- Take the course to learn how to apply WAI-ARIA to add accessibility to the widgets (or read the eBook).
- Apply the WAI-ARIA described for each of the widgets in the course, then commit those changes back to your forked repository.
- Test the widgets with ChromeVox (the screen reader used in the course) to ensure it functions as expected.
- Submit the URL to the widget in the course assignments for marking (in the course see the Rubric for marking details).
The Web Accessibility for Developers course is also be available as an ebook. Those who are unable to participate in the course, or those who would like a reference based on the course, you are encouraged to download the ebook and work through the exercises on their own.
.