WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Headings or Table Captions

for

From: Birkir R. Gunnarsson
Date: Nov 2, 2016 1:13PM

I would rather use a regular heading, and assign it as the source of
the accessible name for the table using aria-lbelledby
<h2 id="capt1">Pirates of the Caribbean</h2>
<table aria-labelledby="capt1">
...
</table>
This way you get your heading, and you assign it as the accessible
name for the table.

Just make sure the heading is visually ocated close to the table, so
that users of screen magnification will see it.



On 11/2/16, TRAUTWEIN_PAUL < <EMAIL REMOVED> > wrote:
> Hi,
>
> I have a question about the use of captions in tables.
>
> There are times when I want my captions to visually match the look and feel
> of my heading tags. (that's easy enough)
>
> But there are also times when I'd like them to behave like a heading as
> well.
>
> I found some code that I thought would work, but my tests don't bear it out
> using different browsers and screen readers:
>
> <caption role="heading" aria-level="2->Heading Text</caption>
>
> This works pretty well using JAWS on a PC, but they are skipped when listing
> headings using Voiceover on a Mac.
>
> Is there a better way to do this, or should I simply skip the 'caption- and
> add a heading tag above the table?
>
> Thanks.
>
> Paul Trautwein | Web Coordinator
> Santa Monica College | Marketing Department
> 1900 Pico Blvd. Santa Monica CA 90405
> 310.434.4204 | www.smc.edu
> > > > >


--
Work hard. Have fun. Make history.