(Floe) Universal Subtitles accessibility review (January 2012)

Owned by Michelle D'Souza
Last updated: Apr 09, 2012 by James YoonVersion comment

Tests performed

  • Keyboard only input on Firefox 10.0 Mac OS
  • Keyboard only input on Chrome 16.0.912.77 Mac OS
  • Keyboard only input on IE 9 Windows 7
  • Keyboard only input on Safari 5.1.1 Mac OS
  • NVDA screen reader on IE 9 Windows 7
  • Magnified on Firefox 10.0 Mac OS
  • Magnified on Safari 5.1.1 Mac OS
  • User test with a blind user using Jaws

Recommendations

I suggest we make the following changes and then perform another accessibility review.

  1. Keyboard focus styling would make the website a lot more usable. Simply adding a CSS rule using the :focus pseudo-selector should do it.
  2. Using the tab key for subtitling makes it hard to navigate the page with the keyboard. Picking another key for starting and stopping the video (perhaps right arrow?) would help a lot.
  3. Providing a way to access the other elements on the subtitling page with the keyboard is essential. Once another key is picked for starting and stopping the video, tab could provide this access.
  4. Using html semantics where possible will make the page more understandable. Title hierarchy is a good place to start.
  5. Labels for form fields will provide screen reader users with more information about the field.
  6. We should look into the dialogs a little more - both keyboard and screen reader behaviour is not ideal.
  7. Having content above the page title can be confusing, we should look into alternatives to the top panel.
  8. Timing out when the user is inactive is not ideal. Anyone who takes some time to perform their task is likely not able to complete it. Perhaps an auto save could be added?

Detailed findings

  1. keyboard focus styling is missing in all browsers
  2. dialogs don't seem to be usable with the keyboard - tab seems to move focus to things beneath the dialog and it seems that the 'continue' button never gets focus
  3. there doesn't appear to be a way to have a subtitle start later then I originally set it using only the keyboard
  4. there doesn't appear to be a way for no subtitle to show at times of silence using only the keyboard
  5. there doesn't appear to be a way to edit the subtitles after I've added them using only the keyboard
  6. there is a keyboard trap in the video when using FF
  7. can't get focus into the video using the keyboard in Chrome and Safari
  8. title hierarchy is confusing
  9. having content above the page title is confusing
  10. NVDA does not read anything when I put focus on the video
  11. NVDA reads 'edit' when I put focus into the URL text box
  12. NVDA does not say anything when the search box is given focus
  13. NVDA says "Dialog this video is in. Subtitle info. Continue" when the create subtitle dialog is shown
  14. NVDA says "Dialog skip these videos. Continue." when the tutorial dialog is shown