accessibility issues #93
Description
High level review, testing with TalkBack, and Voice Control.
Button icons cause double announcement
In several places, buttons have text and an icon/image as children, and both are announced together, e.g.
Fetch button - announces "Fetch MY_DATA (V2 only)" twice because both the icon and text label have the same string.
Flash button - announces "Flash code to your Micro:bit" then "Flash" (icon description + text label).
Edit button - announces "Edit project" then "Edit" (icon description + text label).
Often the description is actually more helpful, so it might be worth moving the content up to the clickable container and using importantForAccessibility="no" on the children.
Missing alt text / context for micro:bit instructions
For pairing instructions, text often says e.g. "press reset 3 times" and then there's an animation of the micro:bit that gives the context that we mean "press reset ON THE ACTUAL PHYSICAL MICRO:BIT (not an onscreen button). These animations do not have alt text, so this context is lost to a TalkBack user.
Options:
- be more explicit for everyone, in the action text, e.g. "Press reset on the back of your micro:bit", OR
- be more explicit in the contentDescription (such as above), AND
- add alt text: "Pressing the reset button on back of the micro:bit"
Some alt text is helpful to understand what you are missing (since it's a large animation which many folk will partially see, and not know what they are missing).
"Works on V2 only"
There are images that say "works on V2 only" and don't have any alt text
[EDIT: should be fixed by cef8551]
Talkback focus on page/content changes
There are several places where the content/page changes, but the focus remains on the element you clicked, for example:
- In the pairing flow, "show another way" button takes you to the other page/replaces the content (I don't know which) but focus remains on "show another way" button which is a bit confusing.
- In "Fetch MY_DATA" the "After logging"/"During logging" are styled as a toggle, but present as 2 buttons. You activate one and the visual content changes but focus doesn't move to the new instructions. This UX is bound to be strange regardless, but a focus change would help.
External links, without warning
Various places have buttons or links that open in a new browser, without warning.
- Project Ideas Button (Home Screen)
- Find Out More (Fetch/MY_DATA Screen)
- Sidebar: About, Privacy & Cookies, Ts & Cs
Add ".. Double-tap to open in external browser" to the accessible label in each case. Consider giving buttons which act as links a roleDescription = "link"
Buttons labels not shown for Switch Control
When using Voice Control you can say "show labels" and it should give an overlay telling you what each clickable is called, so you can then say "tap xxx". This does not work (no clickables are detected), BUT you can get away with the automatic text matching - if you say "tap project ideas" or "tap fetch" it will do a partial match, click on where the text is, and this click event will end up going to the button that the text is in.
I think this is because custom 'buttons' are neither actual buttons, nor marked up with AccessibilityDelegate + contentDescription.
Text scaling
At larger system font sizes, some text gets cut off (e.g. "to remove a paired micro:bit..." message). Note that MakeCode breaks even worse (though they manage well with system zoom).
Dark mode
Dark mode is not respected, and the app is a mixture of white-on-dark and dark-on-white.
Can't access Help reference
Pairing screen says "Having problems? Try the help page" but no help page found in app using Talkback. Turns out it's accessible with a swipe on the home page, see #92