Lesson 12Web accessibility tools to help in the design process
- Notion 84 - What is assistive technology and how can it help users with disabilities ?
- Notion 85 - Assistive technology for reading and hearing issues
- Notion 86 - Example of how assistive technology for reading issues is used : The Screen Reader Use Case
- Notion 87 - Assistive technology to help control the computer, navigate or type
- Notion 88 - Examples of how assistive technology for navigating and controlling computers are used
- Notion 89 - Review of the main concepts : evaluation
Notion 89
Review of the main concepts : evaluation
Target skills
Use self-evaluation to identify the missteps in web accessibility that may be encountered while using asstive technologies.
Exercise
Visit these web pages using keyboard only navigation and paying attention to all the details. Like Anthony or Alexia, use the TAB key and the arrow keys to move up, down, and sideways between items. On each webpage, find at least one aspect that allows for the proper functioning of assistive technology and one aspect that does not.
Wanderu.com https://www.wanderu.com/en-us/bus-tickets/us/
Piwnich.info https://www.piwnich.info
Bataclan.fr https://billetterie.bataclan.fr/uk/user/register
Transfermakt.us https://www.transfermarkt.us/
Resources
Refer to Grains 86 and 88 for insight on how keyboard navigation should function
Correction
Wanderu.com
- The main items of the page have keyboard focus.
- The navigation order follows the visual flow of the page and seems quite intuitive at the beginning.
- The drop-down menus are not accessible because they cannot be manipulated with the keyboard, they unfold only with the mouse cursor.
- The date picker is not accessible with keyboard navigation
Bataclan.fr
- The webpage is partially accessible with keyboard navigation
- The items on the page have no keyboard focus
- There is a character-based captcha at the end of the page, which makes the completion of the task impossible to the visually-impaired. The use of a traditional character-based captcha is indeed problematic for visually-impaired people who use screen readers (and as a consequence, keyboard navigation) which cannot process the image, thus preventing them from uncovering the information required by the form.
Piwnich.info
- There is a « Skip to content » button which allows the user to skip all the numerous items of the homepage to directly go to the articles. Providing a "skip to content" button allows users who need keyboard navigation to easily skip to the main content of the page with a simple link, without needing to go through headers, menus, and other repetitive elements that appear on every page. It makes the keyboard navigation way easier.
- There are too many items and animated banner, which can make the navigation very confusing
- Many items do not have keyboard focus
Transfermakt.us
- The cookies pop-up message is keyboard navigation accessible
- The rest of the website is not accessible with keyboard navigation for the tabbed items have no keyboard focus