WAI-ARIA: Role=Caption
Visible content that names, and may also describe, a figure
, table
, grid
, or treegrid
.
Description
Visible content that names, and may also describe, a figure
, table
, grid
, or treegrid
.
When using caption
authors SHOULD ensure:
- The
caption
is a direct child of afigure
,table
,grid
, ortreegrid
. - The
caption
is the first child of atable
,grid
, ortreegrid
. - The
caption
is the first or last child of afigure
.
Authors SHOULD set aria-labelledby
on the parent figure
, table
, grid
, or treegrid
to reference the element with role caption
. However, if a caption
contains content that serves as both a name and description for its parent, authors MAY instead set aria-labelledby
to reference an element within the caption
that contains a concise name, and set aria-describedby
to reference an element within the caption
that contains the descriptive content.
Role=Caption Example
<div role="table" aria-labelledby="name" aria-describedby="desc">
<div role="caption">
<div id="name">Contest Entrants</div>
<div id="desc">
This table shows the total number of entrants (500) the
contest accepted over the past four weeks.
</div>
</div>
<!-- ... -->
Characteristics
Superclass Role
Related Concepts
Required Context Role
Inherited States and Properties
- aria-atomic
- aria-busy (state)
- aria-controls
- aria-current (state)
- aria-describedby
- aria-details
- aria-disabled (state)
- aria-dropeffect
- aria-errormessage
- aria-flowto
- aria-grabbed (state)
- aria-haspopup
- aria-hidden (state)
- aria-invalid (state)
- aria-keyshortcuts
- aria-live
- aria-owns
- aria-relevant
- aria-roledescription
Prohibited States and Properties
Semantic HTML
The HTML alternative for role=”caption” is the <caption>
tag.
Reference
- WAI-ARIA 1.2 Specification
Refer to the notes from the WAI-ARIA 1.2 specification for more information on role=caption.