WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Another rookie question: tables that use a heading rather than a caption

for

Number of posts in this thread: 7 (In chronological order)

From: Jeremy Echols
Date: Wed, Mar 29 2017 1:08PM
Subject: Another rookie question: tables that use a heading rather than a caption
No previous message | Next message →

We have a lot of tables which (I think) make sense to be under a heading (as in the "h2" or "h3" elements). Should we also have a caption for these tables? Should we use a caption instead of a heading?

From: Birkir R. Gunnarsson
Date: Wed, Mar 29 2017 1:29PM
Subject: Re: Another rookie question: tables that use a heading rather than a caption
← Previous message | Next message →

Hi

No, a heading is fine.
As a best practice, add an accessible name to the table that
duplicates the heading text.
e.g.
<h3 id="mg">My grades</h3>
<table aria-labelledby="mg">
...
</table>

or
<table aria-label="My Grades">
...
</table>

Either way, you give the table an accessible name that matches the
heading above it. This way users can find the table either via
navigation by headings or by tables, they can identify the table
regardless of the method.
Again, this is not a mustfor accessibility compliance, but it maeks
for good assistive technology user experience.

accessible


On 3/29/17, Jeremy Echols < = EMAIL ADDRESS REMOVED = > wrote:
> We have a lot of tables which (I think) make sense to be under a heading (as
> in the "h2" or "h3" elements). Should we also have a caption for these
> tables? Should we use a caption instead of a heading?
> > > > >


--
Work hard. Have fun. Make history.

From: Jennifer Sutton
Date: Wed, Mar 29 2017 1:31PM
Subject: Re: Another rookie question: tables that use a heading rather than a caption
← Previous message | Next message →

All:

For those who may not know of this, perhaps this tutorial on tables will
help.


http://www.w3.org/WAI/tutorials/


Especially for new folks (not meaning you, Jeremy, so *please* don't
take this personally!), I see a lot of new folks who ask questions where
they think an accessibility question has a "yes/no" answer. But such
questions rarely do. Often, it's important to understand context/see
code, and even then, the answer turns out to be "it depends."

I see a lot of new folks on this list lately, so I mention this in case
it will help many. Also, this list is archived (with one of the
best/most navigable archives of which I'm aware), so clear subject lines
may cut down on question repeats.

And I'm not the list manager; I just speak from being on this list for
years and years and years.


Now, back to the people who will really try to answer your question,
Jeremy. My experience tells me that often, accessibility is as much
about philosophy as anything else.

But lots of folks want it to be easier than that.


In your case . . . if there are a lot of tables on a page, making it
possible to navigate among them by headings is helpful. I don't believe
heading and caption would serve the same purpose. At the same time, all
screen readers that I know of have the ability to navigate by "table,"
so some could see heading navigation as redundant. Depends on your goals
and what you think your expected audiences will do.


Jennifer



On 3/29/2017 12:08 PM, Jeremy Echols wrote:
> We have a lot of tables which (I think) make sense to be under a heading (as in the "h2" or "h3" elements). Should we also have a caption for these tables? Should we use a caption instead of a heading?
> > > >

From: Jennifer Sutton
Date: Wed, Mar 29 2017 1:33PM
Subject: Re: Another rookie question: tables that use a heading rather than a caption
← Previous message | Next message →

Oh, and yes, this subject line was a good one. I was reading too fast!

Sorry, all.

From: Jared Smith
Date: Wed, Mar 29 2017 1:45PM
Subject: Re: Another rookie question: tables that use a heading rather than a caption
← Previous message | Next message →

Jeremy -

With HTML5 you can place the heading inside the caption:
<table>
<caption><h2>Table Caption/Heading</h2></caption>

This is valid HTML and I'm not aware of any downside to doing this.

Jared

From: Jeremy Echols
Date: Wed, Mar 29 2017 1:50PM
Subject: Re: Another rookie question: tables that use a heading rather than a caption
← Previous message | Next message →

Whoa... I had no idea. That's brilliant, thanks!

Jennifer, thanks for all your input, no offense taken at all. I am definitely a novice in many areas and I'm learning just how often "it depends" comes up. In some cases, I'm actually starting to think a table doesn't make sense in the first place, but there are other cases where the page really does "feel" like it needs both the header and the caption. It's just so much grey area....

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Jared Smith
Sent: Wednesday, March 29, 2017 12:45 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Another rookie question: tables that use a heading rather than a caption

Jeremy -

With HTML5 you can place the heading inside the caption:
<table>
<caption><h2>Table Caption/Heading</h2></caption>

This is valid HTML and I'm not aware of any downside to doing this.

Jared

From: Sailesh Panchang
Date: Wed, Mar 29 2017 1:56PM
Subject: Re: Another rookie question: tables that use a heading rather than a caption
← Previous message | No next message

The caption does serve as a table name or its identifier and helps
screen reader users for sure.
In other words, if the text rightly serves as the table's
name/identifier, use caption. Maybe the h-tag text should be
something else.
But I certainly do not advocate duplicating the h-tag text in an
off-screen caption to aid SR users.
Under an h<n> tag there could be content including one or more
tables. The table could be right after the h-tag or lower down.
When there are multiple tables under a heading, table identifiers (captions) help all users.
If the author has a good reason not to have specific table
identifiers and believes the h-tag provides the necessary context
that's fine too.
If there is a need to use aria-label / labelledby maybe it means the
UI and (usability for all)can be helped with visual captions for
tables.
PS: I began the response with 'It depends'. Then I saw Jennifer had
beaten me to the punch!
Best wishes,
Sailesh Panchang


On 3/29/17, Jeremy Echols < = EMAIL ADDRESS REMOVED = > wrote:
> Whoa... I had no idea. That's brilliant, thanks!
>
> Jennifer, thanks for all your input, no offense taken at all. I am
> definitely a novice in many areas and I'm learning just how often "it
> depends" comes up. In some cases, I'm actually starting to think a table
> doesn't make sense in the first place, but there are other cases where the
> page really does "feel" like it needs both the header and the caption. It's
> just so much grey area....
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf
> Of Jared Smith
> Sent: Wednesday, March 29, 2017 12:45 PM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] Another rookie question: tables that use a heading
> rather than a caption
>
> Jeremy -
>
> With HTML5 you can place the heading inside the caption:
> <table>
> <caption><h2>Table Caption/Heading</h2></caption>
>
> This is valid HTML and I'm not aware of any downside to doing this.
>
> Jared
> > > http://webaim.org/discussion/archives
> > > > > >