So you want English pounds?
Let's donate some money!
Recently, Iona and I had a somewhat frustrating experience while testing the donation page of a charity website. The page offered several donation options: £5, £10, £50, or an "Other" field for custom amounts. The design of the page was clear, and the options were easy to understand, which was great at first. Iona was keen to donate £10, so she tried to select that option.
Iona uses voice recognition software to navigate websites due to a hand disability, so she started by attempting the command, "Click Ten Pounds." Unfortunately, nothing happened. Undeterred, she tried again with "Click Link," hoping that the links would trigger a response and display numbers next to them, allowing her to select the correct option. But once again, nothing occurred. She repeated this with "Click Button," hoping it would have a similar effect, but still, there was no response.
Software malfunction?
At this point, Iona repeated these commands several times, just to rule out the possibility of the voice recognition software malfunctioning. However, there was no success. As a last resort, she switched to using the "Tab" key method, which is usually a reliable fallback. This method involves repeatedly saying the word "Tab," allowing the system to cycle through each clickable element on the page, highlighting them as it goes.
As you can imagine, this process is far from ideal. It's both tiring and slow. Iona can only speak at the rate that the voice recognition software can process, and if you’ve never witnessed this process, it can be hard to appreciate just how slow it is. If you want to get an idea of how it sounds, try saying "Tab" followed by "two three" in your head, repeatedly:
Tab (two three)
Tab (two three)
Tab (two three)
And so on. You get the idea—it’s a slow and cumbersome process!
Dig into the code
While Iona was working her way through the page using the "Tab" method, I decided to inspect the page’s code. This isn’t always an option, as sometimes the code is tangled up in layers of JavaScript that make it difficult to inspect, but in this case, I was able to take a quick look. What I found was interesting: although the button for the £10 donation was labeled simply as "£10," the ARIA (Accessible Rich Internet Applications) label actually read "10 ENGLISH Pounds."
I suggested to Iona that she try saying “Ten ENGLISH Pounds” instead, and sure enough, that did the trick. The correct value was selected, and she was able to continue filling out the rest of the donation form without further issue.
It is easy once you know!
This experience highlighted an important challenge for speech dictation software: it needs to match exactly what is written on the page, and if the ARIA label differs from the visible text, it can cause problems. In this case, Iona’s software was unable to find the phrase “Ten Pounds” because the ARIA label included the word "ENGLISH," which was not part of her command.
If the ARIA label had been correctly applied, the software would have recognised "Ten Pounds" as Iona had said it, and the process would have gone smoothly. Instead, due to this minor but significant oversight, Iona had to repeat the "Tab" command far more times than necessary. It’s a small issue in the grand scheme of things, but it highlights the importance of proper accessibility coding. Despite the fact that the form itself was otherwise well-coded, this one issue turned a simple task into a frustrating experience for Iona.
The good news is that this issue is easily fixable. As often happens in accessibility work, small changes can lead to big improvements, making the experience much smoother for users. This is what makes the work we do so rewarding.
If you’d like to discuss working with us to improve the accessibility of your website, do book a time.
Caption: A cartoon depicting a £10 note with the Union Flag behind it. The accompanying text reads: "Oh, you mean 10 ENGLISH pounds???"
