WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Table of selectable records

for

From: Birkir R. Gunnarsson
Date: Sep 10, 2018 8:29AM

Does every cell in the table have functionality?
If so, you probably need keyboard interaction similar to the
Datepicker widget on this page:
https://dequeuniversity.com/resources/
(arrow keys up/down navigate to previous/next row, arrows left/right
navigate to previous/next cell, the table is essentially a single tab
stop).
Also look up grid examples in the ARIA Authoring Practices 1.1 spec.

If not, you can just code the column headers as buttons, indicate the
current sorting direction and make the first column into a series of
"select this row" checkboxes.
There's a sortable table example on the same page.



On 9/10/18, Isabel Holdsworth < <EMAIL REMOVED> > wrote:
> Hi all,
>
> One of our pages contains a lengthy sortable table, where each row
> represents an editable record from a database.
>
> Does anyone have an example of the best way of making such a table
> accessible?
>
> It looks visually like a spreadsheet. Should it behave like one from a
> keyboard perspective? Should it be possible to traverse the table
> using the arrow keys, and only have the Tab key move into and out of
> the table itself? Currently the records are clickable but can't
> receive focus, which isn't acceptable. But for each cell to be
> focusable using the Tab key would prohibit all but the most determined
> keyboard users from getting to the important content after the table.
>
> I think that's probably the way to go, plus possibly have a "Select
> row" button at the start of each row, but if there's a better way then
> this is the place to ask :-)
>
> Thanks as always, Isabel
> > > > >


--
Work hard. Have fun. Make history.