WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Table with hidden first column

for

From: R.U. Steinberg
Date: Nov 8, 2018 8:24AM


Glen, thanks for the report. I will give it a try.

On Wed, Nov 7, 2018 at 12:20 PM glen walker < <EMAIL REMOVED> > wrote:

> Interesting solution. I guess you have to go with whichever solution you
> feel is the least worst. You don't really have a case where there is a
> "best" solution. You just have to minimize the confusion and know there
> will be negatives will all solutions.
>
> Neither NVDA nor VoiceOver will read the aria-label associated with your
> <th>. With NVDA, it will feel like the first column is blank because every
> cell in the first column will be heard as blank. VO will not let me
> navigate to the first column because (I'm guessing) it sees the entire
> contents of the cell as aria-hidden.
>
> JAWS reads the aria-label so it sounds ok.
>
> In my case, with NVDA, I turned off the table coordinates announcement so I
> don't hear "row 1", "row 2", etc. I only like to hear the row or column
> headers. With your solution, I don't hear any row headers as I navigate
> vertically through a column (because they're aria-hidden), but perhaps the
> onus is on me because I changed my default configuration.
>
> I know your example code was just a sample, but in that case, I'd rather
> have the name column used as the row headers. Have you thought about doing
> that in your real code? Don't make the row number cell the row header but
> use a column that has more meaning. A row header does not have to be the
> first cell in the table row. That is, you can have:
>
> <tr>
> <td>1</td>
> <th scope="row">Gerard</th>
> <td>Roseville, CA</td>
> <td>The Godfather</td>
> </tr>
>
> I think there is varying levels of support for row headers not being in the
> first column. I haven't tested it on all platforms lately, but sometimes
> the row header is ignored on columns that come before the row header
> column, but it works fine for all the columns after the row header column.
>
> You'd still have the issue when the user is navigating vertically through
> the first column where they'd hear "5" and "row 6", but it's only an issue
> when in that column. When they're in any other column, they'll hear the
> name row header, the table cell value, and "row 5". They won't hear the
> number you have in the first column.
>
> Glen
>
>
>
> On Wed, Nov 7, 2018 at 10:32 AM R.U. Steinberg <
> <EMAIL REMOVED> >
> wrote:
>
> > This was my workaround. We have a table where the first row is the header
> > row and will be announced as row 1 to screen readers. When you get to the
> > second row, it has a number 1 in front of it but will be announced as row
> > 2. This is a confusing user experience when you have a table with say 100
> > rows. A screen reader user shouldn't have to guess what row they are on.
> >
> > https://codepen.io/rusteinberg/pen/WYrogg
> >
> >
> >
> > > > >