WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Alternative Descriptions for Complex Tables

for

From: Birkir R. Gunnarsson
Date: Jan 12, 2017 2:48PM

You can make fairly complex tables accessible with standard table markup.
Screen reader support for header cells spanning multiple columns is
pretty decent (Voiceover being the exception, at least last time I
tested).
Make sure to use scope="colgroup" and colspan="correct number of columns).
For some strange reason support for header cell spanning multiple rows
is almost non-existent.
If your tables get so complex that header cells spanning multiple
columns/rows is not enough, you may honestly want to consider breaking
them up or simplify them, not just for screen readers but for all
users.
That being said.
I believe that if you have aria-labelledby, aria-label or caption they
should be announced as the table's accessible name, while the value of
the summary attribute would be announced as the tables accessible
description.
You could also use aria-describedby pointing to the id of an element
whose text describes the table (I need to test support for this).
There is a new attribute in the ARIA 1.1 spec, aria-details, that sold
point to visible information about an image (or table) and screen
readers should offer a keyboard shortcut to jump there straight from
the table.
However this attribute is not supported anywhere yet, as far as I know.



On 1/12/17, Beranek, Nicholas < <EMAIL REMOVED> > wrote:
> Hi Levon,
>
> I would recommend at the very least a <caption> element that provides a very
> brief description of the table. I'm curious to hear about the use of the
> "summary" attribute on <table> versus "aria-label" or "aria-labelledby".
> Historically, we've used the "summary" attribute to provide a long
> description.
>
> Nick
>
>