Skip to content

Support Matrix a11y tool

Peter Krautzberger edited this page Jun 10, 2016 · 124 revisions

Features for screenreader users

Support

Browser support

All latest browsers are support, i.e., IE11, Edge, Firefox, Chrome, Safari.

MathJax output options

The explorer works with MathJax's CommonHTML, SVG, and HTML-CSS output.

Screenreader support (see test results below for details).

  • NVDA
  • JAWS
  • WindowEyes
  • ChromeVox
  • VoiceOver
  • ORCA
  • Dolphin

Using the explorer

The application for keyboard navigation allows users to explore sub-expressions simultaneously visually and aurally. The application uses the following keys bindings:

  • SHIFT+SPACE: start application (requires focus)
    • NOTE: Depending on the implementation quality of the particular browser/screenreader/OS combination (especially Chrome and IE), users might have to disable screenreader reading modes (e.g., "browse mode" in NVDA, "virtual cursor" in JAWS) before being able to launch the application.
  • ESC: stop application.
    • NOTE: When restarted, the application will continue where the user left off.
  • UP/DOWN: move up or down the sub-expression tree.
    • When moving down, navigation will start at the left-most sub-expression of the level.
    • The application plays an aural indicator (earcon) if the user is at the bottom/top level of the tree.
  • LEFT/RIGHT: navigate the current level in the sub-expression tree horizontally.
  • ENTER: switch collapsed state of the current sub-expression and regenerate speech-text to match (e.g., provide summary upon collapsing).
  • SPACE: get positional information, i.e., the current level in the sub-expression tree as well as collapsibility/expandability of the current subexpression.

Notes on browse vs focus mode (and equivalent

Most screenreaders have two modes for interaction: browse (or virtual) and focus (or forms) mode. For more information see Leonie Watson's excellent overview.

Since some browser+screenreader combinations do not detect applications correctly, you might have to manually switch to focus mode, e.g.,

  • NVDA (Browse/Focus Mode) is switched via NVDAkey+space (default: INS or CapsLock). If MathJax's SVG output is used, NVDA might switch to Focus Mode automatically (in particular on older Windows Versions).
  • Window Eyes (Browse/Focus Mode) is switched via ctrl+shift+a
  • JAWS ("Virtual PC Cursor") is switched via JAWS+z (default: INS)
  • VoiceOver has no modes but shift+ctrl+cmd+KEY will trigger direct input
  • ChromeVox requires no extra switching
  • ORCA: ORCA+A (default: INS)

Other useful tricks.

JAWS has a feature Move to (Previous) Clickable Element which should allow users to jump (back) to the math just read out by browse/virtual mode and start the walker. However, it often does not detect clickable elements (i.e., the MathJax menu) and does not have a feature for to move to previous application).

Results.

The table below summarizes the results from testing and user reports.

Some notes on current bugs:

  • IE
    • currently, the a11y tool does not support IE<10.
  • Mobile
    • we do not yet support mobile browsers / touchscreen interfaces but have plans for it.
  • We have implemented an indicator to inform the user that the tool is present.
  • We have implemented an indicator to indicate when hitting an "edge" (both horizontally and vertically)
  • Regarding the "Usable?" numbers below: +1 means "minor bugs", 0 means "significant bugs but usable", -1 means "serious bugs, not usable"; DNA means "does not apply" (usually means AT does not support that browser/OS combination).
Screenreader Browser OS Usable? Bugs
ChromeVox Chrome any +1 notes: if navigating too quickly, ChromeVox might read "d i v" instead of the speech text (the aria live region is on a <div> ).
NVDA Firefox WinXP +1 no bugs
NVDA Firefox Win7 +1 no bugs, (not a bug: in browse mode reads "application clickable" before the aria-label on each expression; says "space" when space is used to display level/collapsible)
NVDA Firefox Win8.1 +1 no bugs
NVDA Firefox Win10 +1 no bugs
NVDA Chrome WinXP +1 [requires mode switching]
NVDA Chrome Win7 +1 [requires mode switching] (not a bug: in browse mode reads "application" before the aria-label on each expression)
NVDA Chrome Win8.1 +1 [requires mode switching]
NVDA Chrome Win10 +1 [requires mode switching]
NVDA MS Edge Win10 DNA [Edge issues prevent support by NVDA]
NVDA IE11 Win10 +1 [requires mode switching]
NVDA IE11 Win8.1 +1 no bugs
NVDA IE10 Win7 +1 no bugs
VoiceOver Safari OSX +1 Fences highlighting bug, https://github.com/zorkow/speech-rule-engine/issues/29
VoiceOver Chrome OSX +1 no bugs
VoiceOver Firefox OSX DNA FF not exposing live regions yet
Window Eyes (9.1) Firefox WinXP +1 voices dashes (plus-or-minus)
Window Eyes Firefox Win7 -1 ignores aria-hidden (thus speaks chars from visual rendering in addition to label); other: speaks some dashes (plus-or-minus), adds "application landmark ... end application landmark" to each expression
Window Eyes Firefox Win8.1 +1 voices dashes (plus-or-minus)
Window Eyes Firefox Win10 +1 voices dashes (plus-or-minus)
Window Eyes IE 10 Win7 +1 no bugs
Window Eyes IE 11 Win8.1 +1 voices dashes (plus-or-minus)
Window Eyes IE 11 Win10 +1 no bugs
Window Eyes MS Edge Win10 +1 no bugs
Window Eyes (9.1) Chrome WinXP -1
Window Eyes Chrome Win10 -1
Window Eyes Chrome Win8.1 -1
Window Eyes Chrome Win7 0 requires manual switch to focus mode to trigger walker; speaks "application landmark ... end applicatin landmark" around aria-label; in walker: makes "pling" at each key press;
JAWS Firefox WinXP +1 [reads raw MathML from AsssitiveMML when focusing on expression]; voices dashes (plus-or-minus)
JAWS FF Win7 +1 speaks dashes ("right dash paranthesis"), in browse mode adds "application" after each expression's aria-label, speaks "space" when space is used to display level/collapsible
JAWS Firefox Win10 +1 speaks some dashes (plus-or-minus)
JAWS Chrome WinXP +1 speaks some dashes (plus-or-minus)
JAWS Chrome Win7 +1 speaks some dashes (plus-or-minus); in browse mode adds "empty application" after each expression's aria-label, speaks "shift space" when activating walker, speaks "space" when in walker, sometimes speaks "blank" for each keypress in walker;
JAWS Chrome Win10 +1 voices dashes (plus-or-minus)
JAWS MS Edge Win10 DNA [Edge issues prevent MathML support by JAWS]
JAWS IE11 Win8.1 +1
JAWS IE11 Win10 +1
JAWS IE10 Win7 +1
JAWS FF Win8.1 +1
JAWS Chrome Win8.1 +1 "blank" precedes speech output; reads raw MathML from AsssitiveMML when focusing on expression
JAWS 13 Chrome Win7 +1 voices dashes (plus-or-minus)
JAWS 13 Firefox Win7 +1 voices dashes (plus-or-minus)
Orca Firefox Ubuntu 15.10 0 does not voice aria-labels and ignores aria-hidden (thus reading character in visual output; will sometime add "clickable" after those characters)
Orca Web Ubuntu 15.10 DNA [WebKitGTK not fully accessible]
Orca Chrome(ium) Ubuntu 15.10 DNA [Chrome not accessible]
Dolphin Screenreader IE11 Win10 -1 reads arial-labels; does not seem to support live regions, ignores aria-hidden (thus speaks characters in the visual output)

Demo

Videos

We have been creating short videos to demonstrate how the accessibility tool works on various combinations of browsers, operating system, and screenreaders.

The videos can be found at https://www.youtube.com/playlist?list=PL1ATLkPgTEBoIBkY6Ee9rdgAJaJtISOE8.

2016-06-09 Final a11y test

Checklist

  • check CommonHTML, SVG and HTML-CSS
  • check for loading and rendering errors
  • check auto-collapse (and thus collapse)
  • activate speech
  • test aria-labels being spoken
    • notable voicing artifacts? (application / landmark bla bla)
  • test walker
    • highlighting ok?
    • subtitles ok?
    • speech ok?
    • browse mode switch?

Targets:

Browsers:

  • IE11 Win8/10
  • Edge Win10
  • Firefox Win7/8/10, Linux, OSX, iOS
  • Chrome Win7/8/10, Linux, OSX, iOS
  • Safari 9.1 OSX, iOS

Screenreaders

  • NVDA 2016.2

  • JAWS 17

  • WindowEyes 9.4

  • VoiceOver OSX 10 / iOS 9

  • ChromeVox 50

  • ORCA 3.18.2

  • NVDA 2016.2

    • FF (Win XP/7/8/10)
      • in browse mode reads "application clickable" before the aria-label on each expression
      • says "space" when space is pressed in walker
      • I haven't found a way to get back into browse mode after exploring; this might be an NVDA bug or we screw this up unintentionally since the usual trigger to get out of automatic focus in NVDA is ESC.
    • Chrome (Win XP/7/8/10)
      • I usually have trouble refreshing the buffer -- otherwise the labels won't be present as they come in late. After a successful buffer refresh (NVDA+F5) I still have to do something extra, switching to another window and back usually works. Might be an NVDA bug.
      • in browse mode reads "application" before the aria-label on each expression
      • requires manual switch to focus mode
      • says "space" when space is pressed in walker
      • I often have trouble getting back into browse mode. In the best case, you just have to switch brows mode back on and then navigation will continue where you left off (not necessarily near the focued element, see UX notes below). Often I have to switch windows back and forth while cycling focus/browse mode.
    • IE11 (Win8/10)
      • in browse mode reads "application" before the aria-label on each expression
      • I haven't found a way to get back into browse mode after exploring -- see FF.
    • IE10 (Win7)
      • same as IE11
    • Edge (Win10)
      • Still broken.
      • NVDA reads "application" but then reads and navigates the characters in the visual output.
      • The walker can start and seems to work (subtitles etc) but NVDA reads the title instead of the live region.
  • JAWS 17

    • FF Win 7/8/10
    • Adds "... empty application" after each aria-label
    • detects application and turns on focus mode (turns Virtual PC Cursor off).
    • When leaving the application, you can't continue. But turning off/on virtual PC cursor (i.e., browse/focus mode) gets you back in the flow.
    • I sometimes can't access the tab order with JAWS (Win8)
    • Chrome Win 7/8/10
      • like NVDA+Chrome+Win7
        • adds "empty application" after expressions
    • IE10 Win 7
      • in browse mode, stops at equations, then needs two additional steps (of repetitions of the equation) to move passed it.
        • speaks "... application" on first and "...application and" third repetition.
      • reads some dashes (left dash paranthesis)
      • when focusing on equations, drops out of browse mode
        • does not read live-regions from walker
        • when leaving application cf FF (requires cycling browse/focus mode)
      • generally destabilizes IE for me. Maybe the VM is too underpowered.
    • IE 11 Win 8/10
      • in browse mode, JAWS's own math support hack for MathJax takes over.
        • unfortunately, JAWS's voicing cannot handle mactions (e.g., from collapse) and reads things like "black left pointing triangle..."
      • on focus on equation, does not switch out of browse mode
        • browse mode keeps its position even when focusing elsewhere; bad for continuing after exploration
      • walker
        • does not detect application, so requires manual switch to focus mode.
        • in walker, precedes everything with "blank"
        • when exiting walker and switching browse mode back on, it continues where browse mode left off (i.e., not necessarily where the focus was).
    • Edge Win 10
      • all is broken.
  • Window Eyes 9.4

    • FF Win 7/8/10
      • speaks aria-labels preceded by "application landmark ..."
        • then speaks chars from visual output
        • ends with "end application landmark"
      • enters walker without mode switching
        • walker works fine
        • voices some dashes
      • when leaving walker, needs one manual switch back into browse mode; will repeat current equation.
        • sometimes gets stuck on a focused expression.
        • sometimes cannot tab to elements (just cycles browser UI)
      • nice: browse mode moves focus along so you just shift+tab to the equation you just passed by in browse mode (not Win 8)
    • Chrome Win 7/8/10
      • adds "application landmark ... end application landmark" in browse mode; (does not speak characters from visual)
        • speaks some dashes
      • walker
        • does not enter focus mode when focus on equations so manual switch necessary
        • walker works well
        • after leaving requires manual switch to browse mode (of course)
        • continues ok: reads "end application landmark" and usually the text following the focused equations -- but sometimes jump in focus to a previous text segment.
          • often, it then starts to ignore all equations in browse-mode.
      • browse mode does not move focus along
    • IE11 Win 8/10
      • adds "application landmark ... end application landmark" in browse mode and speaks characters from visual.
        • speaks some dashes
      • browse mode moves focus along
      • walker
        • focus mode is turned on when equation in focus
        • walker works
        • on exit, requires manual switch to browse mode
        • reads "end application landmark" and usually the text following the focused equations -- but sometimes jump in focus to a previous text segment.
    • IE10 Win 7
      • does not speak labels
        • will jump too far ahead when passing an equation
      • walker
        • focus mode is not turned on when equation in focus
        • walker works
        • on exit, needs manual switch to browse mode (of course)
        • will continue at correct position
    • Edge Win 10
      • WE gives warning that Edge is not accessible.
      • browse mode not working on Edge
      • walker
        • labels are read when put in focus
        • exploration works
  • VoiceOver

    • Safari 9.1, OSX 10.10.5
      • in "read all page" mode (VO+A), reads "application 0 items" instead of aria-labels
      • in "readn next" reads aria-labels correctly -- prefixes "application"
        • if you stop on application, it will tell you to use "Control-Option-Shift-Down Arrow"
      • To start application, no need to switch modes -- just shift+space
        • but then don't use the above but use "pass keystrokes through", i.e Control+Shift+Command+KEY to navigate
        • After exiting with just ESC, then VO+RIGHT/LEFT will let you continue (i.e., browse mode)
    • Chrome, OSX 10.10.5
      • VO+A: reads labels but "application [label] 0 item"
        • sometimes stops at application
      • Interaction with application as smooth as Safari.
    • Firefox.
      • VO+A: skips equations
      • VO+left/right: skips equations
      • When focus on equation: reads label in both above modes
      • Does not speak live-regions.
    • Safari 9.1, iOS 9.1
      • read all (two finger swipe up): reads labels; wrapped in "math ... application landmark"
      • when swiping left/right to read through elements, it reads labels but jumps back in focus on the preceding element, making it a pain to navigate.
      • Maybe we should disable the walker/aria-role on mobile and generate full speech strings?
  • ChromeVox: everything is just very nice.

    • Would love to be able to test ChromeVox Next on ChromeOS.
  • Talkback:

    • Chrome/FF: labels seem to work in general but they both throw off navigate-by-swipe. Continuous reading (using shake) works.
    • But like iOS we lack UI to allow user switching.

Bugs

  • FF Win7 HTML-CSS: highlight does not cover integral (display block).
  • Switching speech rules changes walker speech but not aria-label
    • IE10: switching speech generation options seems to do anything, even on refresh
  • when you manually collapse an expression, start walker, expand then it, the walker stops/ drops out of the equation.
  • Menu on Safari 9.1.1 OSX 10.10.5: can't enter submenu with keys
  • IE10/11: P(u_0, u_1) subtitles how artifact between P and () (instead of "of", MathSpeak-verbose).
    • On IE11/Win10, JAWS turns this into function application. On Edge I see "of" in the subtitles.
  • JAWS often reads "generating speech output" at "top" of page, i.e., when in browse mode, go to top of document (key up). Before the first H1 (An example from Struik's) it will read "generating speech output".
  • Maybe other status messages?
  • Missing clean up?

UX

A key UX problem is to combine the browse mode experience with the walker.

User story:

A reader in browse mode expects labels but also wants to enter the walker every now and then. For this, they want to quickly find the expression they're interested in (e.g., when browse mode passes over it, they need a quick way to focus the equation) [tab or shift+tab often work].

After using the walker, a user wants to continue in browse mode.

nvda FF vs Chrome Win7:

  • nvda should automatically switch to focus mode (link, application) and then ESC should put it back into browse mode after the focused location.
  • FF Win7, this fails.
    • It might be due to MathJax-a11y using ESC to stop the walker?
  • Chrome Win7: NVDA does not detect browse mode on applications and tabbing does not seem to transfer reading position,
    • i.e., browse mode might be far down the page and focus on an early expression. Then you can leave browse mode, start the "early" equation, go back to browse mode and you'll be still down at the bottom of the page (where you were)
Clone this wiki locally