| abi_ | |
| Sep 22 2020, 2:16 PM |
| F32369907: graph.jpg | |
| Oct 1 2020, 11:18 AM |
| F32369909: tableTNW.jpg | |
| Oct 1 2020, 11:18 AM |
| F32361702: image.png | |
| Sep 24 2020, 7:13 AM |
| F32361757: image.png | |
| Sep 24 2020, 7:13 AM |
Screen readers will not be able to read the canvas element that is created by Chart.js.
To improve the situation, we can,
References:
Translation statistics graphs are accessible with a screen reader.
| Subject | Repo | Branch | Lines +/- | |
|---|---|---|---|---|
| Add table and aria-label for the translation stats graph | mediawiki/extensions/Translate | master | +136 -17 |
| Status | Subtype | Assigned | Task | ||
|---|---|---|---|---|---|
| Resolved | Nikerabbit | T263004 Enable Special:TranslationStats on Wikimedia production | |||
| Resolved | abi_ | T134634 Replace phplot graphs with JavaScript library solution | |||
| Resolved | abi_ | T263543 Improve accessibility for the Translation statistics |
Change 629530 had a related patch set uploaded (by Abijeet Patro; owner: Abijeet Patro):
[mediawiki/extensions/Translate@master] Add table and aria-label for the translation stats graph
Submitted a patch to:
Screenshots:
Change 629530 merged by jenkins-bot:
[mediawiki/extensions/Translate@master] Add table and aria-label for the translation stats graph
@Jpita Have you done any testing with screen readers? Is this something you can do? I've done rudimentary testing using NVDA+Firefox on Windows.
I didn't but I can try.
@Jrbranaa do we have any accessibility ninja in our QTE team?
This has been deployed to translatewiki.net. Will be available on WMF production with next week's train.
A few examples:
Is this what's supposed to show?
(the text inside the grey box is the text spoken out loud by the voice over software on mac)
I like how the table only shows when the graph is selected
@Jpita, Yes, that is the expected behavior. I would check to ensure that the text spoken by the voice assistant conveys the data in the graph / table accurately.
The data in the graph cannot be read because its in a canvas, but I was expecting it to read out the table. I'll check with Niklas, who tested it with NVDA on Windows.
NVDA reads the whole table by default, but there are some shortcuts which allow navigating through the table cells like using arrow keys.
Maybe there is some shortcut that is needed in your system to read the contents of the table?
I'm sure there must be but it's the first time I'm using this so no idea how to do that.
I'll try a few more things but since you're able to do it with that software I think we're good.