WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Tables with a checkbox column

for

From: James Kennard
Date: Mar 29, 2010 2:45AM

Okay it seems that my original email wasn't very explanatory... I'll try
again ;)

1. The information is in a table because it is tabulated paginated data
- it definitley belongs in a table.
2. I can't post a URL because it is not currently accessible to the
outside world.
3. The HTML looks something like this (note that I have a number of
these tables throughout an application):

<table>
<thead>
<tr>
<th></th>
<th>Name</th>
<th>Description</th>
<th>Author</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="checkbox" name="item" value="1"></td>
<td>Some name</td>
<td>Some description</td>
<td>Some author</td>
</tr>
<tr>
<td><input type="checkbox" name="item" value="2"></td>
<td>Some other name</td>
<td>Some other description</td>
<td>Some other author</td>
</tr>
<tr>
<td><input type="checkbox" name="item" value="3"></td>
<td>Yet another name</td>
<td>Yet another description</td>
<td>Yet another author</td>
</tr>
</tbody>
</table>

4. I can see one main failure in relation to WCAG 2.0: There is no way
of programatically determining the purpose of the checkboxes because:
4a. The first <th> element is empty
4b. There is are no labels for the checkboxes

So the question really is what is the best solution. I'm not keen on
sticking a value into the first <th> element because there isn't much
space for the table and will squash it horribly (sorry can't change
this, not my design). I thought that if I were to wrap the value in the
"Name" column with a <label> and associate it with the checkbox that
this would resolve the issue?

I would have thought this was quite a common design scenario - you tend
to see this sort of thing in backend applications all the time.

thanks for your input!

james.