This specification defines the authoring rules (author conformance requirements) for the use of Accessible Rich Internet Applications (WAI-ARIA) 1.2 and Digital Publishing WAI-ARIA Module 1.0 attributes on [HTML] elements. This specification's primary objective is to define requirements for use with conformance checking tools used by authors (i.e., web developers). These requirements will aid authors in their development of web content, including custom interfaces and widgets, which make use of ARIA to complement or extend the features of the host language [HTML].
Status of This DocumentThis section describes the status of this document at the time of its publication. 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 an [HTML] specification module. Any HTML features, conformance requirements, or terms that this specification module makes reference to, but does not explicitly define, are defined by the HTML Standard.
Since this specification become a W3C Recommendation on 09 December 2021, the following substantive additions and/or corrections have been proposed:
aria-*
attributes and roles on summary
element.li
element role allowances in context to the element's ancestral relationship, or lack of, to a list element parent.search
element has been added.aria-hidden=true
on the body
element.figure
element role allowances to include doc-example
.aria-*
attributes on the datalist
element.aria-checked
is not to be used on elements that support the checked
attribute.none
and presentation
roles on nav
element.div
element when it is a child of a dl
element.combobox
role on button
element. Allow combobox
and checkbox
roles on input type=button
element.doc-biblioentry
and doc-endnote
roles on the li
element. These roles are deprecated in Digital Publishing WAI-ARIA Module 1.1.radio
role on img alt="some text"
element.none
and presentation
roles for wbr
element. Allow only aria-hidden
global attribute for br
and wbr
elements.group
role on section
element.link
and button
roles on area
without href
element.aria-hidden
attribute on the picture
element.Reviewers of the document can identify candidate additions and/or corrections by their distinctive styling in the document:
Candidate corrections are marked in the document.
Candidate additions are marked in the document.
This document was published by the Web Applications Working Group as a Recommendation using the Recommendation track. It includes candidate amendments, introducing substantive changes and new features since the previous Recommendation.
W3C recommends the wide deployment of this specification as a standard for the Web.
A W3C Recommendation is a specification that, after extensive consensus-building, is endorsed by W3C and its Members, and has commitments from Working Group members to royalty-free licensing for implementations. Future updates to this Recommendation may incorporate new features.
Candidate additions are marked in the document.
Candidate corrections are marked in the document.
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 2 November 2021 W3C Process Document.
Table of ContentsAuthors MAY use the ARIA role
and aria-*
attributes to change the exposed meaning (semantics) of HTML elements, in accordance with the requirements defined by WAI-ARIA, except where ARIA features conflict with the strong native semantics or are equal to the implicit ARIA semantics of a given HTML element. The implicit ARIA semantics for the features of HTML are defined by the HTML Accessibility API Mappings specification.
Any constraints for the use of ARIA features in HTML defined by this specification are intended to prevent authors from making assistive technology products report nonsensical user interface (UI) information that does not represent the actual UI of the document.
Authors MUST NOT use the ARIA role
and aria-*
attributes in a manner that conflicts with the semantics described in the 4. Document conformance requirements for use of ARIA attributes in HTML and 4.2 Requirements for use of ARIA attributes in place of equivalent HTML attributes tables. It is NOT RECOMMENDED for authors to set the ARIA role
and aria-*
attributes to values that match the implicit ARIA semantics defined in either table. Doing so is unnecessary and can potentially lead to unintended consequences.
This section is non-normative.
Through the use of ARIA, authors can specify semantics that go beyond the current capabilities of native HTML. This can be very useful, as it provides authors the opportunity to create widgets, or expose specific accessible states and properties to native HTML features which would not be possible by the use of HTML alone.
For instance, a button
element has no native HTML feature to expose a "pressed" state. ARIA allows authors to extend the semantics of the element by specifying the aria-pressed
attribute, allowing for an aural UI that will match the visual presentation of the control.
In the following example, a button
element allows for a user to toggle the state of a setting within a web application. The aria-pressed
attribute is used to augment the button
element. When in the "pressed" state that information can be exposed to users of assistive technologies.
<button aria-pressed=true>...</button>
There are also situations where certain aria-*
attributes are allowed for use on elements with specific role
s, while the equivalent native attribute is currently not valid in HTML itself.
For instance, HTML has no direct concept of a disabled hyperlink (a href
element). Constructs such as <a href="..." disabled> ... </a>
are not valid, and will not be conveyed to assistive technologies.
ARIA diverges from HTML in this regard and does allow for an aria-disabled
attribute to be specified on an element with an explicit role=link
. If an author were to specify an aria-disabled=true
on an HTML hyperlink, user agents would not functionally treat the hyperlink any differently (it would still be clickable/operable), however it would be exposed to assistive technologies as being in the disabled state.
Similarly, while native HTML option
elements that are descendants of a select
can only be set as being selected
, elements with an explicit option
role can not only allow the equivalent aria-selected
, but also the aria-checked
attribute, supporting widgets/constructs that go beyond the capabilities of a native select
element.
Unfortunately, in these situations where ARIA and HTML have feature parity, but diverge in allowances, it can create for a misalignment in support, if not also user experiences. In situations where ARIA allows a feature not supported by HTML, it will often be in the author's and ultimately the user's best interest to instead implement as a fully custom ARIA widget.
In the following example, a hyperlink needs to be communicated as being in the disabled state. HTML does not allow for the use of the disabled
attribute on a hyperlink, and using aria-disabled=true
would communicate the hyperlink as being disabled to assistive technologies, but would not actually disable the element. The most effective way to both communicate and actually disable a hyperlink would be to remove the href
from the a
element, creating a placeholder. Then, ARIA can be applied to this placeholder link to communicate the element's intended role and state.
<a role=link aria-disabled=true>...</a>
This section is non-normative.
ARIA is useful for revising or correcting the role of an element when a different role is necessary to expose to users. However, it is rarely in the user or author's best interest to try and use ARIA to override an interactive element, for instance a button
, with a role generally exposed by a non-interactive element. For instance, a heading.
As an example, the following uses a role=heading
on a button
element. This is not allowed, because the button
element has default functionality that conflicts with user expectations for the heading role.
<button role="heading">search</button>
An author would need to take additional steps to ensure the default functionality and presentation of the button
was removed, and even doing so may still not be enough to fully supress the element's implicit features depending on how the user chooses to engage with the web page. E.g., by turning on Windows high contrast themes, or viewing the web page in a browser's reader mode.
The following example illustrates a button
element which has also been provided an explicit role=button
. Specifying this role is unnecessary, as a "button" element is already exposed with an implicit button
role. In practice this particular instance of redundancy will likely not have unforeseen side effects, other than unnecessarily making the markup more verbose, and incorrectly signaling to other authors that this practice is useful. Please review the section 3.3 Be cautious of side effects for an example of where specifying unnecessary roles can be problematic.
<button role="button">...</button>
Similarly, the following uses a role=group
on a fieldset
element, and a role=Main
on a main
element. This is unnecessary, because the fieldset
element is implicitly exposed as a role=group
, as is the main
element implicitly exposed as a role=main
. Again, in practice this will likely not have any unforeseen side effects to users of assistive technology, as long as the declaration of the role
value uses ASCII lowercase. Please see 4.4 Case requirements for ARIA role, state and property attributes for more information.
<fieldset role="group">...</fieldset>
<main role="Main">...</main>
The following uses a role=list
on an ul
element. This is generally unnecessary, because the ul
element is implicitly exposed as a role=list
. However, some user agents suppress a list's implicit ARIA semantics if list markers are removed. Authors can use role=list
to reinstate the role if necessary, though this practice would generally not be recommended, otherwise.
The following uses a role=button
on a summary
element. This is unnecessary and can result in cross-platform issues. For instance, preventing the element from correctly exposing its state, and forcing the role of button
, when it might otherwise be exposed with a platform or browser specific role.
<details>
<summary role="button">more information</summary>
...
</details>
Accessible Rich Internet Applications (WAI-ARIA) 1.2 defines a number of roles which are not meant to be used by authors. Many of these roles are categorized as Abstract Roles which are explicitly stated as not to be used by authors. The following example illustrates the invalid use of an abstract select
role, where an author likely meant to use the combobox
role instead.
<div role="select" ...>...</div>
ARIA also defines a generic
role which is meant to provide feature parity with a number of HTML elements that do not have more specific ARIA semantics of their own. For instance, HTML's div
and span
elements, among others. ARIA discourages authors from using the generic
role as its intended purpose is for use by implementors of user agents.
In the following example, rather than using a generic
role, authors are advised to use a div
in place of the article
element. If changing the HTML element is not possible, specifying a role of presentation
or none
would be acceptable alternaties to remove the implicit role of the article
.
<article role="generic" ...>...</article>;
Additionally, ARIA specifically mentions in Conflicts with Host Language Semantics that if authors use both native HTML features for exposing states and properties as well as their ARIA counterparts, then the host language features take priority over the explicit ARIA attributes that are also used.
For instance, in the following example an author is using HTML's input type=checkbox
and has specified an aria-checked=true
. However, user agents are meant to ignore the aria-checked
attribute. Instead user agents would expose the state based on the native features of the form control.
<input type="checkbox" checked aria-checked="false">
While ARIA can be used to alter the way HTML features are exposed to users of assistive technologies, these modifications do not change the underlying parsing and allowed content models of HTML. For instance, a div
allows an author to specify any role on it. However, this does not mean that the element can then be used in a way that deviates from the rules HTML has defined for the element.
For instance, in the following example an author has specified a role of link
on a div
element. While HTML allows for a hyperlink (exposed as a role=link
) to be a descendant of a p
element, the HTML parser does not allow a div
to be a descendant of a p
element.
<p>
... <div role=link tabindex=0>...</div> ...
</p>
The HTML parser will modify the above markup to be output as the following:
Example 12: Unwanted rendered markup with valid alternative solution
<p>...</p>
<div role=link tabindex=0>...</div>
...
<p></p>
<p>
... <span role=link tabindex=0>...</span> ...
</p>
While this specification indicates the allowed ARIA attributes that can be specified on each HTML element, this example illustrates that even if a role is allowed, the context in which it is used can still result in potential rendering and accessibility issues.
The following table provides normative per-element document-conformance requirements for the use of ARIA markup in HTML documents. Additionally, it identifies the implicit ARIA semantics that apply to HTML elements. The implicit ARIA semantics of these elements are 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 the ARIA role
values and aria-*
attributes which authors MAY specify on the element. Where a cell in the third column includes the term Any role
it indicates that any role
value MAY be used on the element. However, it is NOT RECOMMENDED for authors to specify the implicit role of the element, the generic
role, or a role deprecated by ARIA on these elements. 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.
WAI-ARIA identifies roles which have prohibited states and properties. These roles do not allow certain WAI-ARIA attributes to be specified by authors. HTML elements which expose these implicit WAI-ARIA roles also prohibit authors from specifying these WAI-ARIA attributes.
Elements which are identified as Naming prohibited are those which authors MUST NOT specify an aria-label
or aria-labelledby
attribute, unless the element allows for its implicit role to be overwritten by an explicit WAI-ARIA role which allows naming from authors. For more information see 4.1 Requirements for use of ARIA attributes to name elements.
Note
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, for user agents that do not expose implicit ARIA semantics for certain elements.
Note
While it is conforming to use Digital Publishing WAI-ARIA Module 1.0 role
values as outlined in the following table, the current support for exposing the semantics of these values to users of assistive technology is close to non-existent.
Implicit ARIA semantics (explicitly assigning these in markup is NOT RECOMMENDED)
ARIA role, state and property allowancesa
with href
role=link
Roles: button
, checkbox
, menuitem
, menuitemcheckbox
, menuitemradio
, option
, radio
, switch
, tab
or treeitem
. (link
is also allowed, but NOT RECOMMENDED.)
DPub Roles: doc-backlink
, doc-biblioref
, doc-glossref
or doc-noteref
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
It is NOT RECOMMENDED to use aria-disabled="true"
on an a
element with an href
attribute.
Note
If a link needs to be programmatically communicated as "disabled",
remove thehref
attribute
.
a
without href
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
abbr
No corresponding role
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
address
role=group
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
area
with href
role=link
No role
other than link
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the link
role.
area
without href
role=generic
Roles: button
or link
. (
is also allowed, but SHOULD NOT BE USED.)generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
article
role=article
Roles: application
, document
, feed
, main
, none
, presentation
or region
. (article
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
aside
role=complementary
Roles: feed
, none
, note
, presentation
, region
or search
. (complementary
is also allowed, but NOT RECOMMENDED.)
DPub Roles: doc-dedication
, doc-example
, doc-footnote
, doc-pullquote
or doc-tip
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
audio
No corresponding role
Role: application
Global aria-*
attributes and any aria-*
attributes applicable to the application
role.
Role exposed from author defined ElementInternals
Otherwise role=
generic
If role defined by ElementInternals
, no role
Otherwise, any role
, though
SHOULD NOT be used.generic
Naming Prohibited if exposed as the generic
role, or if exposed as another role which prohibits naming.
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
b
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
base
No corresponding role
No role
or aria-*
attributes
bdi
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
bdo
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
blockquote
role=blockquote
Any role
, though
is NOT RECOMMENDED.blockquote
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
body
role=generic
No role
other than
, which SHOULD NOT be used.generic
Otherwise, global aria-*
attributes allowed for the generic
role, with the exception that authors MUST NOT specify aria-hidden=true
on the body
element.
br
No corresponding role
Roles: none
or presentation
Authors MAY specify the aria-hidden
attribute on the br
element. Otherwise, no other allowed aria-*
attributes.
button
role=button
Roles: checkbox
, combobox
, link
, menuitem
, menuitemcheckbox
, menuitemradio
, option
, radio
, switch
or tab
. (button
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
canvas
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
caption
role=caption
No role
other than
, which is NOT RECOMMENDED.caption
Otherwise, global aria-*
attributes.
cite
No corresponding role
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
code
role=code
Any role
, though
is NOT RECOMMENDED.code
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
col
No corresponding role
No role
or aria-*
attributes
colgroup
No corresponding role
No role
or aria-*
attributes
data
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
datalist
role=listbox
No role
other than listbox
, which is NOT RECOMMENDED.
No aria-*
attributes.
dd
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the definition
role.
del
role=deletion
Any role
, though
is NOT RECOMMENDED.deletion
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
details
role=group
No role
other than group
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the group
role.
dfn
role=term
Any role
, though term
is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
dialog
role=dialog
Role: alertdialog
. (dialog
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the dialog
role.
div
role=generic
If a direct child of a dl
element, only presentation
or none
. Otherwise, any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
dl
No corresponding role
Roles: group
, list
, none
or presentation
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
dt
No corresponding role
Role: listitem
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
em
role=emphasis
Any role
, though
is NOT RECOMMENDED.emphasis
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
embed
No corresponding role
Roles: application
, document
, img
, none
or presentation
.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
fieldset
role=group
Roles: none
, presentation
or radiogroup
. (group
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
figcaption
No corresponding role
Roles: group
, none
or presentation
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
figure
role=figure
If the figure
has no figcaption
descendant:
Any role
, though figure
is NOT RECOMMENDED.
If the figure
has a figcaption
descendant:
DPub Role: doc-example
.
Otherwise, figure
is allowed, but NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
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, role=
generic
Roles: group
, presentation
or none
. (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
is also allowed, but NOT RECOMMENDED. Otherwise, role=
is also allowed, but SHOULD NOT be used.)generic
DPub Role: doc-footnote
Naming Prohibited if exposed as generic
.
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
form
role=form
Roles: or none
, presentation
or search
. (form
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
Note
A form
is not exposed as a landmark region unless it has been provided an accessible name.
Role exposed from author defined ElementInternals
Otherwise role=
generic
If role defined by ElementInternals
, no role
Otherwise, form-related roles: button
, checkbox
, combobox
, listbox
, progressbar
, group
, radio
, radiogroup
, searchbox
, slider
, spinbutton
, switch
or textbox
. (
is also allowed, but SHOULD NOT be used.)generic
Naming Prohibited if exposed as the generic
role.
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
h1 to h6
role=heading
, aria-level
= the number in the element's tag name
Roles: none
, presentation
or tab
. (heading
is also allowed, but NOT RECOMMENDED.)
DPub Role: doc-subtitle
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
head
No corresponding role
No role
or aria-*
attributes
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, role=
generic
Roles: group
, none
or presentation
. (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
is also allowed, but NOT RECOMMENDED. Otherwise, role=
is also allowed, but SHOULD NOT be used.)generic
Naming Prohibited if exposed as generic
.
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
hgroup
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
hr
role=separator
Roles: none
or presentation
. (separator
is also allowed, but NOT RECOMMENDED.)
DPub Role: doc-pagebreak
Global aria-*
attributes and any aria-*
attributes applicable to the separator
role.
html
role=document
No role
other than document
, which is NOT RECOMMENDED.
No aria-*
attributes.
i
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
iframe
No corresponding role
Roles: application
, document
, img
, none
or presentation
.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
img
with alt
="some text"
role=img
Roles: button
, checkbox
, link
, menuitem
, menuitemcheckbox
, menuitemradio
, option
, progressbar
, radio
, scrollbar
, separator
, slider
, switch
, tab
or treeitem
. (img
is also allowed, but NOT RECOMMENDED.)
DPub Role: doc-cover
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
img
with alt
=""
role=presentation
No role
other than presentation
, which is NOT RECOMMENDED
No aria-*
attributes except aria-hidden="true"
.
img
without an alt
attribute role=img
If no accessible name is provided via other img
naming methods (e.g., aria-labelledby
, aria-label
): No role
other than img
, which is NOT RECOMMENDED.
No aria-*
attributes except aria-hidden="true"
.
Otherwise, if the img
has an author defined accessible name, see img
with alt="some text"
.
input type=button
role=button
Roles: checkbox
, combobox
, link
, menuitem
, menuitemcheckbox
, menuitemradio
, option
, radio
, switch
or tab
. (button
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
input type=checkbox
role=checkbox
Roles: menuitemcheckbox
, option
or switch
; button
if used with aria-pressed
. (checkbox
is also allowed, but NOT RECOMMENDED.)
Authors MUST NOT use the aria-checked
attribute on input type=checkbox
elements.
Otherwise, any global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
Note
The HTML checked
attribute can be used instead of the aria-checked
attribute for menuitemcheckbox
, option
or switch
roles when used on type=checkbox
.
input type=color
No corresponding role
Global aria-*
attributes and aria-disabled
attribute.
input type=date
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
input type=datetime-local
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
input type=email
with no list
attribute role=textbox
No role
other than textbox
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
input type=file
No corresponding role
Global aria-*
attributes, aria-disabled
, aria-invalid
and aria-required
attributes.
input type=hidden
No corresponding role
No role
or aria-*
attributes
input type=image
role=button
Roles: link
, menuitem
, menuitemcheckbox
, menuitemradio
, radio
or switch
. (button
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
input type=month
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
input type=number
role=spinbutton
No role
other than spinbutton
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the spinbutton
role.
input type=password
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
input type=radio
role=radio
Role: menuitemradio
. (radio
is also allowed, but NOT RECOMMENDED.)
Authors MUST NOT use the aria-checked
attribute on input type=radio
elements.
Otherwise, any global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
Note
The HTML checked
attribute can be used instead of the aria-checked
attribute for the menuitemradio
role when used on type=radio
.
input type=range
role=slider
No role
other than slider
, which is NOT RECOMMENDED.
Authors SHOULD NOT use the aria-valuemax
or aria-valuemin
attributes on input type=range
.
Otherwise, any global aria-*
attributes and any other aria-*
attributes applicable to the slider
role.
input type=reset
role=button
No role
other than button
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the button
role.
input type=search
, with no list
attribute role=searchbox
No role
other than searchbox
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the searchbox
role.
input type=submit
role=button
No role
other than button
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the button
role.
input type=tel
, with no list
attribute role=textbox
No role
other than textbox
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
input type=text
or with a missing or invalid type
, with no list
attribute role=textbox
Roles: combobox
, searchbox
or spinbutton
. (textbox
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
input type=text
, search
, tel
, url
, email
, or with a missing or invalid type
, with a list
attribute role=combobox
No role
other than combobox
, which is NOT RECOMMENDED.
Authors SHOULD NOT use the aria-haspopup
attribute on the indicated input
s with a list
attribute.
Otherwise, any global aria-*
attributes and any other aria-*
attributes applicable to the combobox
role.
input type=time
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
input type=url
with no list
attribute role=textbox
No role
other than textbox
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
input type=week
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
ins
role=insertion
Any role
, though
is NOT RECOMMENDED.insertion
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
kbd
No corresponding role
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
label
No corresponding role
Otherwise, global aria-*
attributes.
legend
No corresponding role
Otherwise, global aria-*
attributes.
li
If the li
is a child of a list element (ul
, ol
, menu
) role=listitem
.
Otherwise, if the li
is not a child of a list element it is exposed as a role=generic
.
No role
other than listitem
, which is NOT RECOMMENDED, if the parent list element has an implicit or explicit list
role.
Otherwise, any role
if the parent list item does nto expose an implicit or explicit list
role.
Note
See ul
, ol
, or menu
for allowed roles for list elements.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
Authors SHOULD NOT use the following deprecated DPub Roles: doc-biblioentry
, doc-endnote
.
link
No corresponding role
No role
or aria-*
attributes
main
role=main
No role
other than main
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the main
role.
map
No corresponding role
No role
or aria-*
attributes
mark
No corresponding role
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
math
role=math
No role
other than math
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the math
role.
role=list
Roles: group
, listbox
, menu
, menubar
, none
, presentation
, radiogroup
, tablist
, toolbar
or tree
. (list
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
Authors SHOULD NOT use deprecated directory
role.
meta
No corresponding role
No role
or aria-*
attributes
meter
role=meter
No role
other than
, which is NOT RECOMMENDED.meter
Authors SHOULD NOT use the aria-valuemax
or aria-valuemin
attributes on meter
elements.
Otherwise, any global aria-*
attributes.
nav
role=navigation
Roles: menu
, menubar
, none
, presentation
or tablist
. (navigation
is also allowed, but NOT RECOMMENDED.)
DPub Roles: doc-index
, doc-pagelist
or doc-toc
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
noscript
No corresponding role
No role
or aria-*
attributes
object
No corresponding role
Roles: application
, document
or img
.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
ol
role=list
Roles: group
, listbox
, menu
, menubar
, none
, presentation
, radiogroup
, tablist
, toolbar
or tree
. (list
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
Authors SHOULD NOT use deprecated directory
role.
optgroup
role=group
No role
other than group
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the group
role.
option
element that is in a list of options or that represents a suggestion in a datalist
role=option
No role
other than option
, which is NOT RECOMMENDED.
Authors SHOULD NOT use the aria-selected
attribute on the option
element.
Global aria-*
attributes and any other aria-*
attributes applicable to the option
role.
output
role=status
Any role
, though status
is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
p
role=paragraph
Any role
, though
is NOT RECOMMENDED.paragraph
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
param
No corresponding role
No role
or aria-*
attributes
picture
No corresponding role
Authors MAY specify the aria-hidden
attribute on the picture
element. Otherwise, no other allowed aria-*
attributes.
pre
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
progress
role=progressbar
No role
other than progressbar
, which is NOT RECOMMENDED.
Authors SHOULD NOT use the aria-valuemax
attribute on progress
elements.
Otherwise, any global aria-*
attributes and any other aria-*
attributes applicable to the progressbar
role.
q
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
rp
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
rt
No corresponding role
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
ruby
No corresponding role
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
s
No corresponding role
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
samp
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
script
No corresponding role
No role
or aria-*
attributes
search
role=search
Roles: form
, group
, none
, presentation
or region
. (search
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
section
role=region
if the section
element has an accessible name
Otherwise, no corresponding role
Roles: alert
, alertdialog
, application
, banner
, complementary
, contentinfo
, dialog
, document
, feed
, group
, log
, main
, marquee
, navigation
, none
, note
, presentation
, search
, status
or tabpanel
. (If the section
element has an accessible name, role=region
is also allowed, but NOT RECOMMENDED.)
DPub Roles: doc-abstract
, doc-acknowledgments
, doc-afterword
, doc-appendix
, doc-bibliography
, doc-chapter
, doc-colophon
, doc-conclusion
, doc-credit
, doc-credits
, doc-dedication
, doc-endnotes
, doc-epigraph
, doc-epilogue
, doc-errata
, doc-example
, doc-foreword
, doc-glossary
, doc-index
, doc-introduction
, doc-notice
, doc-pagelist
, doc-part
, doc-preface
, doc-prologue
, doc-pullquote
, doc-qna
, doc-toc
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
select
(with NO multiple
attribute and NO size
attribute having value greater than 1
) role=combobox
Role: menu
. (combobox
is also allowed, but NOT RECOMMENDED.)
Authors SHOULD NOT use the aria-multiselectable
attribute on a select
element.
Otherwise, any global aria-*
attributes and any other aria-*
attributes applicable to the combobox
or menu
role.
select
(with a multiple
attribute or a size
attribute having value greater than 1
) role=listbox
No role
other than listbox
, which is NOT RECOMMENDED.
Authors SHOULD NOT use the aria-multiselectable
attribute on a select
element.
Otherwise, any global aria-*
attributes and any other aria-*
attributes applicable to the listbox
role.
slot
No corresponding role
No role
or aria-*
attributes
small
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
source
No corresponding role
No role
or aria-*
attributes
span
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
strong
role=strong
Any role
, though
is NOT RECOMMENDED.strong
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
style
No corresponding role
No role
or aria-*
attributes
sub
role=subscript
Any role
, though
is NOT RECOMMENDED.subscript
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
summary
Note
Many, but not all, user agents expose the
summary
element with an implicit ARIA
role=button
.
No role
if the summary
element is a summary for its parent details.
Global aria-*
attributes, aria-disabled
, and aria-haspopup
attributes.
Otherwise, authors MAY specifiy Any role
, and any global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
sup
role=superscript
Any role
, though
is NOT RECOMMENDED.superscript
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
SVG
role=graphics-document
as defined by SVG AAM
Any role
, though graphics-document
is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
table
role=table
Any role
, though table
is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
tbody
role=rowgroup
Any role
, though rowgroup
is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
template
No corresponding role
No role
or aria-*
attributes
textarea
role=textbox
No role
other than textbox
, which is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the textbox
role.
role=rowgroup
Any role
, though rowgroup
is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
thead
role=rowgroup
Any role
, though rowgroup
is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
time
role=time
Any role
, though
is NOT RECOMMENDED.time
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
title
No corresponding role
No role
or aria-*
attributes
td
role=cell
if the ancestor table
element is exposed as a role=table
role=gridcell
if the ancestor table
element is exposed as a role=grid
or treegrid
No corresponding role if the ancestor table
element is not exposed as a role=table
, grid
or treegrid
If the ancestor table
element has role=table
, grid
, or treegrid
, no role
other than the following:
table
element is exposed as a role=table
, then cell
is allowed, but NOT RECOMMENDED.table
element is exposed as a role=grid
or treegrid
, then gridcell
is allowed, but NOT RECOMMENDED.Otherwise, if the ancestor table
element is not exposed as a role=table
, grid
or treegrid
, any role
.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
th
role=columnheader
, rowheader
or cell
if the ancestor table
element is exposed as a role=table
role=columnheader
, rowheader
or gridcell
if the ancestor table
element is exposed as a role=grid
or treegrid
No corresponding role if the ancestor table
element is not exposed as a role=table
, grid
or treegrid
If the ancestor table
element has role=table
, grid
, or treegrid
, no role
other than the following:
table
element is exposed as a role=table
, then columnheader
, rowheader
and cell
are allowed, but NOT RECOMMENDED.table
element is exposed as a role=grid
or treegrid
, then columnheader
, rowheader
or gridcell
are allowed, but NOT RECOMMENDED.Otherwise, if the ancestor table
element is not exposed as a role=table
, grid
or treegrid
, any role
.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
tr
role=row
If the ancestor table
element has role=table
, grid
, or treegrid
, no role
other than row
, which is NOT RECOMMENDED; otherwise any role
, though row
is NOT RECOMMENDED.
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
track
No corresponding role
No role
or aria-*
attributes
u
role=generic
Any role
, though
SHOULD NOT be used.generic
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
ul
role=list
Roles: group
, listbox
, menu
, menubar
, none
, presentation
, radiogroup
, tablist
, toolbar
or tree
. (list
is also allowed, but NOT RECOMMENDED.)
Global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
Authors SHOULD NOT use the deprecated directory
role.
var
No corresponding role
Otherwise, global aria-*
attributes and any aria-*
attributes applicable to the allowed roles.
video
No corresponding role
Role: application
Global aria-*
attributes and any aria-*
attributes applicable to the application
role.
wbr
No corresponding role
Roles: none
or presentation
Authors MAY specify the aria-hidden
attribute on the wbr
element. Otherwise, no other allowed aria-*
attributes.
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 authors add a role
attribute to a semantically neutral element such as a div
or span
, rather than overriding the semantics of the listed elements.
Note
Authors are encouraged to make use of the following documents for guidance on using ARIA in HTML beyond that which is provided here:
These features can be used to make accessibility tools render content to their users in more useful ways. For example, ASCII art, which is really an image, appears to be text, and in the absence of appropriate roles and properties would end up being rendered by screen readers as a nonsensical string of punctuation characters. Using the features described in this section, one can instead make the ATs skip the ASCII art and just read the caption:
<figure>
<pre role="img" aria-label="ASCII Fish">
o .'`/
' / (
O .-'` ` `'-._ .')
_/ (o) '. .' /
) ))) >< <
`\ |_\ _.' '. \
'-._ _ .-' '.)
jgs `\__\
</pre>
<figcaption id="fish-caption">
Joan G. Stark, "<cite>fish</cite>".
October 1997. ASCII on electrons. 28×8.
</figcaption>
</figure>
Authors MAY use aria-label
and aria-labelledby
attributes to specify accessible names for elements which have an implicit or explicit ARIA role which allows naming from authors. Accessible Rich Internet Applications (WAI-ARIA) 1.2 defines roles which allow naming from authors as well as roles where author naming is prohibited.
Authors MUST NOT specify aria-label
or aria-labelledby
on elements with implicit WAI-ARIA roles which cannot be named. HTML elements whose implicit WAI-ARIA roles prohibit naming from authors are identified in 4. Document conformance requirements for use of ARIA attributes in HTML.
The following markup example demonstrates a selection of HTML elements with implicit ARIA roles that prohibit naming from authors.
Example 14: Elements with implicit ARIA roles which prohibit naming from authors
<p aria-label="...">...</p>
<span aria-label="...">...<span>
<code aria-label="...">...<code>
<div aria-labelledby="...">...</div>
The following markup example demonstrates elements which have explicit WAI-ARIA roles which allow naming from authors. Due to the explicit roles specified on these elements, aria-label
and aria-labelledby
attributes are allowed.
<p role="link" tabindex="0" aria-label="...">...</p>
<span role="button" tabindex="0" aria-label="...">...<span>
<div role="article" aria-labelledby="...">...</div>
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 specify aria-disabled=true
on a button
element, while also implementing the necessary scripting to functionally disable the button
, rather than the use disabled
attribute.
As stated in WAI-ARIA's Conflicts with Host Language Semantics, when HTML elements use both aria-*
attributes and their host language (HTML) equivalents, user agents MUST ignore the WAI-ARIA attributes – the native HTML attributes with the same implicit ARIA semantics take precedence. For this reason, authors SHOULD NOT specify both the native HTML attribute and the equivalent aria-*
attribute on an element. Please review each attribute for any further author specific requirements.
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.
Implicit ARIA semantics
HTML feature andaria-*
attribute author guidance Any element where the checked
attribute is allowed aria-checked="true"
Use the checked
attribute on any element that is allowed the checked
attribute in HTML. Use the indeterminate
IDL attribute to indicate the "mixed" state for input type=checkbox
elements.
Authors MUST NOT use the aria-checked
attribute on any element where the checkedness, or the indeterminate checked value of the element can be in opposition to the current value of the aria-checked
attribute.
Authors MAY use the aria-checked
attribute on any other element with a WAI-ARIA role which allows the attribute.
disabled
attribute is allowed, including option
disabled
and optgroup
disabled
aria-disabled="true"
Use the disabled
attribute on any element that is allowed the disabled
attribute in HTML.
Authors MAY use the aria-disabled
attribute on any element that is allowed the disabled
attribute in HTML, or any element with a WAI-ARIA role which allows the aria-disabled
attribute.
Authors SHOULD NOT use aria-disabled="true"
on any element which also has a disabled
attribute.
Authors MUST NOT use aria-disabled="false"
on any element which also has a disabled
attribute.
hidden
attribute aria-hidden="true"
Authors MAY use the aria-hidden
attribute on any HTML element that allows global aria-*
attributes, with the following exception:
Authors SHOULD NOT use the aria-hidden="true"
attribute on any element which also has a hidden
attribute.
placeholder
attribute is allowed aria-placeholder="..."
Use the placeholder
attribute on any element that is allowed the placeholder
attribute in HTML.
Authors MAY use the aria-placeholder
attribute on any element that is allowed the placeholder
attribute in HTML, or any element with a WAI-ARIA role which allows the aria-placeholder
attribute.
Authors MUST NOT use the aria-placeholder
attribute on any element which also has a placeholder
attribute.
max
attribute is allowed: meter
max
, progress
max
, and input
max
aria-valuemax="..."
Use the max
attribute on any element that is allowed the max
attribute in HTML.
Authors MAY use the aria-valuemax
attribute on any other element with a WAI-ARIA role which allows the aria-valuemax
attribute.
Authors SHOULD NOT use aria-valuemax
on any element which allows the max
attribute. Use the max
attribute instead.
Authors MUST NOT use aria-valuemax
on any element which also has a max
attribute.
min
attribute is allowed: meter
min
and input
min
aria-valuemin="..."
Use the min
attribute on any element that is allowed the min
attribute in HTML.
Authors MAY use the aria-valuemin
attribute on any other element with a WAI-ARIA role which allows the aria-valuemin
attribute.
Authors SHOULD NOT use aria-valuemin
on any element which allows the min
attribute. Use the min
attribute instead.
Authors MUST NOT use aria-valuemin
on any element which also has a min
attribute.
readonly
attribute: input
readonly
, textarea
readonly
and form-associated custom element which allows readonly
aria-readonly="true"
Use the readonly
attribute on any element that is allowed the readonly
attribute in HTML.
Authors MAY use the aria-readonly
attribute on any element with a WAI-ARIA role which allows the attribute.
Authors SHOULD NOT use the aria-readonly="true"
on any element which also has a readonly
attribute.
Authors MUST NOT use aria-readonly="false"
on any element which also has a readonly
attribute.
Element with contenteditable
=true
or element without contenteditable
attribute whose closest ancestor with a contenteditable
attribute has contenteditable="true"
.
Note
This is equivalent to the isContentEditable
IDL attribute.
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: input
required
, textarea
required
, and select
required
aria-required="true"
Use the required
attribute on any element that is allowed the required
attribute in HTML.
Authors MAY use the aria-required
attribute on any element that is allowed the required
attribute in HTML, or any element with a WAI-ARIA role which allows the aria-required
attribute.
Authors SHOULD NOT use the aria-required="true"
on any element which also has a required
attribute.
Authors MUST NOT use aria-required="false"
on any element which also has a required
attribute.
colspan
attribute is allowed: td
and th
aria-colspan="..."
Use the colspan
attribute on any element that is allowed the colspan
attribute in HTML.
Authors SHOULD NOT use the aria-colspan
attribute on any element which also has a colspan
attribute.
Authors MUST NOT use aria-colspan
on any element which also has a colspan
attribute, and the values of each attribute do not match.
rowspan
attribute is allowed: td
and th
aria-rowspan="..."
Use the rowspan
attribute on any element that is allowed the rowspan
attribute in HTML.
Authors SHOULD NOT use the aria-rowspan
attribute on any element which also has a rowspan
attribute.
Authors MUST NOT use aria-rowspan
on any element which also has a rowspan
attribute, and the values of each attribute do not match.
The ARIA Specification's Deprecated Requirements section indicates that if an ARIA feature is marked as deprecated then authors are advised not to use said feature for new content.
The following roles and attributes are deprecated features of ARIA and DPub ARIA. Conformance checkers MUST warn authors about the deprecated status of these features. Whenever possible, authors are advised to use alternatives to deprecated features.
Note
The directory
role is marked for deprecation in WAI-ARIA 1.2. In reality, the directory
role had no functional difference to an element with an implicit or explicit list
role. Authors are advised to use one of HTML's native list elements, or an ARIA list
instead.
Note
The doc-biblioentry
and doc-endnote
roles are marked for deprecation in Digital Publishing WAI-ARIA Module 1.1, as they are not valid children for an element with an implicit or explicit role of list
. Authors can use standard list and child li
elements without the need for these roles.
Note
The aria-dropeffect
and aria-grabbed
attributes were deprecated in WAI-ARIA 1.1. There is presently no feature in ARIA to replace their proposed functionality.
Authors SHOULD use ASCII lowercase for all role
token values and any state or property attributes (aria-*
) whose values are defined as tokens.
Note
While modern browsers treat the role
or aria-*
attribute values as ASCII case-insensitive, not all assistive technologies will correctly parse these values.
To reduce interoperability issues, authors are strongly encouraged to use ASCII lowercase for aria-*
and role
attribute values. Further, authors are encouraged to rigorously test with different browser and assistive technology combinations to ensure that their content will be correctly exposed to their users.
Correct (conforming) examples:
<div role="main">...</div>
<a href="home/" aria-current="page">home</a>
Incorrect (non-conforming) examples:
<div role="MAIN">...</div>
<div role="Main">...</div>
<a href="home/" aria-current="Page">home</a>
This section is non-normative.
The following table maps (and extends) the Kinds of content and allowed descendant information (defined in the [HTML] specification) to elements that have an equivalent role
.
Column 1 links to the normative Accessible Rich Internet Applications (WAI-ARIA) 1.2 definitions for each ARIA role
. Column 2 identifies the Kinds of content categories each role
has when it is used on an HTML element. Column 3 indicates what kinds of HTML elements can be descendants of an element with an explicit role
specified, often matching the HTML element with the same implicit role.
For example, a button
element has an implicit role=button
. In HTML a button
element allows phrasing content as descendants, and does not allow interactive content or descendants with a tabindex
attribute. Therefore, any elements specified with a role=button
would follow the same descendant restrictions, and not allow any interactive content descendants, elements with a tabindex
specified, or any elements with role values that are in the interactive content category (identified in column 3).
<button>
<div role="button">...</div>
</button>
<div role="button">
<button>...</button>
</div>
<div role="link">
<textarea>...</textarea>
</div>
Additionally, there are certain roles which Accessible Rich Internet Applications (WAI-ARIA) 1.2 has specified specific requirements for their allowed descendants. These have been identified in column 3 (Descendant allowances) by indicating to "Refer to the 'Required Owned Elements'" for those particular roles.
Allowed descendants of ARIA roles Role Kind of content Descendant allowancesalert
Flow content Flow content but with no main element descendants. alertdialog
Flow content Flow content application
Flow content Flow content article
Flow content but with no main element descendants.
Flow content but with no main, header, or footer element descendants. blockquote
Flow content but with no main element descendants. button
Phrasing content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. caption
N/A Flow content but with no main or table element descendants. cell
N/A Flow content but with no main element descendants. checkbox
Phrasing content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. code
Phrasing content columnheader
N/A Flow content but with no main, header, or footer element descendants. combobox
Flow content but with no main element descendants. complementary
Flow content but with no main element descendants. contentinfo
Flow content but with no main, header, or footer element descendants. definition
Phrasing content deletion
Phrasing content dialog
Flow content Flow content directory
Flow content Flow content but with no main element descendants. document
Flow content Flow content emphasis
Phrasing content feed
Flow content Flow content but with no main element descendants. figure
Flow content but with no main element descendants. form
Flow content, but with no form
element descendants. generic
Flow content grid
Refer to the "Required Owned Elements" as defined for the ARIA grid
role. gridcell
Interactive content Flow content but with no main element descendants. group
Flow content heading
Phrasing content img
Phrasing content, but with no interactive content descendants. insertion
Phrasing content link
Flow content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. list
Flow content Refer to the "Required Owned Elements" as defined for the ARIA list
role. listbox
Refer to the "Required Owned Elements" as defined for the ARIA listbox
role. listitem
N/A Flow content but with no main element descendants. log
Flow content Flow content, but with no main element descendants. main
Flow content Flow content, but with no main element descendants. marquee
Flow content Flow content, but with no main element descendants. math
Flow content Flow content
Refer to the "Required Owned Elements" as defined for the ARIA menu
role.
Refer to the "Required Owned Elements" as defined for the ARIA menubar
role. Interactive content Phrasing content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. Interactive content Phrasing content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. Interactive content Phrasing content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. meter
Phrasing content, but with no meter element descendants. navigation
Flow content, but with no main element descendants. none
N/A Transparent note
Flow content Flow content, but with no main element descendants. option
Interactive content Phrasing content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. paragraph
Phrasing content presentation
N/A Transparent progressbar
Phrasing content, but with no progress element descendants. radio
Phrasing content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. radiogroup
Flow content region
Flow content, but with no main element descendants. row
N/A Refer to the "Required Owned Elements" as defined for the ARIA row
role. rowgroup
N/A Refer to the "Required Owned Elements" as defined for the ARIA rowgroup
role. N/A Flow content but with no main element descendants. scrollbar
Interactive content Phrasing content search
Flow content but with no main element descendants. searchbox
Flow content but with no main element descendants. separator
Interactive content (if focusable) Phrasing content slider
Phrasing content spinbutton
Flow content but with no main element descendants. status
Flow content Flow content but with no main element descendants. strong
Phrasing content subscript
Phrasing content superscript
Phrasing content switch
Phrasing content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. tab
Interactive content Phrasing content, but with no interactive content descendants, and no descendants with a tabindex
attribute specified. table
Refer to the "Required Owned Elements" as defined for the ARIA table
role. tablist
Refer to the "Required Owned Elements" as defined for the ARIA tablist
role. tabpanel
Flow content Flow content term
Phrasing content Phrasing content textbox
Interactive content Flow content but with no main element descendants. time
Phrasing content timer
Flow content Flow content but with no main element descendants. toolbar
Flow content Flow content but with no main element descendants. tooltip
Flow content Phrasing content tree
Flow content Refer to the "Required Owned Elements" as defined for the ARIA tree
role. treegrid
Flow content Refer to the "Required Owned Elements" as defined for the ARIA treegrid
role. treeitem
Interactive content Phrasing 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, SHOULD, 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 ARIA in HTML documents MUST implement checks for the conformance requirements for use of the ARIA role
and aria-*
attributes on HTML elements as defined in this specification.
A conforming document MUST NOT contain any elements with author defined role
or aria-*
attributes with values other than those which, per this specification, authors MAY use on each HTML element in 4. Document conformance requirements for use of ARIA attributes in HTML. Conformance checkers SHOULD flag instances where authors are explicitly providing an element with a role
which matches its implicit ARIA semantics as failures, as it is NOT RECOMMENDED for authors to explicitly set these roles.
A conformance checker MAY define their own terminology, and level or levels of severity, when surfacing document failures to conform to this specification.
This section is non-normative.
This specification does not define the features of [wai-aria-1.2], [dpub-aria-1.0] or [HTML]. Rather it provides rules and guidance for conformance checkers that claim support for checking ARIA in HTML, as well as providing guidance to authors.
Therefore, there are no known privacy or security impacts of this specification, as it defines no new features to introduce potential concern.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.3