Summary list action links visually hidden text are read out without spaces in screen readers
See original GitHub issueWhat
This is a report from a screen reader user:
https://design-system.service.gov.uk/components/summary-list/
You use visually hidden text to give your links unique and descriptive names. Unfortunately, you often omit the space between the words. This can make the names harder to recognize when speech synthesizers mispronounce the combined word. For example:
“Open this summary listexample in a new window” “Changename” “Changedate of birth” “Changecontact information” “Changecontact details”
I believe that I missed this as audibly it sounds correct to me, but I imagine depending on how you have your screen reader configured, for example how fast you have words announced, it could make it hard to understand.
I’ve managed to reproduce this issue in NVDA + Firefox and used the ‘speech viewer’ tool to see what the user has found.
The user has also let us know that the following combinations have the same issue, which suggests that it’s an issue with most screen readers:
Orca 3.28.0 with Mozilla Firefox 70.0.1 on Ubuntu Mate 18.04 NVDA 2019.2.1 with Mozilla Firefox 70.0.1 on Microsoft Windows 10 NVDA with Google Chrome 78.0.39 on Microsoft Windows 10. JAWS 2019.1809.28 with Mozilla Firefox 70.0.1 on Microsoft Windows 10 JAWS 2019.1809.28 with Google Chrome 78.0.39 on Microsoft Windows 10.
Recommend that we consider testing with tools like ‘speech viewer’ in the future to help catch issues like this.
I tried a quick fix by adding
instead of a space character, and that seemed to resolve this issue, but we’d want to test this across screen readers.
I will also raise an issue in the design system website for the related issues there.
Who needs to know about this
Developers
Issue Analytics
- State:
- Created 4 years ago
- Comments:16 (12 by maintainers)
Top GitHub Comments
Had a chat with Ollie.
We’re going to try to make reduced test cases to raise bugs with the assistive technology vendors as the accessibility tree is correct, this process may also help us learn more about the underlying issues and also the vendors themselves may be able to give us advice if they’ve seen this sort of issue before.
Thanks for sending that over @ladine-cook, that was very useful.
It looks like again they were seeing this issue with JAWS (versions 18 and 19), although I’m not sure whether it was with Firefox or IE11.
I can reproduce the issue using the check your answers pattern example in AssistivLabs with JAWS 2021.2103.174 and Firefox or Chrome, but not with JAWS and IE11.
It’s a bit of a shame that nothing has moved on the issue we raised with JAWS https://github.com/FreedomScientific/VFO-standards-support/issues/372, I’ve leave a message on the issue to see if we can’t get this fixed upstream.