Copyright © 2021 W3C ® ( MIT , ERCIM , Keio , Beihang ). W3C liability , trademark and permissive document license rules apply.
This section describes the status of this document at the time of its publication. Other documents may supersede this document. A list of current W3C publications and the latest revision of this technical report can be found in the W3C technical reports index at https://www.w3.org/TR/.
ARIA in HTML is a [ HTML ] specification module. Any HTML features, conformance requirements, or terms that this specification module makes reference to, but does not explicitly define, are defined in the HTML specification .
This is a draft document and its contents are subject to change without notice.
This document was published by the Web Applications Working Group as an Editor's Draft.
GitHub Issues are preferred for discussion of this specification. Alternatively, you can send comments to our mailing list. Please send them to public-html@w3.org ( subscribe , archives ).
Publication as an Editor's Draft does not imply endorsement by the W3C Membership.
This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.
This document was produced by a group operating under the W3C Patent Policy . W3C maintains a public list of any patent disclosures made in connection with the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which the individual believes contains Essential Claim(s) must disclose the information in accordance with section 6 of the W3C Patent Policy .
This document is governed by the 15 September 2020 W3C Process Document .
Web
developers
MAY
use
the
ARIA
role
and
aria-*
attributes
on
HTML
elements
,
in
accordance
with
the
requirements
described
in
WAI-ARIA
,
except
where
these
conflict
with
the
strong
native
semantics
or
are
equal
to
the
implicit
ARIA
semantics
of
a
given
HTML
element.
The
implicit
ARIA
semantics
for
an
HTML
element
are
defined
in
the
HTML
Accessibility
API
Mappings
specification.
The constraints defined in this specification are intended to prevent developers from making assistive technology products report nonsensical user interface (UI) information that does not represent the actual UI of the document.
Web
developers
MUST
NOT
use
the
ARIA
role
and
aria-*
attributes
in
a
manner
that
conflicts
with
the
semantics
described
in
the
§
2.
Document
conformance
requirements
for
use
of
ARIA
attributes
in
HTML
and
§
Document
conformance
requirements
for
use
of
ARIA
attributes
with
HTML
attributes
tables.
It
is
NOT
RECOMMENDED
for
web
developers
to
set
the
ARIA
role
and
aria-*
attributes
to
values
that
match
the
implicit
ARIA
semantics
defined
in
the
table.
Doing
so
is
unnecessary
and
can
potentially
lead
to
unintended
consequences.
The following table provides normative per-element document-conformance requirements for the use of ARIA markup in HTML documents and describes the implicit ARIA semantics that apply to HTML elements as defined in HTML AAM .
Each
language
feature
(element)
in
a
cell
in
the
first
column
implies
the
ARIA
semantics
(role,
states,
and
properties)
given
in
the
cell
in
the
second
column
of
the
same
row.
The
third
cell
in
each
row
defines
which
ARIA
role
values
and
aria-*
attributes
which
MAY
be
used.
Where
a
cell
in
the
third
column
includes
the
term
Any
role
it
indicates
that
any
role
value
apart
from
the
implicit
ARIA
semantics
role
value,
MAY
be
used.
If
a
cell
in
the
third
column
includes
the
term
No
role
it
indicates
that
authors
MUST
NOT
overwrite
the
implicit
ARIA
semantics,
or
native
semantics
of
the
HTML
element.
While
setting
an
ARIA
role
and/or
aria-*
attribute
that
matches
the
implicit
ARIA
semantics
is
NOT
RECOMMENDED
,
in
some
situations
explicitly
setting
these
attributes
can
be
helpful.
For
instance,
in
user
agents
which
lack
exposing
specific
implicit
ARIA
semantics.
HTML element |
Implicit ARIA semantics (explicitly assigning these in markup is NOT RECOMMENDED ) |
ARIA roles, states and properties which MAY be used |
---|---|---|
a
with
href
|
role=
link
|
Roles:
DPub
Roles:
Global
Note:
it
is
not
recommended
to
use
|
a
without
href
|
No corresponding role |
Global
|
abbr
|
No corresponding role |
Global
|
address
|
No corresponding role |
Global
|
area
with
href
|
role=
link
|
No
Global
|
area
without
href
|
No corresponding role |
No
Global
|
article
|
role=
article
|
Roles:
Global
|
aside
|
role=
complementary
|
Roles:
DPub
Roles:
Global
|
audio
|
No corresponding role |
Role:
Global
|
autonomous custom element |
Role
exposed
from
author
defined
ElementInternals
.
Otherwise
no
corresponding
role
.
|
If
no
author
defined
role,
Otherwise
only
allowed
roles
for
the
role
exposed
by
the
custom
element's
Global
|
b
|
No corresponding role |
Any
role
Global
|
base
|
No corresponding role |
No
role
or
aria-*
attributes
|
bdi
|
No corresponding role |
Any
role
Global
|
bdo
|
No corresponding role |
Any
role
Global
|
blockquote
|
No corresponding role |
Global
|
body
|
role=
document
|
No
Global
|
br
|
No corresponding role |
Roles:
Global
|
button
|
role=
button
|
Roles:
Global
|
canvas
|
No corresponding role |
Global
|
caption
|
No corresponding role |
No
|
cite
|
No corresponding role |
Any
role
Global
|
code
|
No corresponding role |
Any
role
Global
|
No corresponding role |
No
role
or
aria-*
attributes
|
|
No corresponding role |
No
role
or
aria-*
attributes
|
|
data
|
No corresponding role |
Any
role
Global
|
datalist
|
role=
listbox
|
No
Global
|
dd
|
role=
definition
|
No
Global
|
del
|
No corresponding role |
Global
|
dfn
|
role=
term
|
Any
role
Global
|
details
|
role=
group
|
No
Global
|
dialog
|
role=
dialog
|
Role:
Global
|
div
|
No corresponding role |
Global
|
dl
|
No corresponding role |
Roles:
Global
|
dt
|
role=
term
|
Role:
Global
|
em
|
No corresponding role |
Global
|
embed
|
No corresponding role |
Roles:
Global
|
fieldset
|
role=
group
|
Roles:
Global
|
figcaption
|
No corresponding role |
Roles:
Global
|
figure
|
role=
figure
|
If
the
If
the
Global
|
footer
|
If
not
a
descendant
of
an
article
,
aside
,
main
,
nav
or
section
element,
or
an
element
with
role=article
,
complementary
,
main
,
navigation
or
region
then
role=
contentinfo
.
Otherwise
no
corresponding
role
.
|
Roles:
DPub
Roles:
Global
|
form
|
If
the
form
element
has
an
accessible
name
:
role=
form
.
Otherwise,
no
corresponding
role
.
|
Roles:
Global
|
form-associated custom element |
Role
exposed
from
author
defined
ElementInternals
.
Otherwise
no
corresponding
role
.
|
If
no
author
defined
role,
Otherwise
only
allowed
roles
for
the
role
exposed
by
the
custom
element's
Global
|
h1
to
h6
|
role=
heading
,
with
the
aria-level
=
positive
integer.
|
Roles:
DPub
Role:
Global
|
head
|
No corresponding role |
No
role
or
aria-*
attributes
|
header
|
If
not
a
descendant
of
an
article
,
aside
,
main
,
nav
or
section
element,
or
an
element
with
role=article
,
complementary
,
main
,
navigation
or
region
then
role=
banner
.
Otherwise
no
corresponding
role
|
Roles:
DPub
Role:
Global
|
hgroup
|
No corresponding role |
Any
Global
|
hr
|
role=
separator
|
Roles:
DPub
Role:
Global
|
html
|
No corresponding role |
No
role
or
aria-*
attributes
|
i
|
No corresponding role |
Global
|
iframe
|
No corresponding role |
Roles:
Global
|
img
with
alt
="some
text"
|
role=
img
|
Roles:
DPub
Role:
Global
|
img
with
alt
=""
|
No corresponding role |
No
role
or
aria-*
attributes
except
aria-hidden="true"
.
|
img
without
alt
attribute
|
role=
img
|
If
no
author-defined
accessible
name
is
provided
by
other
methods:
No
Otherwise,
if
the
|
input
type=button
|
role=
button
|
Roles:
Global
|
input
type=checkbox
|
|
Roles:
Authors
SHOULD
NOT
use
the
Otherwise,
any
global
Note:
the
HTML
|
input
type=color
|
No corresponding role |
No
|
input
type=date
|
No corresponding role |
No
Global
|
input
type=datetime-local
|
No corresponding role |
No
Global
|
input
type=email
with
no
list
attribute
|
role=
textbox
|
No
Global
|
input
type=file
|
No corresponding role |
No
|
input
type=image
|
role=
button
|
Roles:
Global
|
input
type=month
|
No corresponding role |
No
Global
|
input
type=number
|
role=
spinbutton
|
No
Global
|
input
type=password
|
No corresponding role |
No
Global
|
input
type=radio
|
role=
radio
|
Role:
Authors
SHOULD
NOT
use
the
Otherwise,
any
global
Note:
the
HTML
|
input
type=range
|
role=
slider
|
No
Authors
SHOULD
NOT
use
the
Otherwise,
any
global
|
input
type=reset
|
role=
button
|
No
Global
|
input
type=search
,
with
no
list
attribute
|
role=
searchbox
|
No
Global
|
input
type=submit
|
role=
button
|
No
Global
|
input
type=tel
,
with
no
list
attribute
|
role=
textbox
|
No
Global
|
input
type=text
or
with
a
missing
or
invalid
type
,
with
no
list
attribute
|
role=
textbox
|
Roles:
Global
|
input
type=text
,
search
,
tel
,
url
,
email
,
or
with
a
missing
or
invalid
type
,
with
a
list
attribute
|
role=
combobox
|
No
Authors
SHOULD
NOT
use
the
Authors
MUST
NOT
use
the
Otherwise,
any
global
|
input
type=time
|
No corresponding role |
No
Global
|
input
type=url
with
no
list
attribute
|
role=
textbox
|
No
Global
|
input
type=week
|
No corresponding role |
No
Global
|
ins
|
No corresponding role |
Global
|
kbd
|
No corresponding role |
Global
|
label
|
No corresponding role |
No
|
legend
|
No corresponding role |
No
|
li
|
role=
listitem
|
Roles:
DPub
Roles:
Global
|
link
|
No corresponding role |
No
role
or
aria-*
attributes
|
main
|
role=
main
|
No
Global
|
map
|
No corresponding role |
No
role
or
aria-*
attributes
|
math
|
role=
math
|
No
Global
|
mark
|
No corresponding role |
Global
|
menu
|
role=
list
|
Roles:
Global
|
meta
|
No corresponding role |
No
role
or
aria-*
attributes
|
meter
|
No corresponding role |
No
|
nav
|
role=
navigation
|
Roles:
DPub
Roles:
Global
|
noscript
|
No corresponding role |
No
role
or
aria-*
attributes
|
object
|
No corresponding role |
Roles:
Global
|
ol
|
role=
list
|
Roles:
Global
|
optgroup
|
role=
group
|
No
Global
|
option
element
that
is
in
a
list
of
options
or
that
represents
a
suggestion
in
a
datalist
|
role=
option
|
No
Authors
SHOULD
NOT
use
the
Global
|
output
|
role=
status
|
Global
|
p
|
No corresponding role |
Global
|
param
|
No corresponding role |
No
role
or
aria-*
attributes
|
picture
|
No corresponding role |
No
role
or
aria-*
attributes
|
pre
|
No corresponding role |
Global
|
progress
|
role=
progressbar
|
No
Global
|
q
|
No corresponding role |
Global
|
rp
|
No corresponding role |
Global
|
rt
|
No corresponding role |
Global
|
ruby
|
No corresponding role |
Global
|
s
|
No corresponding role |
Global
|
samp
|
No corresponding role |
Global
|
script
|
No corresponding role |
No
role
or
aria-*
attributes
|
section
|
role=
region
if
the
section
element
has
an
accessible
name
.
Otherwise,
no
corresponding
role
.
|
Roles:
DPub
Roles:
Global
|
select
(with
NO
multiple
attribute
and
NO
size
attribute
having
value
greater
than
1
)
|
role=
combobox
|
Role:
Authors
SHOULD
NOT
use
the
Otherwise,
any
global
|
select
(with
a
multiple
attribute
or
a
size
attribute
having
value
greater
than
1
)
|
role=
listbox
|
No
Authors
SHOULD
NOT
use
the
Otherwise,
any
global
|
slot
|
No corresponding role |
No
role
or
aria-*
attributes
|
small
|
No corresponding role |
Global
|
source
|
No corresponding role |
No
role
or
aria-*
attributes
|
span
|
No corresponding role |
Global
|
strong
|
No corresponding role |
Global
|
style
|
No corresponding role |
No
role
or
aria-*
attributes
|
SVG
|
role=graphics-document
as
defined
by
SVG
AAM
|
Global
|
sub
|
No corresponding role |
Global
|
summary
|
role=
button
|
No
Global
|
sup
|
No corresponding role |
Global
|
table
|
role=
table
|
Global
|
tbody
|
If
the
ancestor
If
the
ancestor
|
No
Global
|
template
|
No corresponding role |
No
role
or
aria-*
attributes
|
textarea
|
role=
textbox
|
No
Global
|
tfoot
|
If
the
ancestor
If
the
ancestor
|
No
Global
|
thead
|
If
the
ancestor
If
the
ancestor
|
No
Global
|
time
|
No corresponding role |
Global
|
title
|
No corresponding role |
No
role
or
aria-*
attributes
|
td
|
If
the
ancestor
If
the
ancestor
If
the
ancestor
|
No
Global
|
th
|
If
the
ancestor
If
the
ancestor
If
the
ancestor
|
No
Global
|
tr
|
If
the
ancestor
If
the
ancestor
|
No
Global
|
track
|
No corresponding role |
No
role
or
aria-*
attributes
|
u
|
No corresponding role |
Global
|
ul
|
role=
list
|
Roles:
Global
|
var
|
No corresponding role |
Global
|
video
|
No corresponding role |
Role:
Global
|
wbr
|
No corresponding role |
Global
|
The
elements
marked
with
No
corresponding
role
,
in
the
second
column
of
the
table
do
not
have
any
implicit
ARIA
semantics
,
but
they
do
have
meaning
and
this
meaning
may
be
represented
in
roles,
states
and
properties
not
provided
by
ARIA
,
and
exposed
to
users
of
assistive
technology
via
accessibility
APIs.
It
is
therefore
recommended
that
web
developers
add
a
role
attribute
to
a
semantically
neutral
element
such
as
a
div
or
span
,
rather
than
overriding
the
semantics
of
the
listed
elements.
Authors are encouraged to make use of the following documents for guidance on using ARIA in HTML beyond that which is provided here:
Unless
otherwise
stated,
authors
MAY
use
aria-*
attributes
in
place
of
their
HTML
equivalents
on
HTML
elements
where
the
aria-*
semantics
would
be
expected.
For
example,
authors
MAY
use
aria-disabled=true
on
a
button
rather
than
the
disabled
attribute.
However,
authors
SHOULD
NOT
use
both
the
native
HTML
attribute
and
the
aria-*
attribute
together.
As
stated
in
WAI-
ARIA
's
Conflicts
with
Host
Language
Semantics
,
user
agents
MUST
ignore
WAI-
ARIA
attributes
and
use
the
host
language
(HTML)
attribute
with
the
same
implicit
ARIA
semantics
.
The
following
table
represents
HTML
elements
and
their
attributes
which
have
aria-*
attribute
parity.
Each
language
feature
(element
and
attribute)
in
a
cell
in
the
first
column
implies
the
ARIA
semantics
(states,
and
properties)
given
in
the
cell
in
the
second
column
of
the
same
row.
The
third
cell
in
each
row
defines
how
authors
can
use
the
native
HTML
feature,
along
with
requirements
for
using
the
aria-*
attributes
that
supply
the
same
implicit
ARIA
semantics
.
HTML feature |
Implicit ARIA semantics |
HTML
feature
and
aria-*
attribute
author
guidance
|
---|---|---|
Any
element
where
the
checked
attribute
is
allowed
|
aria-checked="true"
|
Use
the
Authors
SHOULD
NOT
use
the
Authors
MAY
use
the
|
Any
element
where
the
disabled
attribute
is
allowed
|
aria-disabled="true"
|
Use
the
Authors
MAY
use
the
Authors
SHOULD
NOT
use
Authors
MUST
NOT
use
|
Any
element
where
the
placeholder
attribute
is
allowed
|
aria-placeholder="..."
|
Use
the
Authors
MAY
use
the
Authors
MUST
NOT
use
the
|
Any
element
where
the
max
attribute
is
allowed
|
aria-valuemax="..."
|
Use
the
Authors
MAY
use
the
Authors
SHOULD
NOT
use
Authors
MUST
NOT
use
|
Any
element
where
the
min
attribute
is
allowed
|
aria-valuemin="..."
|
Use
the
Authors
MAY
use
the
Authors
SHOULD
NOT
use
Authors
MUST
NOT
use
|
Any
element
where
the
readonly
attribute
is
allowed
|
aria-readonly="true"
|
Use
the
Authors
MAY
use
the
Authors
SHOULD
NOT
use
the
Authors
MUST
NOT
use
|
Element
with
Note:
this
is
equivalent
to
the
|
aria-readonly="false"
|
Authors
MUST
NOT
set
aria-readonly="true"
on
an
element
that
has
isContentEditable="true"
.
|
Any
element
where
the
required
attribute
is
allowed
|
aria-required="true"
|
Use
the
Authors
MAY
use
the
Authors
SHOULD
NOT
use
the
Authors
MUST
NOT
use
|
Any
element
where
the
colspan
attribute
is
allowed
|
aria-colspan="..."
|
Use
the
Authors
MAY
use
the
Authors
SHOULD
NOT
use
the
Authors
MUST
NOT
use
|
Any
element
where
the
rowspan
attribute
is
allowed
|
aria-rowspan="..."
|
Use
the
Authors
MAY
use
the
Authors
SHOULD
NOT
use
the
Authors
MUST
NOT
use
|
Element that is a candidate for constraint validation but that does not satisfy its constraints |
aria-invalid="true"
|
The
|
Authors
MUST
use
lowercase
ASCII
letters
for
all
role
token
values
and
any
state
or
property
attributes
(
aria-*
)
whose
values
are
defined
as
tokens
.
Columns 1 to 4 of the ARIA Roles, States and Properties table provide an informative (non-normative) reference to the ARIA roles, states and properties permitted for use in HTML. All ARIA roles, states and properties are normatively defined in the Accessible Rich Internet Applications (WAI-ARIA) 1.1 specification. Links to ARIA roles, states and properties in the table reference the normative Accessible Rich Internet Applications (WAI-ARIA) 1.1 definitions.
Column
5
of
the
ARIA
Roles,
States
and
Properties
table,
defines
extensions
to
the
Kinds
of
content
(defined
in
the
[
HTML
]
specification)
categories
each
role
has
when
it
is
used
on
a
HTML
element.
Column
6
defines
what
HTML
elements
can
be
descendants
of
an
element
with
a
particular
implicit
or
explicit
role
value.
For
example,
an
element
with
role=button
is
interactive
content
and
therefore
cannot
contain
interactive
content
descendants.
A
button
element
has
an
implicit
role=button
,
so
cannot
contain
any
elements
with
role
values
that
are
in
the
interactive
content
category
(identified
in
Column
3).
<!-- conformance checkers will report an error -->
<button>
<div role="button">...</div>
</button>
<div role="button">
<button>...</button>
</div>
<div role="link">
<textarea>...</textarea>
</
div
>
Role | Description | Required Properties | Supported Properties | Kind of content | Descendant restrictions |
---|---|---|---|---|---|
any | ARIA global states and properties can be used on any HTML element. | none |
|
n/a | n/a |
alert
|
A
type
of
live
region
with
important,
and
usually
time-sensitive,
information.
See
related
alertdialog
and
status
.
|
none |
aria-expanded
(state)
|
Flow content | Flow content |
alertdialog
|
A
type
of
dialog
that
contains
an
alert
message,
where
initial
focus
goes
to
an
element
within
the
dialog.
See
related
alert
and
dialog
.
|
none | Flow content | Flow content | |
application
|
A structure containing one or more focusable elements requiring user input, such as keyboard or gesture events, that do not follow a standard interaction pattern supported by a widget role. | none | Flow content | Flow content | |
article
|
A section of a page that consists of a composition that forms an independent part of a document, page, or site. | none | Flow content | No main element descendants. | |
banner
|
A region that contains mostly site-oriented content, rather than page-specific content. | none |
aria-expanded
(state)
|
Document region | no main element descendants, or header , footer elements that are not descendants of sectioning content which is a descendant of the header . |
button
|
An
input
that
allows
for
user-triggered
actions
when
clicked
or
pressed.
See
related
link
.
|
none | Interactive content | Phrasing content , but there must be no interactive content descendant. | |
checkbox
|
A checkable input that has three possible values: true, false, or mixed. |
aria-checked
(state)
|
aria-readonly
|
Interactive content | Phrasing content , but there must be no interactive content descendant. |
cell
|
A cell in a tabular container. | none | Flow content | Flow content | |
columnheader
|
A cell containing header information for a column. | none | Flow content | Flow content | |
combobox
|
A
presentation
of
a
select;
usually
similar
to
a
textbox
where
users
can
type
ahead
to
select
an
option,
or
type
to
enter
arbitrary
text
as
a
new
item
in
the
list.
See
related
listbox
.
|
Interactive content | Flow content | ||
complementary
|
A supporting section of the document, designed to be complementary to the main content at a similar level in the DOM hierarchy, but remains meaningful when separated from the main content. | none |
aria-expanded
(state)
|
Flow content | Flow content , but with no main element descendants. |
contentinfo
|
A large perceivable region that contains information about the parent document. | none |
aria-expanded
(state)
|
Flow content | Flow content , but with no main element descendants, or header , footer elements that are not descendants of sectioning content which is a descendant of the header . |
definition
|
A definition of a term or concept. | none | Phrasing content | Phrasing content | |
dialog
|
A
dialog
is
an
application
window
that
is
designed
to
interrupt
the
current
processing
of
an
application
in
order
to
prompt
the
user
to
enter
information
or
require
a
response.
See
related
alertdialog
.
|
none | Flow content | Flow content | |
directory
|
A list of references to members of a group, such as a static table of contents. | none |
aria-expanded
(state)
|
Flow content | Flow content |
document
|
A region containing related information that is declared as document content, as opposed to a web application. | none | Flow content | Flow content | |
feed
|
A scrollable list of articles where scrolling may cause articles to be added to or removed from either end of the list. | none |
aria-expanded
(state)
|
Flow content | Flow content |
figure
|
A perceivable section of content that typically contains a graphical document, images, code snippets, or example text. | none |
aria-expanded
(state)
|
Flow content | Flow content |
form
|
A
landmark
region
that
contains
a
collection
of
items
and
objects
that,
as
a
whole,
combine
to
create
a
form.
See
related
search
.
|
none | Flow content | Flow content | |
grid
|
A grid is an interactive control which contains cells of tabular data arranged in rows and columns, like a table. | none | Flow content | ||
gridcell
|
A
cell
in
a
grid
or
treegrid
.
|
none | Flow content | ||
group
|
A set of user interface objects which are not intended to be included in a page summary or table of contents by assistive technologies. | none | Flow content | Flow content | |
heading
|
A heading for a section of the page. | none | Heading content | Flow content , but with no Heading content , Sectioning content , Sectioning roots . | |
img
|
A container for a collection of elements that form an image. | none | Flow content | Phrasing content | |
link
|
An
interactive
reference
to
an
internal
or
external
resource
that,
when
activated,
causes
the
user
agent
to
navigate
to
that
resource.
See
related
button
.
|
none | Flow content | Flow content , but with no interactive content or a element descendants. | |
list
|
A
group
of
non-interactive
list
items.
See
related
listbox
.
|
none | Flow content | Flow content | |
listbox
|
A
widget
that
allows
the
user
to
select
one
or
more
items
from
a
list
of
choices.
See
related
combobox
and
list
.
|
none | Flow content | ||
listitem
|
A
single
item
in
a
list
or
directory
.
|
none | Flow content | Flow content | |
log
|
A
type
of
live
region
where
new
information
is
added
in
meaningful
order
and
old
information
may
disappear.
See
related
marquee
.
|
none | Flow content | Flow content | |
main
|
The main content of a document. | none | Flow content | Flow content , but with no main element descendants | |
marquee
|
A
type
of
live
region
where
non-essential
information
changes
frequently.
See
related
log
.
|
none | Flow content | Flow content | |
math
|
Content that represents a mathematical expression. | none | Flow content | Flow content | |
menu
|
A type of widget that offers a list of choices to the user. | none | Flow content | ||
menubar
|
A presentation of menu that usually remains visible and is usually presented horizontally. | none | Flow content | ||
menuitem
|
An
option
in
a
group
of
choices
contained
by
a
menu
or
menubar
.
|
none | Interactive content | Flow content , but with no interactive content descendants. | |
menuitemcheckbox
|
A checkable menuitem that has three possible values: true, false, or mixed. |
aria-checked
(state)
|
Interactive content | Phrasing content , but with no interactive content descendants. | |
menuitemradio
|
A
checkable
menuitem
in
a
group
of
menuitemradio
roles,
only
one
of
which
can
be
checked
at
a
time.
|
aria-checked
(state)
|
Interactive content | Phrasing content , but with no interactive content descendants. | |
navigation
|
A collection of navigational elements (usually links) for navigating the document or related documents. | none | Flow content | Flow content , but with no main element descendants | |
none
|
An
element
whose
implicit
native
role
semantics
will
not
be
mapped
to
the
accessibility
API
.
See
synonym
presentation
|
none | Flow content | Flow content | |
note
|
A section whose content is parenthetic or ancillary to the main content of the resource. | none | Flow content | Flow content | |
option
|
A selectable item in a select list. | none | Interactive content | Phrasing content , but with no interactive content descendants. | |
presentation
|
An element whose implicit native role semantics will not be mapped to the accessibility API . | none | Flow content | Flow content | |
progressbar
|
An element that displays the progress status for tasks that take a long time. | none | Flow content | Phrasing content | |
radio
|
A checkable input in a group of radio roles, only one of which can be checked at a time. |
aria-checked
(state)
|
Interactive content | Phrasing content , but with no interactive content descendants. | |
radiogroup
|
A group of radio buttons. | none | Flow content | Flow content | |
region
|
A large perceivable section of a web page or document, that the author feels is important enough to be included in a page summary or table of contents, for example, an area of the page containing live sporting event statistics. | none | Flow content | Flow content | |
row
|
A row of cells in a tabular container. |
none |
If
child
of
Also,
if
child
of
|
none | Flow content |
rowgroup
|
A group containing one or more row elements in a grid. | none | none | Flow content | |
rowheader
|
A cell containing header information for a row in a grid. | none | none | Flow content | |
scrollbar
|
A graphical object that controls the scrolling of content within a viewing area, regardless of whether the content is fully displayed within the viewing area. | Phrasing content | |||
search
|
A
landmark
region
that
contains
a
collection
of
items
and
objects
that,
as
a
whole,
combine
to
create
a
search
facility.
See
related
form
.
|
none |
aria-expanded
(state)
|
Flow content | |
searchbox
|
A type of textbox intended for specifying search criteria. | none | Interactive content | Flow content , but with no interactive content descendants. | |
separator
|
A divider that separates and distinguishes sections of content or groups of menuitems. |
|
|
Interactive content (if focusable) |
Phrasing content |
slider
|
A user input where the user selects a value from within a given range. | Interactive content | Phrasing content | ||
spinbutton
|
A form of range that expects the user to select from among discrete choices. | Flow content | |||
status
|
A
container
whose
content
is
advisory
information
for
the
user
but
is
not
important
enough
to
justify
an
alert,
often
but
not
necessarily
presented
as
a
status
bar.
See
related
alert
.
|
none | Flow content | ||
switch
|
A type of checkbox that represents on/off values, as opposed to checked/unchecked values. |
aria-checked
(state)
|
aria-readonly
|
Phrasing content , but with no interactive content descendants. | |
tab
|
A grouping label providing a mechanism for selecting the tab content that is to be rendered to the user. | none | interactive content | Phrasing content , but with no interactive content descendants. | |
table
|
A section containing data arranged in rows and columns. The table role is intended for tabular containers which are not interactive. | none | Flow content | Flow content | |
tablist
|
A
list
of
tab
elements,
which
are
references
to
tabpanel
elements.
|
none | Flow content | Flow content | |
tabpanel
|
A
container
for
the
resources
associated
with
a
tab
,
where
each
tab
is
contained
in
a
tablist
.
|
none | Flow content | Flow content | |
term
|
A
word
or
phrase
with
a
corresponding
definition.
See
related
definition
.
|
none |
aria-expanded
(state)
|
Phrasing content | Phrasing content |
textbox
|
Input that allows free-form text as its value. | none | Interactive content | Flow content , but with no interactive content descendants. | |
timer
|
A type of live region containing a numerical counter which indicates an amount of elapsed time from a start point, or the time remaining until an end point. | none | Flow content | Flow content | |
toolbar
|
A collection of commonly used function buttons represented in compact visual form. | none | Flow content | Flow content | |
tooltip
|
A contextual pop-up that displays a description for an element. | none | Flow content | Flow content | |
tree
|
A type of list that may contain sub-level nested groups that can be collapsed and expanded. | none | Flow content | Flow content | |
treegrid
|
A grid whose rows can be expanded and collapsed in the same manner as for a tree. | none | Flow content | Flow content | |
treeitem
|
An option item of a tree. This is an element within a tree that may be expanded or collapsed if it contains a sub-level group of treeitems. | none | Interactive content | Flow content |
As well as sections marked as non-normative, all authoring guidelines, diagrams, examples, and notes in this specification are non-normative. Everything else in this specification is normative.
The key words MAY , MUST , MUST NOT , NOT RECOMMENDED , and SHOULD NOT in this document are to be interpreted as described in BCP 14 [ RFC2119 ] [ RFC8174 ] when, and only when, they appear in all capitals, as shown here.
Conformance
checkers
that
claim
support
for
checking
of
ARIA
in
HTML,
MUST
implement
checks
for
the
document
conformance
requirements
for
use
of
the
ARIA
role
and
aria-*
attributes
on
HTML
elements
as
defined
in
this
specification.
Documents
MUST
NOT
use
any
role
values
with
elements
in
the
§
2.
Document
conformance
requirements
for
use
of
ARIA
attributes
in
HTML
table,
other
than
the
corresponding
role
value
(if
any)
as
listed
for
that
element
in
the
third
column,
other
than
those
indicated
in
the
second
column
(whose
explicit
use
in
markup
is
NOT
RECOMMENDED
).