Accessibility issues (expand/collapse icon, navigating through table cells)
Accessibility issues (expand/collapse icon, navigating through table cells)
Hi all,
We are doing some testing of DataTables with JAWS (v 16). We are experiencing two issues:
1) The green expand/collapse icon (like on the table on the DataTables homepage is not being seen by our screen reader. It is being skipped over. So, sight-impaired visitors will not know they can expand the row and will miss content. Has anyone encountered similar? Are there fixes?
2) Once our tester entered a table using the "tab" key she had difficulty moving through table cells with the arrow keys (the expected behavior). Instead, she needed to first press “Enter” and then was able to use the arrow keys. Apparently this isn’t typical behavior for tables and could confuse sight-impaired users. This issue only occurred in fully featured tables with the search box and pager.
I appreciate any help. Sorry, I can't send links, our examples are on our testing server. And thanks to everyone at DataTables for this terrific and truly versatile solution to tables.
Best,
Ben
Answers
I should add that our tester also tested the example tables on DataTables and had the same result, so might not matter about sending links to the actual tables on our testing server.
1) Yes, this is an issue with the default design for Responsive without question. It uses a pseudo element to show the icon, so while a keyboard user can use tab to go through and activate the options, the screenreader wouldn't see it.
For full screenreader support you would need to use a control column with
defaultContent
set to be "Show / hide details" for example.The other alternative is not to use the Responsive extension.
2) What browser were you using for that please?
Allan
Hi Allan,
Thanks so much for the reply, the control column solution seems like a good one. Will try that one out -- we hadn't seen that option, so very glad it's available.
For #2, we tested with JAWS (v.16) using IE 11 (we are in government, and this is default browser for the agency). I'll ask our tester to try different browsers and see if we have same result.
Thanks,
Ben