WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Headings or Table Captions

for

From: TRAUTWEIN_PAUL
Date: Nov 3, 2016 2:52PM

Thanks for all the recommendations.

I tried adding the <h2> tag directly into the <caption> tags (this seemed
to be the most direct and easiest thing to try). However, it didn't do
anything in Voiceover. (VO still skipped it when I listed all the
headings.)

My experience is limited - I have to use cheat sheets - but I've just
noticed that VO doesn't seem to recognize the caption tag with or without
the h2 tag. Is that an issue or am I not using the tool correctly?

In any case, I tried Birkir's suggestion with the 'id' attribute in the h2
tag and "aria-labelledby' attribute in the table tag, and although my h2
tags displayed in the list, the h2 tag didn't associate itself to the
table the same way a caption does. I tested this with JAWS, NVDA and
VoiceOver.

Paul Adam's suggestion of having both the h2 and caption makes sense, but
becomes redundant even if I reworded the title of the table for the h2 and
caption. Although I can hide the caption visually and simply have it read
by JAWS and NVDA if the user needs it. The user would hear it twice once
as an heading and then a second time as the caption associated with the
table.

These are basically 'titles' of the table, so maybe I should just stick
with the <h2> tags above the table, with or without the id/aria-labelledby
attributes, the user can still find the heading using any of the heading
lists for VO, JAWS or NVDA. And move on to the content if they choose.

I welcome any other thoughts.

Thanks again.




Paul Trautwein | Web Coordinator
Santa Monica College | Marketing Department
1900 Pico Blvd. Santa Monica CA 90405
310.434.4204 | www.smc.edu






On 11/2/16, 12:16 PM, "Jared Smith" < <EMAIL REMOVED> > wrote:

>An element can only have one role, so it will be either a caption OR a
>heading in this case. You can't have both with one element.
>
>Birkir's recommendation works, but with HTML5 (and it works fine in
>earlier HTML, though will cause a validation error), you can put the
>heading inside the caption:
><caption><h2>Heading Text</h2></caption>.
>
>Jared
>