With the advent of HTML5, I'm starting to use figure
to enclose images and tables, among other things. Up until now I've used the table's caption
element to label the table. However, figcaption
can be used to label the figure's content. It seems that in the case of a table within a figure, there are two elements that serve more or less the same purpose.
On one hand, caption
is specific to describing the table's purpose; on the other hand figcaption
is a little broader, yet would apply to the table as well as other figure content.
Would it be appropriate to use figcaption
to label tables in figures, if for nothing else than consistency with other figures containing different elements?
Every figure and table should have a caption. Here are some tips on using captions: A figure caption is centered under the figure; a table caption is centered above the table (if a caption is more than one line, make it left justified). A Figure and its caption should appear on the same page.
<figcaption>: The Figure Caption element The <figcaption> HTML element represents a caption or legend describing the rest of the contents of its parent <figure> element.
The <figcaption> element can be placed as the first or last child of the <figure> element.
A caption functions like a heading for a table. Most screen readers announce the content of captions. Captions help users to find a table and understand what it's about and decide if they want to read it. If the user uses “Tables Mode”, captions are the primary mechanism to identify tables.
From the WHATWG spec:
When a table element is the only content in a figure element other than the figcaption, the caption element should be omitted in favor of the figcaption.
And while they currently match, here's a corresponding link to the W3C Editor's Draft, just in case.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With