WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Tables with Header cells in the second column, not the first

for

From: Stella Mudd
Date: May 12, 2012 8:48PM

Jesse,

Since the example you gave is considered a complex table, I guess, using
the headers attribute should suffice. However, JAWS seems to have a bug
and will not announce the row header. VoiceOver doesn't like this as well,
but NVDA works great! The only decent cross browser implementation I was
able to get is by using the headers and aria-describedby attributes.

http://jsfiddle.net/stellamudd/HXRDQ/

What a pain. Jesse, can you ensure Freedom Scientific is aware? Thanks
for bringing this problem to light.

- Stella


On Sat, May 12, 2012 at 12:36 PM, Ryan E. Benson < <EMAIL REMOVED> >wrote:

> Jesse,
>
> > I tried both of your suggestions but have found no success. Any other
> thoughts? Here is my code. In both cases the <th> in the second column is
> not read by jaws13 when using the Ctrl+Alt+5 command
>
> [Ryan]: I just took a look, and you either use the scope method or the
> header/id method, not both. I don't have that level of knowledge which
> one trumps the other, but my gut says headers/id because it is
> explicitly binding things together. Given that, you didn't fully bind
> the cells, therefore it doesn't fully work.
>
> --
> Ryan E. Benson
>
>
> On Tue, May 8, 2012 at 7:10 PM, Jesse Hausler < <EMAIL REMOVED> >
> wrote:
> > Ryan and Stella,
> >
> > I tried both of your suggestions but have found no success. Any other
> thoughts? Here is my code. In both cases the <th> in the second column is
> not read by jaws13 when using the Ctrl+Alt+5 command.
> >
> > Thanks,
> > Jesse
> >
> > <table> <tr> <th scope="col">Day</th> <th
> scope="col">Week</th> <th scope="col">Year</th> </tr>
> <tr> <td>Monday</td> <th >2012</th>
> <td>10</td> </tr> <tr> <th >1982</th>
> <td>Wednesday</td> <td>9</td> </tr> <tr>
> <th>2000</th> <td>Thursday</td> <td>15</td>
> </tr> </table> <table> <tr> <th id="dy">Day</th>
> <th id="wk">Week</th> <th id="yr">Year</th> </tr>
> <tr> <td headers="dy th3">Monday</td> <th
> id="th3">2012</th> <td headers="yr th3">10</td> </tr>
> </table>
> >
> >
> > On 5/7/12 5:12 PM, "Stella Mudd" < <EMAIL REMOVED> > wrote:
> >
> > I believe if you remove the scope="row", cells to the left and right
> should
> > be read. Give it a try and let us know. Thanks!!
> >
> > On Mon, May 7, 2012 at 4:15 PM, Jesse Hausler < <EMAIL REMOVED>
> >wrote:
> >
> >> A colleague and I were playing around with simple tables today. There
> are
> >> header cells for all of the columns with scope="col". For the row
> headers
> >> , the second column of cells are marked as TH scope="row", and not the
> >> first column. Pseudo-code below:
> >>
> >> <table>
> >> <tr>
> >> <th scope="col">col 1</th>
> >> <th scope="col">col 2</th>
> >> <th scope="col">col 3</th>
> >> </tr>
> >> <tr>
> >> <td>data1</td>
> >> <th scope="row">row header1</th>
> >> <td>data2</td>
> >> </tr>
> >> <tr>
> >> <td>data3</td>
> >> <th scope="row">row header2</th>
> >> <td>data4</td>
> >> </tr>
> >> </table>
> >>
> >> When navigating the table using JAWS, we found that the row headers were
> >> only read on data cells to the right of the row heading. For instance,
> if
> >> I am navigated to the cell with text, "data1" and press Ctrl+Alt+5 - I
> am
> >> only being told the heading "Col 1". If I am on the cell with text,
> "data2"
> >> and press that command - I am told my headings are "col 3, row header1".
> >>
> >> Any thoughts? We often place our row headers in the second column and
> >> place actions in the first column.
> >>
> >> Thanks,
> >> Jesse
> >>
> >> ---
> >> Jesse Hausler
> >> Sr. Accessibility Specialist | salesforce.com<
> http://www.salesforce.com/>;
> >> Tel (415) 536-8902 | Fax (415) 944-1762
> >>
> >> > >> > >> > >>
> > > > > > > >
> > > > > > > > > >