WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Complex tables: Scope AND id and header attributes

for

From: Jonathan Avila
Date: Oct 27, 2015 8:25AM

> I would avoid headers/id by now (in html), it is being sunsetted

Birkir, can you please provide a link(s) indicating where this technique is being sunsetted?

> Also, you can no longer use the scope attribute on td cells, you must use them on header (th or td with role="columnheader" or "rowheader") cells.

While this may be true for HTML conformance -- I have not seen these as a documented failure under WCAg.

> and its support by assistive technologies is no better than that of the replacement techniques.

I'm not sure I agree. There are many situations where a table contains multiple column headers but only certain column headers apply to a cell in that column -- not all column headers. In these examples colgroup is not sufficient IMO. In these cases you need id and headers -- that's why the practice could not be sunsetted AFAIK. Examples are in the WCAG table tutorial.

http://www.w3.org/WAI/tutorials/tables/multi-level/

Jonathan

-- 
Jonathan Avila 
Chief Accessibility Officer
SSB BART Group 
<EMAIL REMOVED>
Phone 703.637.8957  
Follow us: Facebook | Twitter | LinkedIn | Blog | Newsletter

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Birkir R. Gunnarsson
Sent: Friday, October 23, 2015 5:01 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Complex tables: Scope AND id and header attributes

Hi

I would avoid headers/id by now (in html), it is being sunsetted and its support by assistive technologies is no better than that of the replacement techniques.
Also, you can no longer use the scope attribute on td cells, you must use them on header (th or td with role="columnheader" or "rowheader") cells.
If you want to indicate that a single row- or column header spans multiple rows or columns, sue the rowspan or colspan attribute with scope="rowgroup" or "colgroup".
E.g.
This header cel is header for two columns:
<th colspan="2" scope="colgroup">Phone numbers</th>

and this is a header for two rows:
<th rowspan="2" scope="rowgroup">My contact info</th>

Colgroup is decently supported on Windows, but support for rowgroup is somewhat buggy, though getting better.
Voiceover (ioS 9.1) does not yet support colgroup properly. It will announce the multi-column header, but does not announce the individual column headers.
if you had this:
<table>
<tr>
<th colspan="2" scope="colgroup">Phone numbers</th> </tr> <tr> <th scope="col">Personal</th> <th scope="col">Business</th> </tr> <tr>
<td>919 999 9999</td>
<td>919777 8797</td>
</tr>
</table>

If you go into the first td cell using table navigation in Jaws or NVDA, they would read:
Phone numbers, personal, 919 999 9999
Voiceover (on iOS) reads:
Phone numbers 919 999 9999.
hth
-Birkir



On 10/23/15, Dona Patrick < <EMAIL REMOVED> > wrote:
> I recall being told by someone or reading somewhere that one should
> not use both Scope AND id and header attributes in complex tables. I
> don't recall if this was HTML or PDF.
>
> Has anyone else heard this? Is it true or was it misinformation?
>
> Thanks,
>
> Dona
> > > archives at http://webaim.org/discussion/archives
> >


--
Work hard. Have fun. Make history.