WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Column headers are not navigable in grid


From: Jonathan Cohn
Date: Dec 16, 2017 3:30PM

Well, if you have the ability to sort by a column then there needs to be a keyboard accessible way of doing this. Either adding tab stops to the column headers and some way of speaking the sorted column or perhaps selection list to pick sort order and direction. I find implementations that have adjacent controls available to control sort order and items to be displayed can be clearer to understand.

Also, although non-keyboard users will depend heavily on tab keys, remember that blind individuals have functions to jump directly to your grid and navigate in any direction they prefer.

As I have not directly seen your implementation style at work, I was hoping that one of the regulars would answer your question.

Best wishes,

Jonathan Cohn

> On Dec 14, 2017, at 11:07 PM, Vemaarapu Venkatesh < <EMAIL REMOVED> > wrote:
> Hi all, Greetings!
> I have a data grid in my application and when user tabs to this grid focus
> lands on the second row directly. The first row as usual contains column
> headers and users can't navigate there with arrow keys but column headers
> are associated with remaining data cells accordingly. So from second row if
> user navigates with arrow keys screen readers announces associated column
> headers for the focused data cells. Will that impact someone if focus
> doesn't move to row with column headers?
> If this doesn't impact, the other concern is the app too have a sort icon
> for the name column header where users can sort the names in ascending and
> descending orders. As focus doesn't move to column headers unable to access
> that sort icon. I tried interacting with that using NVDA object navigation
> keys but surprisingly that sort icon seems to be accessible with mouse
> alone but not keyboard accessible. What can be the best approach to make
> this sort functionality accessible?
> Thanks,
> Venkatesh
> > > >