WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Using headings and lists inside a table, makes navigation difficult in my opiinion, thoughts?

for

From: SaravanaMoorthy.P
Date: Dec 14, 2011 3:57AM

Bikir,

>>3. That the table be eliminated altogether and this information be
>>presented as a series of lists.

I would recommend to stick to option 3....
Tables are there to be used for displaying Data Tables(eg result tables) and rest of the content should be in a linear manner.
I think the list there is inside UL LI, would suggest to provide those data within a div instead to table as below.

Like:
<div>
<h3>alþjóðastofa</h3>
<ul>
<li>Foreign Languages</li>
<li>Námskeið</li>
<li>Starfsemi</li>
</ul>
<div>Meira</div>
</div>

By doing so, each set of listed items are placed in separate containers(div) which is in linear format and screen reader(JAWS) users can easily navigate to reach the respective list(either by heading list(H) or list items(L) or link list). To provide some value add, you can provide some visually hidden content before "Meira"(more) link which relates the heading of that set, so that you can identify which more is for which

Like:
<div><span class="visualhide"> alþjóðastofa </span>Meira</div>
When screen reader users uses the "link list" to navigate, it will list out and read the "related content & more" instead of just more, more, more, more.....

If the table is generated dynamically then provide role="presentation". But I am not sure that it will behave as linear content.
Any alternative thoughts?

Note: resultant data content can be more accessible when displayed using tables.

Thanks and Regards,
Saravana Moorthy P,
Cognizant Interactive
.......................................
Hand : +91-9840817738
Land : +91-44-33915749
.......................................
Please consider the evironment before printing any document