You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Users need to know what columns in a table can be used to sort the table. That's why we have the aria-sort attribute.
This works very well when a sort is applied to the column (leaving aside the custom sort, which I have never really understood).
aria-sort="ascending" = sorted by this column in ascending order
aria-sort="descending" = table is sorted by this column in descending order
This is announced as expected.
But then there is aria-sort="none".
To my mind, aria-sort="none" means that the table can be sorted by that column, but it isn't currently. This is valuable information to someone using a screen reader.
Yet screen readers (including Jaws) treat aria-sort="none" the same as having no aria-sort attribute, .e. they say nothing about it when you navigate to the header cell.
You can sort by first name or last name by clicking the button in the column header.
You cannot sort by phone number.
When I navigate these headers with a screen reader, I'd expect to hear:
First name, sorted ascending
Last name (sortable, not sorted)
Phone number
But I do hear:
First name, sorted ascending
Last name
Phone number
Sure, if user navigates by the tab key they'll find the buttons and can figure it out from there, but they shouldn't have to.
We could put screen reader text in that cell that says "sortable", but that text will be announced every time a user navigates to a cell in that column, that's bad user experience. Different authors will use slightly different verbiage so it's not consistent either.
Maybe the issue isn't with the screen reader, maybe the browser does not expose the sort attribute in the accessibility tree unless it's active, but then this is a browser issue.
I'm happy to file or follow up on that if that's the case.
The text was updated successfully, but these errors were encountered:
Summary
Users need to know what columns in a table can be used to sort the table. That's why we have the aria-sort attribute.
This works very well when a sort is applied to the column (leaving aside the custom sort, which I have never really understood).
This is announced as expected.
But then there is aria-sort="none".
To my mind, aria-sort="none" means that the table can be sorted by that column, but it isn't currently. This is valuable information to someone using a screen reader.
Yet screen readers (including Jaws) treat aria-sort="none" the same as having no aria-sort attribute, .e. they say nothing about it when you navigate to the header cell.
Example
(note, this is just non-functional markup):
Imagine the following markup for a 3 column table
You can sort by first name or last name by clicking the button in the column header.
You cannot sort by phone number.
When I navigate these headers with a screen reader, I'd expect to hear:
But I do hear:
Sure, if user navigates by the tab key they'll find the buttons and can figure it out from there, but they shouldn't have to.
We could put screen reader text in that cell that says "sortable", but that text will be announced every time a user navigates to a cell in that column, that's bad user experience. Different authors will use slightly different verbiage so it's not consistent either.
Maybe the issue isn't with the screen reader, maybe the browser does not expose the sort attribute in the accessibility tree unless it's active, but then this is a browser issue.
I'm happy to file or follow up on that if that's the case.
The text was updated successfully, but these errors were encountered: