From f8b1624b8d16ec06968dcb0b79aad360252361b4 Mon Sep 17 00:00:00 2001 From: Matt King Date: Tue, 14 Aug 2018 21:20:10 -0700 Subject: [PATCH 1/2] Option role: Change aria-selected from required to supported and remove implicit value For issue #700, made the following changes to the option role section in index.html: 1. Remove sentence from description that states there is an default value of false fore aria-selected on option elements. 2. Remove aria-selected from required states and properties row of attributes table. 3. Add aria-selected to supported row of attributes table. 4. Remove default value for aria-selected from implicit values row of attributes table. Note: This cascades to treeitem so that aria-selected is not required on treeitem. --- index.html | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/index.html b/index.html index 2b2466c4e..ccc72ff0c 100644 --- a/index.html +++ b/index.html @@ -4679,7 +4679,6 @@
Note regarding the ARIA 1.1 none role.

A selectable item in a select list.

Authors MUST ensure elements with role option are contained in, or owned by, an element with the role listbox or group. Options not associated with a listbox might not be correctly mapped to an accessibility API.

-

Elements with the role option have an implicit aria-selected value of false.

@@ -4730,11 +4729,7 @@
Note regarding the ARIA 1.1 none role.
- + @@ -4743,6 +4738,7 @@
Note regarding the ARIA 1.1 none role.
  • aria-checked
  • aria-posinset
  • aria-setsize
  • +
  • aria-selected
  • @@ -4777,7 +4773,7 @@
    Note regarding the ARIA 1.1 none role.
    - +
    Characteristics:
    Required States and Properties: -
      -
    • aria-selected
    • -
    -
    Supported States and Properties:
    Implicit Value for Role:Default for aria-selected is false.
    From de84a1fca3fc02b947e96ae95e065fda2da54ec9 Mon Sep 17 00:00:00 2001 From: Matt King Date: Sat, 10 Oct 2020 19:19:03 -0700 Subject: [PATCH 2/2] Rewrite based on latest master. --- index.html | 5727 ++++++++++++++++++++++++++++++++++++---------------- 1 file changed, 4039 insertions(+), 1688 deletions(-) diff --git a/index.html b/index.html index ccc72ff0c..6236c77ac 100644 --- a/index.html +++ b/index.html @@ -1,34 +1,25 @@ - Accessible Rich Internet Applications (WAI-ARIA) 1.2 - +
    -

    Accessibility of web content requires semantic information about widgets, structures, and behaviors, in order to allow assistive technologies to convey appropriate information to persons with disabilities. This specification provides an ontology of roles, states, and properties that define accessible user interface elements and can be used to improve the accessibility and interoperability of web content and applications. These semantics are designed to allow an author to properly convey user interface behaviors and structural information to assistive technologies in document-level markup. This version adds features new since WAI-ARIA 1.0 [[wai-aria-1.0]] to improve interoperability with assistive technologies to form a more consistent accessibility model for [[HTML5]] and [[SVG2]]. This specification complements both [[HTML5]] and [[SVG2]].

    +

    Accessibility of web content requires semantic information about widgets, structures, and behaviors, in order to allow assistive technologies to convey appropriate information to persons with disabilities. This specification provides an ontology of roles, states, and properties that define accessible user interface elements and can be used to improve the accessibility and interoperability of web content and applications. These semantics are designed to allow an author to properly convey user interface behaviors and structural information to assistive technologies in document-level markup. This version adds features new since WAI-ARIA 1.1 [[wai-aria-1.1]] to improve interoperability with assistive technologies to form a more consistent accessibility model for [[HTML]] and [[SVG2]]. This specification complements both [[HTML]] and [[SVG2]].

    This document is part of the WAI-ARIA suite described in the WAI-ARIA Overview.

    -

    The Accessible Rich Internet Applications Working Group seeks feedback on any aspect of the specification is accepted. When submitting feedback, please consider issues in the context of the companion documents. To comment, file an issue in the W3C ARIA GitHub repository. If this is not feasible, send email to public-aria@w3.org (comment archive). In-progress updates to the document may be viewed in the publicly visible editors' draft.

    +

    The Accessible Rich Internet Applications Working Group seeks feedback on any aspect of the specification. When submitting feedback, please consider issues in the context of the companion documents. To comment, file an issue in the W3C ARIA GitHub repository. If this is not feasible, send email to public-aria@w3.org (comment archive). In-progress updates to the document may be viewed in the publicly visible editors' draft.

    Introduction

    @@ -181,9 +173,9 @@

    Introduction

  • improving the accessibility of dynamic content generated by scripts; and
  • providing for interoperability with assistive technologies.
  • -

    WAI-ARIA is a technical specification that provides a framework to improve the accessibility and interoperability of web content and applications. This document is primarily for developers creating custom widgets and other web application components. Please see the WAI-ARIA Overview for links to related documents for other audiences, such as WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.1]] that introduces developers to the accessibility problems that WAI-ARIA is intended to solve, the fundamental concepts, and the technical approach of WAI-ARIA.

    -

    This draft currently handles two aspects of roles: user interface functionality and structural relationships. For more information and use cases, see [[WAI-ARIA-PRACTICES-1.1]] for the use of roles in making interactive content accessible.

    -

    The role taxonomy is designed in part to support the common roles found in platform accessibility APIs. Reference to roles found in this taxonomy by dynamic web content may be used to support interoperability with assistive technologies.

    +

    WAI-ARIA is a technical specification that provides a framework to improve the accessibility and interoperability of web content and applications. This document is primarily for developers creating custom widgets and other web application components. Please see the WAI-ARIA Overview for links to related documents for other audiences, such as WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.2]] that introduces developers to the accessibility problems that WAI-ARIA is intended to solve, the fundamental concepts, and the technical approach of WAI-ARIA.

    +

    This document currently handles two aspects of roles: user interface functionality and structural relationships. For more information and use cases, see WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.2]] for the use of roles in making interactive content accessible.

    +

    Roles defined by this specification are designed to support the roles used by platform accessibility APIs. Declaration of these roles on elements within dynamic web content is intended to support interoperability between the web content and assistive technologies that utilize accessibility APIs.

    The schema to support this standard has been designed to be extensible so that custom roles can be created by extending base roles. This allows user agents to support at least the base role, and user agents that support the custom role can provide enhanced access. Note that much of this could be formalized in [[XMLSCHEMA11-2]]. However, being able to define similarities between roles, such as baseConcepts and more descriptive definitions, would not be available in XSD.

    WAI-ARIA 1.2 is a member of the WAI-ARIA 1.2 suite that defines how to expose semantics of WAI-ARIA and other web content languages to accessibility APIs.

    @@ -193,20 +185,18 @@

    Rich Internet Application Accessibility

    New technologies often overlook semantics required for accessibility, and new authoring practices often misuse the intended semantics of those technologies. Elements that have one defined meaning in the language are used with a different meaning intended to be understood by the user.

    For example, web application developers create collapsible tree widgets in HTML using CSS and JavaScript even though HTML has no semantic tree element. To a non-disabled user, it may look and act like a collapsible tree widget, but without appropriate semantics, the tree widget may not be perceivable to, or operable by, a person with a disability because assistive technologies may not recognize the role. Similarly, web application developers create interactive button widgets in SVG using JavaScript even though SVG has no semantic button element. To a non-disabled user, it may look and act like a button widget, but without appropriate semantics, the button widget may not be perceivable to, or operable by, a person with a disability because assistive technologies may not recognize the role.

    The incorporation of WAI-ARIA is a way for an author to provide proper semantics for custom widgets to make these widgets accessible, usable, and interoperable with assistive technologies. This specification identifies the types of widgets and structures that are commonly recognized by accessibility products, by providing an ontology of corresponding roles that can be attached to content. This allows elements with a given role to be understood as a particular widget or structural type regardless of any semantics inherited from the implementing host language. Roles are a common property of platform accessibility APIs which assistive technologies use to provide the user with effective presentation and interaction.

    -

    This role taxonomy includes interaction widgets and elements denoting document structure. The role taxonomy describes inheritance and details the attributes each role supports. Information about mapping of roles to accessibility APIs is provided by the Core Accessibility API Mappings 1.1 [[CORE-AAM-1.1]].

    +

    The Roles Model includes interaction widgets and elements denoting document structure. The Roles Model describes inheritance and details the attributes each role supports. Information about mapping of roles to accessibility APIs is provided by the Core Accessibility API Mappings [[CORE-AAM-1.2]].

    Roles are element types and will not change with time or user actions. Role information is used by assistive technologies, through interaction with the user agent, to provide normal processing of the specified element type.

    States and properties are used to declare important attributes of an element that affect and describe interaction. They enable the user agent and operating system to properly handle the element even when the attributes are dynamically changed by client-side scripts. For example, alternative input and output technology, such as screen readers and speech dictation software, need to be able to recognize and effectively manipulate and communicate various interaction states (e.g., disabled, checked) to the user.

    -

    While it is possible for assistive technologies to access these properties directly through the Document Object Model [[DOM4]], the preferred mechanism is for the user agent to map the states and properties to the accessibility API of the operating system. See the Core Accessibility API Mappings 1.1 [[CORE-AAM-1.1]] and the Accessible Name and Description: Computation and API Mappings 1.1 [[ACCNAME-AAM-1.1]] for details.

    +

    While it is possible for assistive technologies to access these properties directly through the Document Object Model [[DOM]], the preferred mechanism is for the user agent to map the states and properties to the accessibility API of the operating system. See the Core Accessibility API Mappings [[CORE-AAM-1.2]] and the Accessible Name and Description Computation [[ACCNAME-1.2]] for details.

    Figure 1.0 illustrates the relationship between user agents (e.g., browsers), accessibility APIs, and assistive technologies. It describes the "contract" provided by the user agent to assistive technologies, which includes typical accessibility information found in the accessibility API for many of our accessible platforms for GUIs (role, state, selection, event notification, relationship information, and descriptions). The DOM, usually HTML, acts as the data model and view in a typical model-view-controller relationship, and JavaScript acts as the controller by manipulating the style and content of the displayed data. The user agent conveys relevant information to the operating system's accessibility API, which can be used by any assistive technologies, such as screen readers.

    The contract model with accessibility APIs

    Figure 1: The contract model with accessibility APIs

    -

    For more information see WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.1]] for the use of roles in making interactive content accessible.

    -

    In addition to the prose documentation, the role taxonomy is provided in Web Ontology Language (OWL) [[OWL-FEATURES]], which is expressed in Resource Description Framework (RDF) [[RDF-CONCEPTS]]. Tools can use these to validate the implementation of roles in a given content document. For example, instances of some roles are expected to be children of a specific parent role. Also, some roles may support a specific state or property that another role does not support.

    -

    The use of RDF/OWL as a formal representation of roles may be used to support future extensibility. Standard RDF/OWL mechanisms can be used to define new roles that inherit from the roles defined in this specification. The mechanism to define and use role extensions in an interoperable manner, however, is not defined by this specification, and RDF/OWL processing is not essential to interoperable implementation of this specification. A future version of WAI-ARIA is expected to define how to extend roles.

    -

    Users of alternate input devices need keyboard accessible content. The new semantics, when combined with the recommended keyboard interactions provided in WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.1]], will allow alternate input solutions to facilitate command and control via an alternate input solution.

    -

    WAI-ARIA introduces navigational landmarks through its taxonomy and the XHTML role landmarks, which can help persons with dexterity and vision impairments by providing for improved keyboard navigation. WAI-ARIA may also be used to assist persons with cognitive learning disabilities. The additional semantics allow authors to restructure and substitute alternative content as needed.

    +

    For more information see WAI-ARIA Authoring Practices for the use of roles in making interactive content accessible.

    +

    Users of alternate input devices need keyboard accessible content. The new semantics, when combined with the recommended keyboard interactions provided in WAI-ARIA Authoring Practices, will allow alternate input solutions to facilitate command and control via an alternate input solution.

    +

    WAI-ARIA introduces navigational landmarks through its Roles Model and the XHTML role landmarks, which can help persons with dexterity and vision impairments by providing for improved keyboard navigation. WAI-ARIA may also be used to assist persons with cognitive learning disabilities. The additional semantics allow authors to restructure and substitute alternative content as needed.

    Assistive technologies need the ability to support alternative inputs by getting and setting the current value of widget states and properties. Assistive technologies also need to determine what objects are selected and manage widgets that allow multiple selections, such as list boxes and grids.

    Speech-based command and control systems can benefit from WAI-ARIA semantics like the role attribute to assist in conveying audio information to the user. For example, upon encountering an element with a role of menu with child elements of role menuitem each containing text content representing a different flavor, a speech system might state to the user, "Select one of three choices: chocolate, strawberry, or vanilla."

    WAI-ARIA is intended to be used as a supplement for native language semantics, not a replacement. When the host language provides a feature that provides equivalent accessibility to the WAI-ARIA feature, use the host language feature. WAI-ARIA should only be used in cases where the host language lacks the needed role, state, and property indicators. Use a host language feature that is as similar as possible to the WAI-ARIA feature, then refine the meaning by adding WAI-ARIA. For instance, a multi-selectable grid could be implemented as a table, and then WAI-ARIA used to clarify that it is an interactive grid, not just a static data table. This allows for the best possible fallback for user agents that do not support WAI-ARIA and preserves the integrity of the host language semantics.

    @@ -224,16 +214,16 @@

    Target Audience

    Each conformance requirement indicates the audience to which it applies.

    Although this specification is applicable to the above audiences, it is not specifically targeted to, nor is it intended to be the sole source of information for, any of these audiences. The following documents provide important supporting information:

    User Agent Support

    WAI-ARIA relies on user agent support for its features in two ways:

    Aside from using WAI-ARIA markup to improve what is exposed to accessibility APIs, user agents behave as they would natively. Assistive technologies react to the extra information in the accessibility API as they already do for the same information on non-web content. User agents that are not assistive technologies, however, need do nothing beyond providing appropriate updates to the accessibility API.

    @@ -242,11 +232,11 @@

    User Agent Support

    Co-Evolution of WAI-ARIA and Host Languages

    -

    WAI-ARIA is intended to augment semantics in supporting languages like [[HTML5]] and [[SVG2]], or to be used as an accessibility enhancement technology in other markup-based languages that do not explicitly include support for ARIA. It clarifies semantics to assistive technologies when authors create new types of objects, via style and script, that are not yet directly supported by the language of the page, because the invention of new types of objects is faster than standardized support for them appears in web languages.

    +

    WAI-ARIA is intended to augment semantics in supporting languages like [[HTML]] and [[SVG2]], or to be used as an accessibility enhancement technology in other markup-based languages that do not explicitly include support for ARIA. It clarifies semantics to assistive technologies when authors create new types of objects, via style and script, that are not yet directly supported by the language of the page, because the invention of new types of objects is faster than standardized support for them appears in web languages.

    It is not appropriate to create objects with style and script when the host language provides a semantic element for that type of object. While WAI-ARIA can improve the accessibility of these objects, accessibility is best provided by allowing the user agent to handle the object natively. For example, it's better to use an h1 element in HTML than to use the heading role on a div element.

    It is expected that, over time, host languages will evolve to provide semantics for objects that currently can only be declared with WAI-ARIA. This is natural and desirable, as one goal of WAI-ARIA is to help stimulate the emergence of more semantic and accessible markup. When native semantics for a given feature become available, it is appropriate for authors to use the native feature and stop using WAI-ARIA for that feature. Legacy content may continue to use WAI-ARIA, however, so the need for user agents to support WAI-ARIA remains.

    While specific features of WAI-ARIA may lose importance over time, the general possibility of WAI-ARIA to add semantics to web pages is expected to be a persistent need. Host languages may not implement all the semantics WAI-ARIA provides, and various host languages may implement different subsets of the features. New types of objects are continually being developed, and one goal of WAI-ARIA is to provide a way to make such objects accessible, because web authoring practices often advance faster than host language standards. In this way, WAI-ARIA and host languages both evolve together but at different rates.

    -

    Some host languages exist to create semantics for features other than the user interface. For example, SVG expresses the semantics behind production of graphical objects, not of user interface components that those objects may represent; XForms provides semantics for form controls and does not provide wider user interface features. Host languages such as these might, by design, not provide native semantics that map to WAI-ARIA features. In these cases, WAI-ARIA could be adopted as a long-term approach to add semantic information to user interface components.

    +

    Some host languages exist to create semantics for features other than the user interface. For example, SVG expresses the semantics behind production of graphical objects, not of user interface components that those objects may represent. Host languages might, by design, not provide native semantics that map to WAI-ARIA features. In these cases, WAI-ARIA could be adopted as a long-term approach to add semantic information to user interface components.

    Authoring Practices

    @@ -266,67 +256,13 @@

    Assistive Technologies

    While some assistive technologies interact with these accessibility APIs, others may access the content directly from the DOM. These technologies can restructure, simplify, style, or reflow the content to help a different set of users. Common use cases for these types of adaptations may be the aging population, persons with cognitive impairments, or persons in environments that interfere with use of their tools. For example, the availability of regional navigational landmarks may allow for a mobile device adaptation that shows only portions of the content at any one time based on its semantics. This could reduce the amount of information the user needs to process at any one time. In other situations it may be appropriate to replace a custom user interface control with something that is easier to navigate with a keyboard, or touch screen device.

    -
    -

    Using WAI-ARIA

    -

    Complex web applications become inaccessible when assistive technologies cannot determine the semantics behind portions of a document or when the user is unable to effectively navigate to all parts of it in a usable way (see WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.1]]). WAI-ARIA divides the semantics into roles (the type defining a user interface element) and states and properties supported by the roles.

    -

    Authors need to associate elements in the document to a WAI-ARIA role and the appropriate states and properties (aria-* attributes) during its life-cycle, unless the elements already have the appropriate implicit WAI-ARIA semantics for states and properties. In these instances the equivalent host language states and properties take precedence to avoid a conflict while the role attribute will take precedence over the implicit role of the host language element.

    -
    -

    WAI-ARIA Roles

    -

    A WAI-ARIA role is set on an element using a role attribute, similar to the role attribute defined in Role Attribute [[ROLE-ATTRIBUTE]].

    -
    <li role="menuitem">Open file…</li>
    -

    The roles defined in this specification include a collection of document landmarks and the WAI-ARIA role taxonomy.

    -

    The roles in this taxonomy and their expected behaviors are modeled using RDF/OWL [[OWL-FEATURES]]. Features of the role taxonomy provide the following information for each role:

    -
      -
    • an informative description of the role;
    • -
    • hierarchical information about related roles (e.g., a directory is a type of list);
    • -
    • context of the role (e.g., a listitem is contained inside a list);
    • -
    • references to related concepts in other specifications;
    • -
    • use of OWL to provide a type hierarchy allowing for semantic inheritance (similar to a class hierarchy); and
    • -
    • supported states and properties for each role (e.g., a checkbox supports being checked via aria-checked).
    • -
    -

    Attaching a role gives assistive technologies information about how to handle each element.

    -
    -
    -

    WAI-ARIA States and Properties

    -

    WAI-ARIA provides a collection of accessibility states and properties which are used to support platform accessibility APIs on various operating system platforms. Assistive technologies may access this information through an exposed user agent DOM or through a mapping to the platform accessibility API. When combined with roles, the user agent can supply the assistive technologies with user interface information to convey to the user at any time. Changes in states or properties will result in a notification to assistive technologies, which could alert the user that a change has occurred.

    -

    In the following example, a list item (html:li) has been used to create a checkable menu item, and JavaScript events will capture mouse and keyboard events to toggle the value of aria-checked. A role is used to make the behavior of this simple widget known to the user agent. Attributes that change with user actions (such as aria-checked) are defined in the states and properties section.

    -
    <li role="menuitemcheckbox" aria-checked="true">Sort by Last Modified</li>
    -

    Some accessibility states, called managed states, are controlled by the user agent. Examples of managed state include keyboard focus and selection. Managed states often have corresponding CSS pseudo-classes (such as :focus and ::selection) to define style changes. In contrast, the states in this specification are typically controlled by the author and are called unmanaged states. Some states are managed by the user agent, such as aria-posinset and aria-setsize, but the author can override them if the DOM is incomplete and would cause the user agent calculation to be incorrect. User agents map both managed and unmanaged states to the platform accessibility APIs.

    -

    Most modern user agents support CSS attribute selectors ([[CSS3-SELECTORS]]), and can allow the author to create UI changes based on WAI-ARIA attribute information, reducing the amount of scripts necessary to achieve equivalent functionality. In the following example, a CSS selector is used to determine whether or not the text is bold and an image of a check mark is shown, based on the value of the aria-checked attribute.

    -
    [aria-checked="true"] { font-weight: bold; }
    -[aria-checked="true"]::before { background-image: url(checked.gif); }
    -

    If CSS is not used to toggle the visual representation of the check mark, the author could include additional markup and scripts to manage an image that represents whether or not the menuitemcheckbox is checked.

    -
    <li role="menuitemcheckbox" aria-checked="true">
    -  <img src="checked.gif" role="presentation" alt="">
    -  <!-- note: additional scripts required to toggle image source -->
    -  Sort by Last Modified
    -</li>
    -
    -
    -

    Managing Focus

    -

    An application should always have an element with focus when in use, as applications require users to have a place to provide user input. Authors are advised to not destroy the element with focus or scroll it off-screen unless through user intervention. All interactive objects should be focusable. All parts of composite interactive controls need to be focusable or have a documented alternative method to achieve their function, such as a keyboard shortcut. Authors are advised to maintain an obvious, discoverable way, either through tabbing or other standard navigation techniques, for keyboard users to move the focus to any interactive element. See User Agent Accessibility Guidelines, Guideline 9 ([[UAAG10]], Guideline 9).

    -

    When using standard HTML and basic WAI-ARIA widgets, application developers can simply manipulate the tab order or use a script to create keyboard shortcuts to elements in the document. Use of more complex widgets requires the author to manage focus within them. SVG Tiny provides a similar navigation "ring" mechanism that by default follows document order and which should be implemented using system dependent input facilities (the TAB key on most desktop computers). SVG authors may place elements in the navigation order by manipulating the focusable attribute and they may dynamically specify the navigation order by modifying elements' navigation attributes.

    -

    WAI-ARIA includes a number of "managing container" widgets, also known as "composite" widgets. When appropriate, the container is responsible for tracking the last descendant that was active (the default is usually the first item in the container). It is essential that a container maintain a usable and consistent strategy when focus leaves a container and is then later refocused. While there may be exceptions, it is recommended that when a previously focused container is refocused, the active descendant be the same element as the active descendant when the container was last focused. Exceptions include cases where the contents of a container widget have changed, and widgets like a menubar where the user expects to always return to the first item when focus leaves the menu bar. For example, if the second item of a tree group was the active descendant when the user tabbed out of the tree group, then the second item of the tree group remains the active descendant when the tree group gets focus again. The user may also activate the container by clicking on one of the descendants within it.

    -

    When the container or its active descendant has focus, the user may navigate through the container by pressing additional keys, such as the arrow keys, to change the currently active descendant. Any additional press of the main navigation key (generally the TAB key) will move out of the container to the next widget.

    -

    For example, a grid may be used as a spreadsheet with thousands of gridcell elements, all of which may not be present in the document at one time. This requires focus to be managed by the container using the aria-activedescendant attribute on the managing container element, or by the container managing the tabindex of its child elements and setting focus on the appropriate child.

    -

    Content authors are required to manage focus on the following container roles:

    -
      -
    • combobox
    • -
    • grid
    • -
    • listbox
    • -
    • menu
    • -
    • menubar
    • -
    • radiogroup
    • -
    • tree
    • -
    • treegrid
    • -
    • tablist
    • -
    -

    More information on managing focus can be found in the Developing a Keyboard Interface section of the WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.1]].

    -
    +
    +

    Important Terms

    +
    -
    +

    Conformance

    -

    The main content of Graphics ARIA is normative and defines requirements that impact conformance claims. Introductory material, appendices, sections marked as "non-normative" and their subsections, diagrams, examples, and notes are informative (non-normative). Non-normative material provides advisory information to help interpret the guidelines but does not create requirements that impact a conformance claim.

    +

    The main content of Accessible Rich Internet Applications is normative and defines requirements that impact conformance claims. Introductory material, appendices, sections marked as "non-normative" and their subsections, diagrams, examples, and notes are informative (non-normative). Non-normative material provides advisory information to help interpret the guidelines but does not create requirements that impact a conformance claim.

    Normative sections provide requirements that user agents must follow for an implementation to conform to this specification. The keywords MUST, MUST NOT, REQUIRED, SHALL, SHALL NOT, SHOULD, RECOMMENDED, MAY, and OPTIONAL in this document are to be interpreted as described in Keywords for use in RFCs to indicate requirement levels [[!RFC2119]]. RFC-2119 keywords are formatted in uppercase and contained in an element with class="rfc2119". When the keywords shown above are used, but do not share this format, they do not convey formal information in the RFC 2119 sense, and are merely explanatory, i.e., informative. As much as possible, such usages are avoided in this specification.

    Normative sections provide requirements that authors, user agents and assistive technologies MUST follow for an implementation to conform to this specification.

    Non-normative (informative) sections provide information useful to understanding the specification. Such sections may contain examples of recommended practice, but it is not required to follow such recommendations in order to conform to this specification.

    @@ -355,167 +291,247 @@

    Deprecated Requirements

    As the technology evolves, sometimes new ways to meet a use case become available, that work better than a feature that was previously defined. But because of existing implementation of the older feature, that feature cannot be removed from the conformance model without rendering formerly conforming content non-conforming. In this case, the older feature is marked as "deprecated". This indicates that the feature is allowed in the conformance model and expected to be supported by user agents, but it is recommended that authors do not use it for new content. In future versions of the specification, if the feature is no longer widely used, the feature could be removed and no longer expected to be supported by user agents.

    -
    -

    Important Terms

    -
    +
    +

    Using WAI-ARIA

    +

    Complex web applications become inaccessible when assistive technologies cannot determine the semantics behind portions of a document or when the user is unable to effectively navigate to all parts of it in a usable way (see WAI-ARIA Authoring Practices). WAI-ARIA divides the semantics into roles (the type defining a user interface element) and states and properties supported by the roles.

    +

    Authors need to associate elements in the document to a WAI-ARIA role and the appropriate states and properties (aria-* attributes) during its life-cycle, unless the elements already have the appropriate implicit WAI-ARIA semantics for states and properties. In these instances the equivalent host language states and properties take precedence to avoid a conflict while the role attribute will take precedence over the implicit role of the host language element.

    +
    +

    WAI-ARIA Roles

    +

    A WAI-ARIA role is set on an element using a role attribute, similar to the role attribute defined in Role Attribute [[ROLE-ATTRIBUTE]].

    +
    <li role="menuitem">Open file…</li>
    +

    The definition of each role in the model provides the following information :

    +
      +
    • an informative description of the role;
    • +
    • hierarchical information about related roles (e.g., a searchbox is a type of textbox);
    • +
    • context of the role (e.g., a listitem is contained inside a list);
    • +
    • references to related concepts in other specifications;
    • +
    • supported states and properties for each role (e.g., a checkbox supports being checked via aria-checked).
    • +
    +

    Attaching a role gives assistive technologies information about how to handle each element. When WAI-ARIA roles override host language semantics, there are no changes in the DOM, only in the accessibility tree.

    +

    User agents MUST use the first token in the sequence of tokens in the role attribute value that matches the name of any non-abstract WAI-ARIA role. The following steps will correctly identify the applicable WAI-ARIA role:

    +
      +
    1. Use the rules of the host language to detect that an element has a role attribute and to identify the attribute value string for it.
    2. +
    3. Separate the attribute value string for that attribute into a sequence of whitespace-free substrings by separating on whitespace.
    4. +
    5. Compare the substrings to all the names of the non-abstract WAI-ARIA roles. Case-sensitivity of the comparison inherits from the case-sensitivity of the host language.
    6. +
    7. Use the first such substring in textual order that matches the name of a non-abstract WAI-ARIA role.
    8. +
    +
    +
    +

    WAI-ARIA States and Properties

    +

    WAI-ARIA provides a collection of accessibility states and properties which are used to support platform accessibility APIs on various operating system platforms. Assistive technologies may access this information through an exposed user agent DOM or through a mapping to the platform accessibility API. When combined with roles, the user agent can supply the assistive technologies with user interface information to convey to the user at any time. Changes in states or properties will result in a notification to assistive technologies, which could alert the user that a change has occurred.

    +

    In the following example, a list item (html:li) has been used to create a checkable menu item, and JavaScript events will capture mouse and keyboard events to toggle the value of aria-checked. A role is used to make the behavior of this simple widget known to the user agent. Attributes that change with user actions (such as aria-checked) are defined in the states and properties section.

    +
    <li role="menuitemcheckbox" aria-checked="true">Sort by Last Modified</li>
    +

    Some accessibility states, called managed states, are controlled by the user agent. Examples of managed state include keyboard focus and selection. Managed states often have corresponding CSS pseudo-classes (such as :focus and ::selection) to define style changes. In contrast, the states in this specification are typically controlled by the author and are called unmanaged states. Some states are managed by the user agent, such as aria-posinset and aria-setsize, but the author can override them if the DOM is incomplete and would cause the user agent calculation to be incorrect. User agents map both managed and unmanaged states to the platform accessibility APIs.

    +

    Most modern user agents support CSS attribute selectors ([[CSS3-SELECTORS]]), and can allow the author to create UI changes based on WAI-ARIA attribute information, reducing the amount of scripts necessary to achieve equivalent functionality. In the following example, a CSS selector is used to determine whether or not the text is bold and an image of a check mark is shown, based on the value of the aria-checked attribute.

    +
    [aria-checked="true"] { font-weight: bold; }
    +[aria-checked="true"]::before { background-image: url(checked.gif); }
    +

    If CSS is not used to toggle the visual representation of the check mark, the author could include additional markup and scripts to manage an image that represents whether or not the menuitemcheckbox is checked.

    +
    <li role="menuitemcheckbox" aria-checked="true">
    +  <img src="checked.gif" role="presentation" alt="">
    +  <!-- note: additional scripts required to toggle image source -->
    +  Sort by Last Modified
    +</li>
    +
    +
    +

    Managing Focus and Supporting Keyboard Navigation

    +

    When using standard HTML interactive elements and simple WAI-ARIA widgets, application developers can manipulate the tab order or associate keyboard shortcuts with elements in the document.

    +

    WAI-ARIA includes a number of "managing container" widgets, also known as "composite" widgets. When appropriate, the container is responsible for tracking the last descendant that was active (the default is usually the first item in the container). It is essential that a container maintain a usable and consistent strategy when focus leaves a container and is then later refocused. While there may be exceptions, it is recommended that when a previously focused container is refocused, the active descendant be the same element as the active descendant when the container was last focused. Exceptions include cases where the contents of a container widget have changed, and widgets like a menubar where the user expects to always return to the first item when focus leaves the menu bar. For example, if the second item of a tree group was the active descendant when the user tabbed out of the tree group, then the second item of the tree group remains the active descendant when the tree group gets focus again. The user may also activate the container by clicking on one of the descendants within it. When the container or its active descendant has focus, the user may navigate through the container by pressing additional keys, such as the arrow keys, to change the currently active descendant. Any additional press of the main navigation key (generally the TAB key) will move out of the container to the next widget.

    +

    Usable keyboard navigation in a rich internet application is different from the tabbing paradigm among interactive elements, such as links and form controls, in a static document. In rich internet applications, the user tabs to significantly complex widgets, such as a menu or spreadsheet, and uses the arrow keys to navigate within the widget. The changes that WAI-ARIA introduces to keyboard navigation make this enhanced accessibility possible. In WAI-ARIA, any element can be keyboard focusable. In addition to host language mechanisms such as tabindex, aria-activedescendant provides another mechanism for keyboard operation. Most other aspects of WAI-ARIA widget development depend on keyboard navigation functioning properly.

    +

    + When implementing aria-activedescendant as described below, the user agent keeps the DOM focus on the container element or on an input element that controls the container element. + However, the user agent communicates desktop focus events and states to the assistive technology as if the element referenced by aria-activedescendant has focus. + User agents are not expected to validate that the active descendant is a descendant of the container element. + It is the responsibility of the user agent to ensure that keyboard events are processed at the element that has DOM focus. + Any keyboard events directed at the active descendant bubble up to the DOM element with focus for processing. +

    +
    +

    Information for Authors

    +

    If the author removes the element with focus, the author SHOULD move focus to a logical element. Similarly, authors SHOULD not scroll the element with focus off screen unless the user performed a scrolling action.

    +

    Authors SHOULD ensure that all interactive elements are focusable and that all parts of composite widgets are either focusable or have a documented alternative method to achieve their function.

    +

    Authors MUST manage focus on the following container roles:

    +
      +
    • grid
    • +
    • listbox
    • +
    • menu
    • +
    • menubar
    • +
    • radiogroup
    • +
    • tree
    • +
    • treegrid
    • +
    • tablist
    • +
    +

    User agents that support WAI-ARIA expand the usage of host language mechanisms such as tabindex, focus, and blur to allow them on all elements. Where the host language supports it, authors MAY add any element such as a div, span, or img to the default tab order by setting tabindex="0". In addition, any item with tabindex equal to a negative integer is focusable via script or a mouse click, but is not part of the default tab order. This is supported in both [[HTML]] and [[SVG2]].

    +

    + Authors MAY use aria-activedescendant to inform assistive technologies which descendant of a widget element is treated as having keyboard focus in the user interface if the role of the widget element supports aria-activedescendant. + This is often a more convenient way of providing keyboard navigation within widgets, such as a listbox, where the widget occupies only one stop in the page Tab sequence and other keys, typically arrow keys, are used to focus elements inside the widget. +

    +

    Typically, the author will use host language semantics to put the widget in the Tab sequence (e.g., tabindex="0" in HTML) and aria-activedescendant to point to the ID of the currently active descendant. The author, not the user agent, is responsible for styling the currently active descendant to show it has keyboard focus. The author cannot use :focus to style the currently active descendant since the actual focus is on the container.

    +

    More information on managing focus can be found in the Developing a Keyboard Interface section of the WAI-ARIA Authoring Practices.

    +
    +
    +

    Information for User Agents

    +

    The user agent MUST do the following to implement aria-activedescendant:

    +
      +
    1. Implement the host language method for keyboard navigation so that widgets that support aria-activedescendant may be included in the tab order.
    2. +
    3. For platforms that expose desktop focus or accessibility API focus separately from DOM focus, do not expose the focused state in the accessibility API for any element when it has DOM focus and also has aria-activedescendant which points to a valid ID reference.
    4. +
    5. When the aria-activedescendant attribute changes on an element that currently has DOM focus, remove the focused state from the previously focused object and fire an accessibility API desktop focus event on the new element referenced by aria-activedescendant. If aria-activedescendant is cleared or does not point to an element in the current document, fire a desktop focus event for the object that had the attribute change.
    6. +
    7. Apply the following accessibility API states to any element with an ID attribute that can be referenced by an element with both an aria-activedescendant attribute and has DOM focus. There are two ways an element can be referenced by aria-activedescendant. One way is when it is owned by an element with aria-activedescendant and the other is when it is owned by an element that is controlled by an element with role of combobox, textbox or searchbox with an aria-activedescendant attribute: +
        +
      1. Focusable, if the element also has a WAI-ARIA role. The element needs to be focusable because it could be referenced by the aria-activedescendant attribute. Native elements that have no role attribute do not need to be checked; their native semantics determine the focusable state.
      2. +
      3. Focused, whenever the element is the target of the aria-activedescendant attribute and the element with the aria-activedescendant attribute has DOM focus.
      4. +
      +
    8. +
    +

    When an assistive technology uses its platform's accessibility API to request a change of focus, user agents MUST do the following:

    +
      +
    1. Remove the platform's focused state from the previously focused object.
    2. +
    3. Set the DOM focus: +
        +
      1. If the element can take DOM focus, the user agent MUST set the DOM focus to it.
      2. +
      3. Otherwise, if the current element has an ID and the ID is referenced by the aria-activedescendant attribute of an element that is focusable, the user agent MUST set DOM focus to the element that has the aria-activedescendant attribute. +

        An element with an ID can be referenced when it is owned by a container element that has the aria-activedescendant attribute or by a container element that is controlled by an element that has the aria-activedescendant attribute (e.g. see combobox). Otherwise the aria-activedescendant attribute reference indicates an author error.

        +

        The inability to set DOM focus to the containing element indicates an author error.

        +
      4. +
      5. Otherwise, the user agent MAY attempt to set DOM focus to the child element itself.
      6. +
      +
    4. +
    5. If the current element has an ID and is owned by either a container element with both an aria-activedescendant attribute and has DOM focus, or by a container element that is controlled by an element with both an aria-activedescendant attribute and has DOM focus, the user agent MUST set the accessibility API focused state and fire an accessibility API focus event on the element identified by the value of aria-activedescendant.
    6. +
    +
    +

    The Roles Model

    -

    This section defines the WAI-ARIA role taxonomy and describes the characteristics and properties of all roles. A formal RDF/OWL representation of all the information presented here is available in Schemata Appendix.

    -

    The roles, their characteristics, the states and properties they support, and specification of how they may be used in markup, shall be considered normative. The RDF/OWL representation used to model the taxonomy shall be considered informative. The RDF/OWL taxonomy may be used as a vehicle to extend WAI-ARIA in the future or by tool manufacturers to validate states and properties applicable to roles per this specification.

    -

    Roles are element types and authors MUST NOT change role values over time or with user actions. Authors wishing to change a role MUST do so by deleting the associated element and its children and replacing it with a new element with the appropriate role. Typically, platform accessibility APIs do not provide a vehicle to notify assistive technologies of a role value change, and consequently, assistive technologies may not update their cache with the new role attribute value.

    +

    This section defines WAI-ARIA roles and describes their characteristics and properties.

    +

    The roles, their characteristics, the states and properties they support, and specification of how they may be used in markup, shall be considered normative.

    In order to reflect the content in the DOM, user agents SHOULD map the role attribute to the appropriate value in the implemented accessibility API, and user agents SHOULD update the mapping when the role attribute changes.

    Relationships Between Concepts

    -

    The role taxonomy uses the following relationships to relate WAI-ARIA roles to each other and to concepts from other specifications, such as HTML and XForms.

    +

    The Roles Model uses the following relationships to relate WAI-ARIA roles to each other and to concepts from other specifications, such as HTML.

    Superclass Role

    -

    Inheritance is expressed in RDF using the RDF Schema 1.1 subClassOf ([[RDF-SCHEMA]]) property.

    -
    -
    RDF Property
    -
    rdfs:subClassOf
    -
    -

    The role that the current subclassed role extends in the taxonomy. This extension causes all the properties and constraints of the superclass role to propagate to the subclass role. Other than well known stable specifications, inheritance may be restricted to items defined inside this specification, so that external items cannot be changed and affect inherited classes.

    +

    The role that the current subclassed role extends in the Roles Model. This extension causes all the properties and constraints of the superclass role to propagate to the subclass role. Other than well known stable specifications, inheritance may be restricted to items defined inside this specification, so that external items cannot be changed and affect inherited classes.

    Subclass Roles

    -
    -
    RDF Property
    -
    <none>
    -

    Informative list of roles for which this role is the superclass. This is provided to facilitate reading of the specification but adds no new information.

    Related Concepts

    -
    -
    RDF Property
    -
    role:relatedConcept
    -

    Informative data about a similar or related idea from other specifications. Concepts that are related are not necessarily identical. Related concepts do not inherit properties from each other. Hence if the definition of one concept changes, the properties, behavior, and definition of its related concept is not affected.

    -

    For example, a progress bar is like a status indicator. Therefore, the progressbar widget has a relatedConcept value which includes status. However, if the definition of status is modified, the definition of a progressbar is not affected.

    +

    For example, a progress bar is like a status indicator. Therefore, the progressbar widget has a related concept which includes status. However, if the definition of status is modified, the definition of a progressbar is not affected.

    Base Concept

    -
    -
    RDF Property
    -
    role:baseConcept
    -

    Informative data about objects that are considered prototypes for the role. Base concept is similar to type, but without inheritance of limitations and properties. Base concepts are designed as a substitute for inheritance for external concepts. A base concept is like a related concept except that the base concept is almost identical to the role definition.

    -

    For example, the checkbox defined in this document has similar functionality and anticipated behavior to a checkbox defined in HTML. Therefore, a checkbox has an HTML checkbox as a baseConcept. However, if the original HTML checkbox baseConcept definition is modified, the definition of a checkbox in this document will not be affected, because there is no actual inheritance of the respective type.

    +

    For example, the checkbox defined in this document has similar functionality and anticipated behavior to a <input[type="checkbox"]> defined in [[HTML]]. Therefore, a checkbox has an [[HTML]] checkbox as a baseConcept. However, if the original [[HTML]] checkbox baseConcept definition is modified, the definition of a checkbox in this document will not be affected, because there is no actual inheritance of the respective type.

    Characteristics of Roles

    -

    Roles are defined and described by their characteristics. Characteristics define the structural function of a role, such as what a role is, concepts behind it, and what instances the role can or must contain. In the case of widgets this also includes how it interacts with the user agent based on mapping to HTML forms and XForms. States and properties from WAI-ARIA that are supported by the role are also indicated.

    -

    The roles taxonomy defines the following characteristics. These characteristics are implemented in RDF as properties of the OWL classes that describe the roles.

    +

    Roles are defined and described by their characteristics. Characteristics define the structural function of a role, such as what a role is, concepts behind it, and what instances the role can or must contain. In the case of widgets this also includes how it interacts with the user agent based on mapping to HTML forms. States and properties from WAI-ARIA that are supported by the role are also indicated.

    +

    Roles define the following characteristics.

    Abstract Roles

    -
    RDF Property
    -
    N/A
    -
    Values
    -
    Boolean
    -
    +
    Values
    +
    Boolean
    +

    Abstract roles are the foundation upon which all other WAI-ARIA roles are built. Content authors MUST NOT use abstract roles because they are not implemented in the API binding. User agents MUST NOT map abstract roles to the standard role mechanism of the accessibility API. Abstract roles are provided to help with the following:

      -
    1. Organize the role taxonomy and provide roles with a meaning in the context of known concepts.
    2. +
    3. Organize the Roles Model and provide roles with a meaning in the context of known concepts.
    4. Streamline the addition of roles that include necessary features.

    Required States and Properties

    -
    -
    RDF Property
    -
    role:requiredState
    -
    Values
    -
    Any valid RDF object reference, such as a URI.
    -

    States and properties specifically required for the role and subclass roles. Content authors MUST provide a non-empty value for required states and properties. Content authors MUST NOT use the value undefined for required states and properties, unless undefined is an explicitly-supported value of that state or property.

    When an object inherits from multiple ancestors and one ancestor indicates that property is supported while another ancestor indicates that it is required, the property is required in the inheriting object.

    A host language attribute with the appropriate implicit WAI-ARIA semantic fulfills this requirement.

    Supported States and Properties

    -
    -
    RDF Property
    -
    role:supportedState
    -
    Values
    -
    Any valid RDF object reference, such as a URI.
    -
    -

    States and properties specifically applicable to the role and child roles. User agents MUST map all supported states and properties for the role to an accessibility API. Content authors MAY provide values for supported states and properties, but need not in some cases where default values are sufficient.

    +

    States and properties specifically applicable to the role and child roles. Content authors MAY provide values for supported states and properties, but need not in cases where default values are sufficient. User agents MUST map all supported states and properties for the role to an accessibility API. If the state or property is undefined and it has a default value for the role, user agents SHOULD expose the default value.

    A host language attribute with the appropriate implicit WAI-ARIA semantic fulfills this requirement.

    Inherited States and Properties

    -

    Informative list of properties that are inherited onto a role from superclass roles. States and properties are inherited from superclass roles in the role taxonomy, not from ancestor elements in the DOM tree. These properties are not explicitly defined on the role, as the inheritance of properties is automatic. This information is provided to facilitate reading of the specification. The set of supported states and properties combined with inherited states and properties forms the full set of states and properties supported by the role.

    +

    Informative list of properties that are inherited by a role from superclass roles. States and properties are inherited from superclass roles in the Roles Model, not from ancestor elements in the DOM tree. These properties are not explicitly defined on the role, as the inheritance of properties is automatic. This information is provided to facilitate reading of the specification. The set of supported states and properties combined with inherited states and properties forms the full set of states and properties supported by the role.

    +
    +

    Prohibited States and Properties

    +

    List of states and properties that are prohibited on a role. Authors MUST NOT specify a prohibited state or property.

    +

    A host language attribute with the appropriate implicit WAI-ARIA semantic would also prohibit a state or property in this section.

    +

    Required Owned Elements

    -
    -
    RDF Property
    -
    role:mustContain
    -
    Values
    -
    Any valid RDF object reference, such as a URI.
    -
    -

    Any element that will be owned by the element with this role. For example, an element with the role list will own at least one element with the role group or listitem.

    -

    When multiple roles are specified as required owned elements for a role, at least one instance of one required owned element is expected. This specification does not require an instance of each of the listed owned roles. For example, a menu should have at least one instance of a menuitem, menuitemcheckbox, or menuitemradio. The menu role does not require one instance of each.

    -

    There may be times that required owned elements are missing, for example, while editing or while loading a data set. When a widget is missing required owned elements due to script execution or loading, authors MUST mark a containing element with aria-busy equal to true. For example, until a page is fully initialized and complete, an author could mark the document element as busy.

    +

    Any element that will be owned by the element with this role. For example, an element with the role list will own at least one element with the role listitem.

    +

    When multiple roles are specified as required owned elements for a role, at least one instance of one required owned element is expected. This specification does not require an instance of each of the listed owned roles. For example, a menu should have at least one instance of a menuitem, menuitemcheckbox, or menuitemradio. The menu role does not require one instance of each.

    +

    There may be times that required owned elements are missing, for example, while editing or while loading a data set. When a widget is missing required owned elements due to script execution or loading, authors MUST mark a containing element with aria-busy equal to true. For example, until a page is fully initialized and complete, an author could mark the document element as busy.

    A role that has 'required owned elements' does not imply the reverse relationship. While processing of a role may be incomplete without elements of given roles present as descendants, elements with roles in this list do not always have to be found within elements of the given role. See required context role for requirements about the context where elements of a given role will be contained.

    -

    An element with a subclass role of the 'required owned element' does not fulfill this requirement. For example, the list role requires ownership of an element using either the listitem or group role. Although the group role is the superclass of row, adding a owned element with a role of row will not fulfill the requirement that list must own a listitem or a group.

    +

    An element with a subclass role of the 'required owned element' does not fulfill this requirement. For example, the listbox role requires ownership of an element using the option or group role. Although the group role is the superclass of row, adding an owned element with a role of row will not fulfill the requirement that listbox owns an option or a group.

    An element with the appropriate implicit WAI-ARIA semantic fulfills this requirement.

    Required Context Role

    -
    -
    RDF Property
    -
    role:scope
    -
    Values
    -
    Any valid RDF object reference, such as a URI.
    -
    -

    The required context role defines the owning container where this role is allowed. If a role has a required context, authors MUST ensure that an element with the role is contained inside (or owned by) an element with the required context role. For example, an element with role listitem is only meaningful when contained inside (or owned by) an element with role list.

    +

    The required context role defines the owning container where this role is allowed. If a role has a required context, authors MUST ensure that an element with the role is contained inside (or owned by) an element with the required context role. For example, an element with role listitem is only meaningful when contained inside (or owned by) an element with role list.

    A role that has 'required context role' does not imply the reverse relationship. While an element with the given role needs to appear within an element of the listed role(s) in order to be meaningful, elements of the listed roles do not always need descendant elements of the given role in order to be meaningful. See required owned elements for requirements about elements that require presence of a given descendant to be processed properly.

    An element with the appropriate implicit WAI-ARIA semantic fulfills this requirement.

    Accessible Name Calculation

    -
    RDF Property
    -
    role:nameFrom
    Values
    One of the following values:
    1. author: name comes from values provided by the author in explicit markup features such as the aria-label attribute, the aria-labelledby attribute, or the host language labeling mechanism, such as the alt or title attributes in HTML, with HTML title attribute having the lowest precedence for specifying a text alternative.
    2. -
    3. contents: name comes from the text value of the element node. Although this may be allowed in addition to "author" in some roles, this is used in content only if higher priority "author" features are not provided. Priority is defined by the text alternative computation algorithm.
    4. +
    5. contents: name comes from the text value of the element node. Although this may be allowed in addition to "author" in some roles, this is used in content only if higher priority "author" features are not provided. Priority is defined by the accessible name and description computation algorithm [[ACCNAME-1.2]].
    6. +
    7. encapsulation: name comes from the text value of the element node with role label that is the closest ancestor. Although "encapsulation" may be allowed in addition to "author" and "contents" in some roles, "encapsulation" is used only if higher priority "author" features are not provided. Priority is defined by the accessible name and description computation algorithm.
    8. +
    9. legend: name comes from the text value of the first descendant element node with the role of legend. Although "legend" may be allowed in addition to "author" in some roles, "legend" is used in content only if higher priority "author" features are not provided. Priority is defined by the accessible name and description computation algorithm.
    10. +
    11. prohibited: the element has no name. Authors MUST NOT use the aria-label or aria-labelledby attributes to name the element.

    Name Computation

    -

    Name Computation is defined in the Accessible Name and Description specification [[ACCNAME-AAM-1.1]].

    +

    Name Computation is defined in the Accessible Name and Description specification.

    Description Computation

    -

    Description Computation is defined in the Accessible Name and Description specification [[ACCNAME-AAM-1.1]].

    +

    Description Computation is defined in the Accessible Name and Description specification.

    -

    Text Alternative Computation

    -

    Text Alternative Computation is defined in the Accessible Name and Description specification [[ACCNAME-AAM-1.1]].

    +

    Accessible Name and Description Computation

    +

    Accessible Name and Description Computation is defined in the Accessible Name and Description specification.

    Roles Supporting Name from Author

    -

    All roles support name from author with two exceptions. The roles that do not support name from author are presentation and none.

    -
    +
    +
    +

    Roles Supporting Name from Content

    +
    +
    +
    +

    Roles Supporting Name from Encapsulation

    +
    +
    +
    +
    +

    Roles Supporting Name from Legend

    +
    +
    +
    +
    +

    Roles which cannot be named (Name prohibited)

    +

    Presentational Children

    -
    RDF Property
    -
    role:childrenArePresentational
    Values

    Boolean (true | false)

    @@ -525,16 +541,13 @@

    Presentational Children

    Implicit Value for Role

    -

    Many states and properties have default values. Occasionally, the default value when used on a given role should be different from the usual default. Roles that require a state or property to have a non-standard default value indicate this in the "Implicit Value for Role". This is expressed in the form "state or property name is new default value". Roles that define this have the new default value for the state or property if the author does not provide an explicit value.

    +

    Many states and properties have default values. Occasionally, the default value when used on a given role should be different from the usual default. Roles that require a state or property to have a non-standard default value indicate this in the "Implicit Value for Role". This is expressed in the form "Default for state or property name is new default value". Roles that define this have the new default value for the state or property if the author does not provide an explicit value.

    Categorization of Roles

    To support the current user scenario, this specification categorizes roles that define user interface widgets (sliders, tree controls, etc.) and those that define page structure (sections, navigation, etc.). Note that some assistive technologies provide special modes of interaction for regions marked with role application or document.

    -
    Class diagram of the relationships described in the role data model -

    Class diagram of the relationships described in the role data model.

    -

    SVG class diagram | PNG class diagram | Class diagram description

    -
    +

    A visual description of the relationships among roles is available in the ARIA 1.2 Class Diagram.

    Roles are categorized as follows:

    1. Abstract Roles
    2. @@ -546,7 +559,7 @@

      Categorization of Roles

    Abstract Roles

    -

    The following roles are used to support the WAI-ARIA role taxonomy for the purpose of defining general role concepts.

    +

    The following roles are used to support the WAI-ARIA Roles Model for the purpose of defining general role concepts.

    Abstract roles are used for the ontology. Authors MUST NOT use abstract roles in content.

    • command
    • @@ -607,26 +620,38 @@

      Widget Roles

    -

    Document Structure

    +

    Document Structure Roles

    The following roles describe structures that organize content in a page. Document structures are not usually interactive.

    • application
    • article
    • +
    • associationlist
    • +
    • associationlistitemkey
    • +
    • associationlistitemvalue
    • blockquote
    • caption
    • cell
    • columnheader
    • +
    • comment
    • definition
    • +
    • deletion
    • directory
    • document
    • +
    • emphasis
    • feed
    • figure
    • +
    • generic
    • group
    • heading
    • img
    • +
    • insertion
    • +
    • label
    • +
    • legend
    • list
    • listitem
    • +
    • mark
    • math
    • +
    • meter
    • none
    • note
    • paragraph
    • @@ -635,8 +660,13 @@

      Document Structure

    • rowgroup
    • rowheader
    • separator (when not focusable)
    • +
    • strong
    • +
    • subscript
    • +
    • suggestion
    • +
    • superscript
    • table
    • term
    • +
    • time
    • @@ -1143,7 +1454,7 @@

      Definition of Roles

      Related Concepts: - HTML blockquote + <blockquote> in [[HTML]] Required Context Role: @@ -1218,15 +1529,12 @@

      Definition of Roles

      Base Concept: - HTML button + <button> in [[HTML]] Related Concepts: - + link @@ -1245,6 +1553,8 @@

      Definition of Roles

      Supported States and Properties:
        +
      • aria-disabled
      • +
      • aria-haspopup
      • aria-expanded
      • aria-pressed
      @@ -1285,8 +1595,26 @@

      Definition of Roles

      caption
      -

      On-screen descriptive text for a figure or table in the page.

      -

      Authors SHOULD reference the element with role caption by setting aria-describedby on the figure or table.

      +

      Visible content that names, and may also describe, a figure, table, grid, or treegrid.

      +

      When using caption authors SHOULD ensure:

      +
        +
      • The caption is a direct child of a figure, table, grid, or treegrid.
      • +
      • The caption is the first child of a table, grid, or treegrid.
      • +
      • The caption is the first or last child of a figure.
      • +
      +

      Authors SHOULD set aria-labelledby on the parent figure, table, grid, or treegrid to reference the element with role caption. However, if a caption contains content that serves as both a name and description for its parent, authors MAY instead set aria-labelledby to reference an element within the caption that contains a concise name, and set aria-describedby to reference an element within the caption that contains the descriptive content.

      + +
      +					<div role="table" aria-labelledby="name" aria-describedby="desc">
      +				    <div role="caption">
      +				      <div id="name">Contest Entrants</div>
      +				      <div id="desc">
      +				        This table shows the total number of entrants (500) the
      +				        contest accepted over the past four weeks.
      +				      </div>
      +				    </div>
      +				    <!-- ... -->
      +				
      @@ -1315,11 +1643,18 @@

      Definition of Roles

      - + - + @@ -1337,9 +1672,18 @@

      Definition of Roles

      + + + + - + @@ -1389,7 +1733,7 @@

      Definition of Roles

      - + @@ -1412,8 +1756,10 @@

      Definition of Roles

      @@ -1485,7 +1831,7 @@

      Definition of Roles

      @@ -1510,7 +1856,11 @@

      Definition of Roles

      @@ -1523,6 +1873,7 @@

      Definition of Roles

      @@ -1543,10 +1894,105 @@

      Definition of Roles

      - - - - + + + + + +
      Characteristics:
      Related Concepts:
      Required Context Role:  +
        +
      • figure
      • +
      • grid
      • +
      • table
      • +
      • treegrid
      • +
      +
      Required Owned Elements: Inherited States and Properties: Placeholder
      Prohibited States and Properties: +
        +
      • aria-label
      • +
      • aria-labelledby
      • +
      +
      Name From:authorprohibited
      Accessible Name Required:
      Base Concept:HTML td<td> in [[HTML]]
      Related Concepts:
      • aria-colindex
      • +
      • aria-colindextext
      • aria-colspan
      • aria-rowindex
      • +
      • aria-rowindextext
      • aria-rowspan
      Related Concepts: Supported States and Properties:
        +
      • aria-errormessage
      • +
      • aria-expanded
      • +
      • aria-invalid
      • aria-readonly
      • +
      • aria-required
      • contents
      • +
      • encapsulation
      • author
      Inherits Presentational:  
      Implicit Value for Role:Default for aria-checked is false.
      Implicit Value for Role:
      +
      +
      + code +
      +

      A section whose content represents a fragment of computer code.

      +

      The primary purpose of the code role is to inform assistive technologies that the content is computer code and thus may require special presentation, in particular with respect to synthesized speech. More specifically, screen readers and other tools which provide text-to-speech presentation of content SHOULD prefer full punctuation verbosity to ensure common symbols (e.g. "-") are spoken.

      +
      + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Characteristics:
      CharacteristicValue
      Is Abstract: 
      Superclass Role: + section +
      Subclass Roles:Placeholder
      Base Concept: 
      Related Concepts:
      Required Context Role: 
      Required Owned Elements:
      Required States and Properties:
      Supported States and Properties:
      Inherited States and Properties:Placeholder
      Prohibited States and Properties: +
        +
      • aria-label
      • +
      • aria-labelledby
      • +
      +
      Name From:prohibited
      Accessible Name Required:
      Inherits Name Required: 
      Children Presentational: 
      Inherits Presentational: 
      Implicit Value for Role:
      @@ -1556,10 +2002,11 @@

      Definition of Roles

      A cell containing header information for a column.

      columnheader can be used as a column header in a table or grid. It could also be used in a pie chart to show a similar relationship in the data.

      The columnheader establishes a relationship between it and all cells in the corresponding column. It is the structural equivalent to an HTML th element with a column scope.

      -

      Authors MUST ensure elements with role columnheader are contained in, or owned by, an element with the role row.

      +

      Authors MUST ensure elements with role columnheader are contained in, or owned by, an element with the role row.

      Applying the aria-selected state on a columnheader MUST not cause the user agent to automatically propagate the aria-selected state to all the cells in the corresponding column. An author MAY choose to propagate selection in this manner depending on the specific application.

      While the columnheader role can be used in both interactive grids and non-interactive tables, the use of aria-readonly and aria-required is only applicable to interactive elements. Therefore, authors SHOULD NOT use aria-required or aria-readonly in a columnheader that descends from a table, and user agents SHOULD NOT expose either property to assistive technologies unless the columnheader descends from a grid.

      Because cells are organized into rows, there is not a single container element for the column. The column is the set of gridcell elements in a particular position within their respective row containers.

      +

      While aria-disabled is currently supported on columnheader, in a future version the working group plans to prohibit its use on elements with role columnheader except when the element is in the context of a grid or treegrid.

      @@ -1590,7 +2037,7 @@

      Definition of Roles

      - + @@ -1647,24 +2094,69 @@

      Definition of Roles

      combobox
      -

      A composite widget containing a single-line textbox and another element, such as a listbox or grid, that can dynamically pop up to help the user set the value of the textbox.

      -

      Authors MUST ensure an element with role combobox contains or owns a text input element with role textbox or searchbox and that the text input has aria-multiline set to false. If the combobox provides autocompletion behavior for the text input as described in aria-autocomplete, authors MUST set aria-autocomplete on the textbox element to the value that corresponds to the provided behavior.

      -

      Typically, the default state of a combobox is collapsed. In the collapsed state, only the textbox element of a combobox is visible. A combobox is said to be expanded when both the textbox and a secondary element that serves as its popup are visible. Authors MUST set aria-expanded to true on an element with role combobox when it is expanded and false when it is collapsed. Elements with the role combobox have an implicit aria-expanded value of false.

      -

      When a combobox is expanded, authors MUST ensure it contains or owns an element that has a role of listbox, tree, grid, or dialog. This element is the combobox popup. When the combobox is expanded, authors MUST set aria-controls on the textbox element to a value that refers to the combobox popup element.

      -

      Elements with the role combobox have an implicit aria-haspopup value of listbox. If the combobox popup element has a role other than listbox, authors MUST specify a value for aria-haspopup that corresponds to the type of its popup.

      -

      To be keyboard accessible, authors SHOULD manage focus of descendants for all instances of this role, as described in Managing Focus. When a combobox receives focus, authors SHOULD ensure focus is placed on the textbox element.

      -

      Authors SHOULD provide keyboard mechanisms for moving focus between the textbox element and the elements contained in the popup. For example, one common convention is that Down Arrow moves focus from the text input to the first focusable descendant of the popup element. If the popup element supports aria-activedescendant, in lieu of moving focus, such keyboard mechanisms can control the value of aria-activedescendant on the textbox element. When a descendant of the popup element is active, authors MAY set aria-activedescendant on the textbox to a value that refers to the active element within the popup while focus remains on the textbox element.

      +

      An input that controls another element, such as a listbox or grid, that can dynamically pop up to help the user set the value of the input.

      +

      + The Guidance for combobox has changed significantly in ARIA 1.2 due to problems with implementation of the previous patterns. + Authors and developers of User Agents, Assistive Technologies, and Conformance Checkers are advised to review this section carefully to understand the changes. + Explanation of the changes is available in the ARIA repository wiki. +

      +

      + A combobox functionally combines a named input field with the ability to assist value selection via a supplementary popup element. + A combobox input MAY be either a single-line text field that supports editing and typing or an element that only displays the current value of the combobox. + If the combobox supports text input and provides autocompletion behavior as described in aria-autocomplete, authors MUST set aria-autocomplete on the combobox element to the value that corresponds to the provided behavior. +

      +

      + Typically, the initial state of a combobox is collapsed. + In the collapsed state, only the combobox element and a separate, optional popup control button are visible. + A combobox is said to be expanded when both the combobox element showing its current value and its associated popup element are visible. + Authors MUST set aria-expanded to true on an element with role combobox when it is expanded and false when it is collapsed. +

      +

      + Authors MUST ensure the popup element associated with a combobox has a role of listbox, tree, grid, or dialog. + Authors MUST set aria-controls on a combobox element to a value that refers to the combobox popup element. +

      +

      + Elements with the role combobox have an implicit aria-haspopup value of listbox. + If the combobox popup element has a role other than listbox, authors MUST specify a value for aria-haspopup that corresponds to the role of its popup. +

      +

      + If the user interface includes an additional icon that allows the visibility of the popup to be controlled via pointer and touch events, authors SHOULD ensure that element has role button, that it is focusable but not included in the page Tab sequence, and that it is not a descendant of the element with role combobox. + In addition, to be keyboard accessible, authors SHOULD provide keyboard mechanisms for moving focus between the combobox element and elements contained in the popup. + For example, one common convention is that Down Arrow moves focus from the input to the first focusable descendant of the popup element. + If the popup element supports aria-activedescendant, in lieu of moving focus, such keyboard mechanisms can control the value of aria-activedescendant on the combobox element. + When a descendant of the popup element is active, authors MAY set aria-activedescendant on the combobox to a value that refers to the active element within the popup while focus remains on the combobox element. +

      +

      + User agents MUST expose the value of elements with role combobox to assistive technologies. + The value of a combobox is represented by one of the following: +

      +
        +
      • If the combobox element is a host language element that provides a value, such as an HTML input element, the value of the combobox is the value of that element.
      • +
      • Otherwise, the value of the combobox is represented by its descendant elements and can be determined using the same method used to compute the name of a button from its descendant content.
      • +
      -				  <div aria-label="Tag" role="combobox" aria-expanded="true" aria-owns="owned_listbox" aria-haspopup="listbox">
      -				      <input type="text" aria-autocomplete="list" aria-controls="owned_listbox" aria-activedescendant="selected_option">
      -				  </div>
      -				  <ul role="listbox" id="owned_listbox">
      -				      <li role="option">Zebra</li>
      -				      <li role="option" id="selected_option">Zoom</li>
      +          <label for="tag_combo">Tag</label>
      +		      <input type="text" id="tag_combo"
      +            role="combobox" aria-autocomplete="list"
      +            aria-haspopup="listbox" aria-expanded="true"
      +            aria-controls="popup_listbox" aria-activedescendant="selected_option">
      +				  <ul role="listbox" id="popup_listbox">
      +			      <li role="option">Zebra</li>
      +			      <li role="option" id="selected_option">Zoom</li>
       				  </ul>
       				
      -

      The ARIA 1.0 specification describes a combobox pattern where a text input element has the combobox role and owns a listbox element. User agents, assistive technologies, and conformance checkers SHOULD continue to support the ARIA 1.0 pattern so that existing implementations of the ARIA 1.0 pattern remain functional.

      -

      The features and behaviors of combobox implementations vary widely. Consequently, there are many important authoring considerations. See the WAI-ARIA Authoring Practices Guide [[WAI-ARIA-PRACTICES-1.1]] for additional details on implementing combobox design patterns.

      +

      + Please review the following carefully. As a result of these changes a combobox following the ARIA 1.1 combobox specification will no longer conform with the ARIA specification. +

      +
      +

      The structural requirements for combobox defined by this version of the specification are different from the requirements defined by ARIA 1.0 and ARIA 1.1:

      +
        +
      • The ARIA 1.0 specification required the input element with the combobox role to be a single-line text field and reference the popup element with aria-owns instead of aria-controls.
      • +
      • The ARIA 1.1 specification, which was not broadly supported by assistive technologies, required the combobox to be a non-focusable element with two required owned elements -- a focusable textbox and a popup element controlled by the textbox.
      • +
      • The changes introduced in ARIA 1.2 improve interoperability with assistive technologies and enable authors to create presentations of combobox that more closely imitate a native HTML select element.
      • +
      +
      +

      The features and behaviors of combobox implementations vary widely. Consequently, there are many important authoring considerations. See the WAI-ARIA Authoring Practices for additional details on implementing combobox design patterns.

      Characteristics:
      Base Concept:HTML th[scope="col"]<th[scope="col"]> in [[HTML]]
      Related Concepts:
      @@ -1681,7 +2173,7 @@

      Definition of Roles

      - + @@ -1694,10 +2186,7 @@

      Definition of Roles

      @@ -1706,19 +2195,11 @@

      Definition of Roles

      - - - - - + + + + @@ -1802,7 +2286,7 @@

      Definition of Roles

      - + @@ -1847,10 +2331,111 @@

      Definition of Roles

      Characteristics:
      Superclass Role:selectinput
      Subclass Roles:
      Related Concepts:
      Required Owned Elements: - textbox and, when expanded, one of: -
        -
      • listbox
      • -
      • tree
      • -
      • grid
      • -
      • dialog
      • -
      -
      Required States and Properties: +
      Required States and Properties:
      • aria-controls
      • aria-expanded
      • @@ -1729,7 +2210,11 @@

        Definition of Roles

      Supported States and Properties:
        +
      • aria-activedescendant
      • aria-autocomplete
      • +
      • aria-errormessage
      • +
      • aria-haspopup
      • +
      • aria-invalid
      • aria-readonly
      • aria-required
      @@ -1762,7 +2247,6 @@

      Definition of Roles

      Implicit Value for Role: - Default for aria-expanded is false.
      Default for aria-haspopup is listbox.
      Related Concepts:
      Required Context Role:
      +
      + comment +
      +

      A comment contains content expressing reaction to other content.

      +

      Comments can annotate any visible content, from small spans of text, to other comments, to entire articles. Authors SHOULD identify the relationships between comments and the commented content, as follows:

      +
        +
      1. If the comment is a reply to another comment: +
          +
        • If all ancestor comments are available in the DOM, make each reply comment a semantic descendant of the comment to which it is replying, either by making it a DOM descendant element or by using aria-owns.
        • +
        • Alternatively, if all ancestor comments are not in the DOM, such as when comments are paginated, the hierarchical + level MAY be indicated via aria-level. Additional group positional information MAY be indicated via aria-posinset and aria-setsize.
        • +
        +
      2. +
      3. Otherwise, if the comment relates to other content in the page: +
          +
        • Provide aria-details on the element containing the commented content with a value refering to the element with role comment.
        • +
        • If there are multiple comments related to the same commented content, either provide a value for aria-details on the commented content that refers to each individual comment, or use aria-details to refer to a parent container of the comments. If aria-details refers to an element containing comments rather than comment elements, authors SHOULD assign a role of group or region to the referenced container.
        • +
        +
      4. +
      +

      If the author has not explicitly declared aria-level, aria-posinset, or aria-setsize for a comment element, user agents MUST automatically compute the missing values and expose them to assistive technologies.

      +
      + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Characteristics:
      CharacteristicValue
      Is Abstract: 
      Superclass Role:article
      Base Concept: 
      Related Concepts:
      Required Context Role: 
      Required Owned Elements:
      Required States and Properties: 
      Supported States and Properties: +
        +
      • aria-level
      • +
      • aria-posinset
      • +
      • aria-setsize
      • +
      +
      Inherited States and Properties:Placeholder
      Name From: +
        +
      • contents
      • +
      • author
      • +
      +
      Accessible Name Required: 
      Inherits Name Required: 
      Children Presentational: 
      Inherits Presentational: 
      +
      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.

      +

      A landmark that is designed to be complementary to the main content at a similar level in the DOM hierarchy, but remaining meaningful when separated from the main content.

      There are various types of content that would appropriately have this role. For example, in the case of a portal, this may include but not be limited to show times, current weather, related articles, or stocks to watch. The complementary role indicates that contained content is relevant to the main content. If the complementary content is completely separable from the main content, it may be appropriate to use a more general role.

      User agents SHOULD treat elements with the role of complementary as navigational landmarks.

      @@ -1929,7 +2514,7 @@

      Definition of Roles

      composite
      -

      A widget that may contain navigable descendants or owned children.

      +

      A widget that may contain navigable descendants or owned children.

      Authors SHOULD ensure that a composite widget exists as a single navigation stop within the larger navigation system of the web page. Once the composite widget has focus, authors SHOULD provide a separate navigation mechanism for users to navigate to elements that are descendants or owned children of the composite element.

      composite is an abstract role used for the ontology. Authors should not use this role in content.

      @@ -1968,7 +2553,12 @@

      Definition of Roles

      Supported States and Properties: - aria-activedescendant + +
        +
      • aria-activedescendant
      • +
      • aria-disabled
      • +
      + Inherited States and Properties: @@ -2000,7 +2590,7 @@

      Definition of Roles

      contentinfo
      -

      A large perceivable region that contains information about the parent document.

      +

      A landmark that contains information about the parent document.

      Examples of information included in this region of the page are copyrights and links to privacy statements.

      User agents SHOULD treat elements with the role of contentinfo as navigational landmarks.

      @@ -2083,7 +2673,7 @@

      Definition of Roles

      definition

      A definition of a term or concept. See related term.

      -

      Authors SHOULD identify the element being defined by giving that element a role of term and referencing it with the aria-labelledby attribute.

      +

      Authors SHOULD identify the element being defined by giving that element a role of term and referencing it with the aria-labelledby attribute or by making the element with role term a descendant of the element with role definition.

      @@ -2110,14 +2700,79 @@

      Definition of Roles

      + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Characteristics:
      Base Concept:  
      Required Context Role: 
      Required Owned Elements: 
      Required States and Properties: 
      Supported States and Properties: 
      Inherited States and Properties:Placeholder
      Name From:author
      Accessible Name Required: 
      Inherits Name Required: 
      Children Presentational: 
      Inherits Presentational: 
      +
      +
      + deletion +
      +

      A deletion contains content that is marked as removed or content that is being suggested for removal. See related insertion.

      +

      Deletions are typically used to either mark differences between two versions of content or to designate content suggested for removal in scenarios where multiple people are revising content.

      +
      + + + + + + + + + + + + + + + + + + + + + - + @@ -2133,15 +2788,24 @@

      Definition of Roles

      - + + + + + - + @@ -2167,7 +2831,7 @@

      Definition of Roles

      A dialog is a descendant window of the primary window of a web application. For HTML pages, the primary application window is the entire web document, i.e., the body element.

      Dialogs are most often used to prompt the user to enter or respond to information. A dialog that is designed to interrupt workflow is usually modal. See related alertdialog.

      -

      Authors SHOULD provide a dialog label, which can be done with the aria-label or aria-labelledby attribute.

      +

      Authors MUST provide an accessible name for a dialog, which can be done with the aria-label or aria-labelledby attribute.

      Authors SHOULD ensure that all dialogs (both modal and non-modal) have at least one focusable descendant element. Authors SHOULD focus an element in the modal dialog when it is displayed, and authors SHOULD manage focus of modal dialogs.

      In the description of this role, the term "web application" does not refer to the application role, which specifies specific assistive technology behaviors.

      @@ -2246,8 +2910,9 @@

      Definition of Roles

      directory
      -

      A list of references to members of a group, such as a static table of contents.

      -

      Authors SHOULD use this role for a static table of contents, whether linked or unlinked. This includes tables of contents built with lists, including nested lists. Dynamic tables of contents, however, might use a tree role instead.

      +

      [Deprecated in ARIA 1.2] A list of references to members of a group, such as a static table of contents.

      +

      As exposed by accessibility APIs, the directory role is essentially equivalent to the list role. So, using directory does not provide any additional benefits to assistive technology users. Authors are advised to treat directory as deprecated and to use list, or a host language's equivalent semantics instead.

      +

      A directory is a static table of contents, whether linked or unlinked. This includes tables of contents built with lists, including nested lists. Dynamic tables of contents, however, might use a tree role instead.

      Characteristics:
      CharacteristicValue
      Is Abstract: 
      Superclass Role:section
      Base Concept: 
      Related Concepts:
      Required Context Role:
      Supported States and Properties: 
      Inherited States and Properties: Placeholder
      Prohibited States and Properties: +
        +
      • aria-label
      • +
      • aria-labelledby
      • +
      +
      Name From:authorprohibited
      Accessible Name Required:
      @@ -2276,7 +2941,7 @@

      Definition of Roles

      - + @@ -2355,7 +3020,7 @@

      Definition of Roles

      - + @@ -2371,7 +3036,7 @@

      Definition of Roles

      - + @@ -2400,6 +3065,94 @@

      Definition of Roles

      Characteristics:
      Related Concepts:
      Required Context Role:
      Related Concepts:
      Required Context Role:
      Supported States and Properties:aria-expanded
      Inherited States and Properties:
      +
      + emphasis +
      +

      One or more emphasized characters. See related strong.

      +

      The purpose of the emphasis role is to stress or emphasize content. It is not for communicating changes in typographical presentation that do not impact the meaning of the content. Authors SHOULD use the emphasis role only if its absence would change the meaning of the content.

      +

      The emphasis role is not intended to convey importance; for that purpose, the strong role is more appropriate.

      +
      + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Characteristics:
      CharacteristicValue
      Is Abstract: 
      Superclass Role:section
      Subclass Roles:Placeholder
      Base Concept: 
      Related Concepts:
      Required Context Role: 
      Required Owned Elements: 
      Required States and Properties: 
      Supported States and Properties: 
      Inherited States and Properties:Placeholder
      Prohibited States and Properties: +
        +
      • aria-label
      • +
      • aria-labelledby
      • +
      +
      Name From:prohibited
      Accessible Name Required: 
      Inherits Name Required: 
      Children Presentational: 
      Inherits Presentational: 
      +
      feed
      @@ -2410,10 +3163,10 @@

      Definition of Roles

      Authors SHOULD make each article in a feed focusable and ensure that the application scrolls an article into view when user agent focus is set on the article or one of its descendant elements. For example, in HTML, each article element should have a tabindex value of either -1 or 0.

      When an assistive technology reading cursor moves from one article to another, assistive technologies SHOULD set user agent focus on the article that contains the reading cursor. If the reading cursor lands on a focusable element inside the article, the assistive technology MAY set focus on that element in lieu of setting focus on the containing article.

      Because the ability to scroll to another article with an assistive technology reading cursor depends on the presence of another article in the page, authors SHOULD attempt to load additional articles before user agent focus reaches an article at either end of the set of articles that has been loaded. Alternatively, authors MAY include an article at either or both ends of the loaded set of articles that includes an element, such as a button, that lets the user request more articles to be loaded.

      -

      In addition to providing a brief label, authors MAY apply aria-describedby to article elements in a feed to suggest to screen readers which elements to speak after the label when users navigate by article. Screen readers MAY provide users with a way to quickly scan feed content by speaking both the label and accessible description when navigating by article, enabling the user to ignore repetitive or less important elements, such as embedded interaction widgets, that the author has left out of the description.

      +

      In addition to providing a brief label, authors MAY apply aria-describedby to article elements in a feed to suggest to screen readers which elements to speak after the label when users navigate by article. Screen readers MAY provide users with a way to quickly scan feed content by speaking both the label and accessible description when navigating by article, enabling the user to ignore repetitive or less important elements, such as embedded interaction widgets, that the author has left out of the description.

      Authors SHOULD provide keyboard commands for moving focus among articles in a feed so users who do not utilize an assistive technology that provides article navigation features can use the keyboard to navigate the feed.

      If the number of articles available in a feed supply is static, authors MAY specify aria-setsize on article elements in that feed. However, if the total number is extremely large, indefinite, or changes often, authors MAY set aria-setsize to -1 to communicate the unknown size of the set.

      -

      See the WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.1]] for additional details on implementing a feed design pattern.

      +

      See the WAI-ARIA Authoring Practices for additional details on implementing a feed design pattern.

      @@ -2522,7 +3275,7 @@

      Definition of Roles

      @@ -2572,7 +3325,9 @@

      Definition of Roles

      form

      A landmark region that contains a collection of items and objects that, as a whole, combine to create a form. See related search.

      -

      A form may be a mix of host language form controls, scripted controls, and hyperlinks. Authors are reminded to use native host language semantics to create form controls, whenever possible. For search facilities, authors SHOULD use the search role and not the generic form role. Authors SHOULD provide a visible label for the form referenced with aria-labelledby. If an author uses a script to submit a form based on a user action that would otherwise not trigger an onsubmit event (for example, a form submission triggered by the user changing a form element's value), the author SHOULD provide the user with advance notification of the behavior.

      +

      A form may contain a mix of host language form controls, scripted controls, and hyperlinks. Authors are reminded to use native host language semantics to create form controls whenever possible. If the purpose of a form is to submit search criteria, authors SHOULD use the search role instead of the generic form role.

      +

      Authors MUST give each element with role form a brief label that describes the purpose of the form. Authors SHOULD reference a visible label with aria-labelledby if a visible label is present. Authors SHOULD include the label inside of a heading whenever possible. The heading MAY be an instance of the standard host language heading element or an instance of an element with role heading.

      +

      If an author uses a script to submit a form based on a user action that would otherwise not trigger an onsubmit event (for example, a form submission triggered by the user changing a form element's value), the author SHOULD provide the user with advance notification of the behavior.

      User agents SHOULD treat elements with the role of form as navigational landmarks.

      Characteristics:
      Related Concepts:
      @@ -2598,7 +3353,7 @@

      Definition of Roles

      - + @@ -2630,7 +3385,7 @@

      Definition of Roles

      - + @@ -2647,8 +3402,98 @@

      Definition of Roles

      Base Concept:HTML form<form> in [[HTML]]
      Related Concepts:
      Accessible Name Required: true
      Inherits Name Required:
      -
      - grid +
      + generic +
      +

      A nameless container element that has no semantic meaning on its own.

      +

      The generic role is intended for use as the implicit role of generic elements in host languages (such as HTML div or span), so is primarily for implementors of user agents. Authors SHOULD NOT use this role in content. Authors MAY use presentation or none to remove implicit accessibility semantics, or a semantic container role such as group to semantically group descendants in a named container.

      +

      Like an element with role presentation, an element with role generic can provide a limited number of accessible states and properties for its descendants, such as aria-live attributes. However, unlike elements with role presentation, generic elements are exposed in accessibility APIs so that assistive technologies can gather certain properties such as layout and bounds.

      +
      + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Characteristics:
      CharacteristicValue
      Is Abstract: 
      Superclass Role:structure
      Subclass Roles:Placeholder
      Base Concept: 
      Related Concepts:
      Required Context Role: 
      Required Owned Elements: 
      Required States and Properties: 
      Supported States and Properties:
      Inherited States and Properties:Placeholder
      Prohibited States and Properties: +
        +
      • aria-brailleroledescription
      • +
      • aria-label
      • +
      • aria-labelledby
      • +
      • aria-roledescription
      • +
      +
      Name From:prohibited
      Accessible Name Required: 
      Inherits Name Required: 
      Children Presentational: 
      Inherits Presentational: 
      +
      +
      + grid

      A composite widget containing a collection of one or more rows with one or more cells where some or all cells in the grid are focusable by using methods of two-dimensional navigation, such as directional arrow keys.

      The grid role does not imply a specific visual, e.g., tabular, presentation. It describes relationships among elements. It may be used for purposes as simple as grouping a collection of checkboxes or navigation links or as complex as creating a full-featured spreadsheet application.

      @@ -2667,12 +3512,12 @@

      Definition of Roles

      For example, if a cell in a spreadsheet contains a combobox or editable text, the Enter key might be used to activate a cell interaction or editing mode when that cell has focus so the directional arrow keys can be used to operate the contained combobox or textbox. Depending on the implementation, pressing Enter again, Tab, Escape, or another key may switch the application back to the grid navigation mode.

      Authors MAY use a gridcell to display the result of a formula, which could be editable by the user. In a spreadsheet application, for example, a gridcell may show a value calculated from a formula until the user activates the gridcell for editing when a textbox appears in the gridcell containing the formula in an editable state.

      -

      If aria-readonly is set on an element with role grid, user agents MUST propagate the value to all gridcell elements owned by the grid and expose the value in the accessibility API. An author MAY override the propagated value of aria-readonly for an individual gridcell element.

      +

      If aria-readonly is set on an element with role grid, user agents MUST propagate the value to all gridcell elements owned by the grid and expose the value in the accessibility API. An author MAY override the propagated value of aria-readonly for an individual gridcell element.

      In a grid that provides cell content editing functions, if the content of a focusable gridcell element is not editable, authors MAY set aria-readonly to true on the gridcell element. However, the value of aria-readonly, whether specified for a grid or individual cells, only indicates whether the content contained in cells is editable. It does not represent availability of functions for navigating or manipulating the grid itself.

      An unspecified value for aria-readonly does not imply that a grid or a gridcell contains editable content. For example, if a grid presents a collection of elements that are not editable, such as a collection of link elements representing dates in a datepicker, it is not necessary for the author to specify a value for aria-readonly.

      Authors MAY indicate that a focusable gridcell is selectable as the object of an action with the aria-selected attribute. If the grid allows multiple gridcells to be selected, the author SHOULD set aria-multiselectable to true on the element with role grid.

      Since WAI-ARIA can augment an element of the host language, a grid can reuse the elements and attributes of a native table, such as an HTML table element. For example, if an author applies the grid role to an HTML table element, the author does not need to apply the row and gridcell roles to the descendant HTML tr and td elements because the user agent will automatically make the appropriate translations. When the author is reusing a native host language table element and needs a gridcell element to span multiple rows or columns, the author SHOULD apply the appropriate host language attributes instead of WAI-ARIA aria-rowspan or aria-colspan properties.

      -

      See the WAI-ARIA Authoring Practices Guide [[WAI-ARIA-PRACTICES-1.1]] for additional details on implementing grid design patterns.

      +

      See the WAI-ARIA Authoring Practices for additional details on implementing grid design patterns.

      @@ -2702,7 +3547,7 @@

      Definition of Roles

      - + @@ -2729,7 +3574,6 @@

      Definition of Roles

      - + + @@ -3140,7 +3992,7 @@

      Definition of Roles

      - + @@ -3148,7 +4000,7 @@

      Definition of Roles

      - + @@ -3177,14 +4029,11 @@

      Definition of Roles

      Characteristics:
      Base Concept:HTML table<table> in [[HTML]]
      Related Concepts: Supported States and Properties:
        -
      • aria-level
      • aria-multiselectable
      • aria-readonly
      @@ -2769,7 +3613,7 @@

      Definition of Roles

      A gridcell may be focusable, editable, and selectable. A gridcell may have relationships such as aria-controls to address the application of functional relationships.

      If an author intends a gridcell to have a row header, column header, or both, and if the relevant headers cannot be determined from the DOM structure, authors SHOULD explicitly indicate which header cells are relevant to the gridcell by applying aria-describedby on the gridcell and referencing elements with role rowheader or columnheader.

      In a treegrid, authors MAY define a gridcell as expandable by using the aria-expanded attribute. If the aria-expanded attribute is provided, it applies only to the individual cell. It is not a proxy for the container row, which also can be expanded. The main use case for providing this attribute on a gridcell is pivot table behavior.

      -

      Authors MUST ensure elements with role gridcell are contained in, or owned by, an element with the role row.

      +

      Authors MUST ensure elements with role gridcell are contained in, or owned by, an element with the role row.

      @@ -2799,7 +3643,7 @@

      Definition of Roles

      - + @@ -2821,6 +3665,11 @@

      Definition of Roles

      - + @@ -2862,10 +3711,10 @@

      Definition of Roles

      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.

      -

      Contrast with region which is a grouping of user interface objects that will be included in a page summary or table of contents.

      -

      Authors SHOULD use a group to form logical collection of items in a widget such as children in a tree widget forming a collection of siblings in a hierarchy, or a collection of items having the same container in a directory. However, when a group is used in the context of list, authors MUST limit its children to listitem elements. Therefore, proper handling of group by authors and assistive technologies is determined by the context in which it is provided.

      -

      Authors MAY nest group elements. If a section is significant enough to warrant inclusion in the web page's table of contents, the author SHOULD assign the section a role of region or a standard landmark role.

      +

      A set of user interface objects that is not intended to be included in a page summary or table of contents by assistive technologies.

      +

      Contrast with region, which is a grouping of user interface objects that will be included in a page summary or table of contents.

      +

      Authors SHOULD use a group to form a logical collection of items in a widget, such as children in a tree widget forming a collection of siblings in a hierarchy. However, when a group is used in the context of a listbox, authors MUST limit its children to option elements. Therefore, proper handling of group by authors and assistive technologies is determined by the context in which it is provided.

      +

      Authors MAY nest group elements. If a section is significant enough to warrant inclusion in the web page's table of contents, the author SHOULD assign it a role of region or a standard landmark role.

      Characteristics:
      Base Concept:HTML td<td> in [[HTML]]
      Related Concepts: Supported States and Properties:
        +
      • aria-disabled
      • +
      • aria-errormessage
      • +
      • aria-expanded
      • +
      • aria-haspopup
      • +
      • aria-invalid
      • aria-readonly
      • aria-required
      • aria-selected
      • @@ -2842,7 +3691,7 @@

        Definition of Roles

      Accessible Name Required:True
      Inherits Name Required:
      @@ -2894,7 +3743,7 @@

      Definition of Roles

      - + @@ -2910,7 +3759,12 @@

      Definition of Roles

      - + @@ -2918,7 +3772,12 @@

      Definition of Roles

      - + @@ -2943,7 +3802,7 @@

      Definition of Roles

      heading

      A heading for a section of the page.

      -

      Often, heading elements will be referenced with the aria-labelledby attribute of the section for which they serve as a heading. If headings are organized into a logical outline, the aria-level attribute is used to indicate the nesting level.

      +

      To ensure elements with a role of heading are organized into a logical outline, authors MUST use the aria-level attribute to indicate the proper nesting level.

      Characteristics:
      Related Concepts:
      Required Context Role:
      Supported States and Properties:aria-activedescendant +
        +
      • aria-activedescendant
      • +
      • aria-disabled
      • +
      +
      Inherited States and Properties:
      Name From:author +
        +
      • author
      • +
      • legend
      • +
      +
      Accessible Name Required:
      @@ -2972,7 +3831,7 @@

      Definition of Roles

      - + @@ -3019,10 +3878,6 @@

      Definition of Roles

      - - - -
      Characteristics:
      Related Concepts:
      Required Context Role: Inherits Presentational:  
      Implicit Value for Role:Default for aria-level is 2.
      @@ -3059,11 +3914,8 @@

      Definition of Roles

      Related Concepts:
      Required Context Role:
      Related Concepts:
      Required States and Properties:
      Supported States and Properties: aria-disabled
      Inherited States and Properties:
      -
      - landmark +
      + insertion
      -

      A perceivable section containing content that is relevant to a specific, author-specified purpose and sufficiently important that users will likely want to be able to navigate to the section easily and to have it listed in a summary of the page. Such a page summary could be generated dynamically by a user agent or assistive technology.

      -

      Authors designate the purpose of the content by assigning a role that is a subclass of the landmark role and, when needed, by providing a brief, descriptive label.

      -

      Elements with a role that is a subclass of the landmark role are known as landmark regions or navigational landmark regions. -Assistive technologies SHOULD enable users to quickly navigate to landmark regions. Mainstream user agents MAY enable users to quickly navigate to landmark regions.

      -

      landmark is an abstract role used for the ontology. Authors should not use this role in content.

      +

      An insertion contains content that is marked as added or content that is being suggested for addition. See related deletion.

      +

      Insertions are typically used to either mark differences between two versions of content or to designate content suggested for addition in scenarios where multiple people are revising content.

      @@ -3197,23 +4046,19 @@

      Definition of Roles

      - + - - - - - + @@ -3229,19 +4074,28 @@

      Definition of Roles

      - + + + + + - + - + @@ -3258,12 +4112,32 @@

      Definition of Roles

      Characteristics:
      Is Abstract:True 
      Superclass Role: section
      Subclass Roles:Placeholder
      Base Concept:  
      Related Concepts:
      Required Context Role:
      Supported States and Properties: 
      Inherited States and Properties: Placeholder
      Prohibited States and Properties: +
        +
      • aria-label
      • +
      • aria-labelledby
      • +
      +
      Name From:authorprohibited
      Accessible Name Required:False 
      Inherits Name Required:
      -
    -
    -

    Values for States and Properties

    -

    Many states and properties accept a specific set of tokens as values. The allowed values and explanation of their meaning is shown after the table of characteristics. The default value, if defined, is shown in strong type, followed by the parenthetical term 'default'. When a value is indicated as the default, the user agent MUST follow the behavior prescribed by this value when the state or property is empty or unspecified. Some roles also define what behavior to use when certain states or properties, that do not have default values, are not provided.

    +
    +

    Enumerated Attribute Values

    +

    When the ARIA attribute definition includes a table enumerating the attribute's allowed values, that attribute is an enumerated attribute. Each value in the table is a keyword for the attribute, mapping to a state of the same name. When the values table notates one of the values as "(default)", that default value is the missing value default and invalid value default for the attribute.

    +
    +

    Example Enumerated Attribute Usage

    +

    As noted in Mapping WAI-ARIA Value Types to Languages, attributes are included in host languages, and the syntax for representation of enumerated value types is governed by the host language.

    +

    All enumerated attribute getters and setters use string values, including the boolean-like enumerated true/false type.

    + + + +
    +
    +
    +

    Translatable States and Properties

    +

    The HTML specification states that other specifications can define translatable attributes. In order to be understandable by assistive technology users, the values of the following states and properties are translatable attributes and should be translated when a page is localized:

    +
      +
    • aria-label
    • +
    • aria-placeholder
    • +
    • aria-roledescription
    • +
    • aria-valuetext
    • +

    Global States and Properties

    -

    Some states and properties are applicable to all host language elements regardless of whether a role is applied. The following global states and properties are supported by all roles and by all base markup elements.

    +

    Some states and properties are applicable to all host language elements regardless of whether a role is applied. The following global states and properties are supported by all roles and by all base markup elements unless otherwise prohibited. If a role prohibits use of any global states or properties, those states or properties are listed as prohibited in the characteristics table included in the section that defines the role.

    Placeholder for global states and properties

    -

    Global states and properties are applied to the role roletype, which is the base role, and therefore inherit into all roles. To facilitate reading, they are not explicitly identified as either supported or inherited states and properties in the specification. Instead, the inheritance is indicated by a link to this section.

    Taxonomy of WAI-ARIA States and Properties

    @@ -8455,6 +10339,7 @@

    Relationship Attributes

  • aria-activedescendant
  • aria-colcount
  • aria-colindex
  • +
  • aria-colindextext
  • aria-colspan
  • aria-controls
  • aria-describedby
  • @@ -8466,6 +10351,7 @@

    Relationship Attributes

  • aria-posinset
  • aria-rowcount
  • aria-rowindex
  • +
  • aria-rowindextext
  • aria-rowspan
  • aria-setsize
  • @@ -8478,12 +10364,15 @@

    Definitions of States and Properties (all aria-* attributes)

    aria-activedescendant
    -

    Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

    -

    The aria-activedescendant property provides an alternative method of managing focus for interactive elements that may contain multiple focusable descendants, such as menus, grids, and toolbars. Instead of moving DOM focus among descendant elements, authors MAY set DOM focus on an element that supports aria-activedescendant and then use aria-activedescendant to refer to the element that is active.

    +

    Identifies the currently active element when DOM focus is on a composite widget, combobox, textbox, group, or application.

    +

    The aria-activedescendant property provides an alternative method of managing focus for interactive elements that may contain multiple focusable descendants, such as menus, grids, and toolbars. Instead of moving DOM focus among owned elements, authors MAY set DOM focus on a container element that supports aria-activedescendant and then use aria-activedescendant to refer to the element that is active.

    Authors MUST ensure that one of the following two sets of conditions is met when setting the value of aria-activedescendant on an element with DOM focus:

      -
    1. The value of aria-activedescendant refers to an element that is either a descendant of the element with DOM focus or is a logical descendant as indicated by the aria-owns attribute.
    2. -
    3. The element with DOM focus is a textbox with aria-controls referring to an element that supports aria-activedescendant, and the value of aria-activedescendant specified for the textbox refers to either a descendant of the element controlled by the textbox or is a logical descendant of that controlled element as indicated by the aria-owns attribute. For example, in a combobox, focus may remain on the textbox while the value of aria-activedescendant on the textbox element refers to a descendant of a popup listbox that is controlled by the textbox.
    4. +
    5. The value of aria-activedescendant refers to an owned element. An owned element is either a descendant of the element with DOM focus or a logical descendant as indicated by the aria-owns attribute.
    6. +
    7. + The element with DOM focus is a combobox, textbox or searchbox with aria-controls referring to an element that supports aria-activedescendant, and the value of aria-activedescendant refers to an owned element of the controlled element. + For example, in a combobox, focus may remain on the combobox while the value of aria-activedescendant on the combobox element refers to a descendant of a popup listbox that is controlled by the combobox. +

    Authors SHOULD also ensure that the currently active descendant is visible and in view (or scrolls into view) when focused.

    @@ -8498,7 +10387,7 @@

    Definitions of States and Properties (all aria-* attributes)

    Related Concepts: - SVG [[SVG2]] and DOM [[DOM4]] active + SVG [[SVG2]] and DOM [[DOM]] active Used in Roles: @@ -8519,7 +10408,7 @@

    Definitions of States and Properties (all aria-* attributes)

    aria-atomic

    Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

    -

    Both accessibility APIs and the Document Object Model [[DOM4]] provide events to allow the assistive technologies to determine changed areas of the document.

    +

    Both accessibility APIs and the Document Object Model [[DOM]] provide events to allow the assistive technologies to determine changed areas of the document.

    When the content of a live region changes, user agents SHOULD examine the changed element and traverse the ancestors to find the first element with aria-atomic set, and apply the appropriate behavior for the cases below.

    1. If none of the ancestors have explicitly set aria-atomic, the default is that aria-atomic is false, and assistive technologies will only present the changed node to the user.
    2. @@ -8578,14 +10467,14 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-autocomplete
      -

      Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

      +

      Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for a combobox, searchbox, or textbox and specifies how predictions would be presented if they were made.

      The aria-autocomplete property describes the type of interaction model a textbox, searchbox, or combobox employs when dynamically helping users complete text input. It distinguishes between two models: the inline model (aria-autocomplete="inline") that presents a value completion prediction inside the text input and the list model (aria-autocomplete="list") that presents a collection of possible values in a separate element that pops up adjacent to the text input. It is possible for an input to offer both models at the same time (aria-autocomplete="both").

      The aria-autocomplete property is limited to describing predictive behaviors of an input element. Authors SHOULD either omit specifying a value for aria-autocomplete or set aria-autocomplete to none if an input element provides one or more input proposals where none of the proposals are dependent on the specific input provided by the user. For instance, a combobox where the value of aria-autocomplete would be none is a search field that displays suggested values by listing the 5 most recently used search terms without any filtering of the list based on the user's input. Elements with a role that supports aria-autocomplete have a default value for aria-autocomplete of none.

      When an inline suggestion is made as a user types in an input, suggested text for completing the value of the field dynamically appears in the field after the input cursor, and the suggested value is accepted as the value of the input if the user performs an action that causes focus to leave the field. When an element has aria-autocomplete set to inline or both, authors SHOULD ensure that the automatically suggested portion of the text is presented as selected text. This enables assistive technologies to distinguish between a user's input and the automatic suggestion and, in the event that the suggestion is not the desired value, enables the user to easily delete the suggestion or replace it by continuing to type.

      If an element has aria-autocomplete set to list or both, authors MUST ensure both of the following conditions are met:

      1. The element has a value specified for aria-controls that refers to the element that contains the collection of suggested values.
      2. -
      3. Either the element or a containing element with role combobox has a value for aria-haspopup that matches the role of the element that contains the collection of suggested values.
      4. +
      5. The element has a value for aria-haspopup that matches the role of the element that contains the collection of suggested values.

      Some implementations of the list model require the user to perform an action, such as moving focus to the suggestion with the Down Arrow or clicking on the suggestion, in order to choose the suggestion. In such implementations, authors MAY manage focus by either using aria-activedescendant if the collection container supports it or by moving DOM focus to the suggestion. However, other implementations of the list model automatically highlight one suggestion as the selected value that will be accepted when the field loses focus, e.g., when the user presses the Tab key or clicks on a different field. If an element has aria-autocomplete set to list or both, and if a suggestion is automatically selected as the user provides input, authors MUST ensure all the following conditions are met:

        @@ -8606,7 +10495,7 @@

        Definitions of States and Properties (all aria-* attributes)

        Related Concepts: - XForms selection attribute in select + Used in Roles: @@ -8627,25 +10516,83 @@

        Definitions of States and Properties (all aria-* attributes)

        Value - Description + Description + + + + + inline + When a user is providing input, text suggesting one way to complete the provided input may be dynamically inserted after the caret. + + + list + When a user is providing input, an element containing a collection of values that could complete the provided input may be displayed. + + + both + When a user is providing input, an element containing a collection of values that could complete the provided input may be displayed. If displayed, one value in the collection is automatically selected, and the text needed to complete the automatically selected value appears after the caret in the input. + + + none (default) + When a user is providing input, an automatic suggestion that attempts to predict how the user intends to complete the input is not displayed. + + + +
      +
      + aria-brailleroledescription +
      +

      Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille. See related aria-roledescription.

      +

      Some assistive technologies, such as screen readers, present the role of an element as part of the user experience. Such assistive technologies typically localize the name of the role, and they may customize it as well. Users of these assistive technologies depend on the presentation of the role name, such as "region," "button," or "slider," for an understanding of the purpose of the element and, if it is a widget, how to interact with it.

      +

      The aria-brailleroledescription property gives authors the ability to override how assistive technologies localize and express the name of a role in Braille. Thus inappropriately using aria-brailleroledescription may inhibit users' ability to understand or interact with an element on braille interfaces. Authors SHOULD limit use of aria-brailleroledescription to clarifying the purpose of non-interactive container roles like group or region, or to providing a more specific description of a widget in a braille context.

      +

      Authors MUST NOT use aria-brailleroledescription without providing aria-roledescription. In general, aria-brailleroledescription should only be used in rare cases when a aria-roledescription is excessively verbose when rendered in Braille.

      +

      When using aria-brailleroledescription, authors SHOULD also ensure that:

      +
        +
      1. The element to which aria-brailleroledescription is applied has a valid WAI-ARIA role or has an implicit WAI-ARIA role semantic.
      2. +
      3. The value of aria-brailleroledescription is not empty or does not contain only whitespace characters.
      4. +
      5. The value of aria-brailleroledescription does not contain any characters in Unicode Braille Patterns (U+2800..U+28FF) or consists of only characters in Unicode Braille Patterns (U+2800..U+28FF) while not only containing Braille Pattern dots-0 (U+2800).
      6. +
      7. The value of aria-brailleroledescription should not be identical to the element's WAI-ARIA aria-roledescription, WAI-ARIA role or implicit WAI-ARIA role semantic.
      8. +
      +

      Note that Assistive Technologies with braille support can convert aria-roledescription content to Braille. In addition, assistive technologies will be able to customize such braille output according to user preferences. Using only aria-roledescription is almost always the better user experience and authors are strongly discouraged from using aria-brailleroledescription to replicate aria-roledescription. Instead, aria-brailleroledescription is meant to be used only when aria-roledescription cannot provide an adequate braille representation, i.e., when a specialized braille description is very different from a text description converted to Braille. It is very important to note that when using aria-brailleroledescription authors are solely responsible to align the attribute value with the document language and clearly communicate the use of this attribute to the user. This is even more important when the value consists of Unicode Braille Patterns because Assistive Technologies will pass such content directly to the user without applying user specific braille translations; in general, authors are strongly discouraged from using Unicode Braille Patterns in aria-brailleroledescription. +

      +

      User agents MUST NOT expose the aria-brailleroledescription property if any of the following conditions exist:

      +
        +
      1. The element to which aria-brailleroledescription is applied does not have a valid WAI-ARIA role or does not have an implicit WAI-ARIA role semantic.
      2. +
      3. The value of aria-brailleroledescription is empty or contains only whitespace characters or contains only Braille Pattern dots-0 (U+2800).
      4. +
      5. The element to which aria-brailleroledescription is applied does not have a valid WAI-ARIA aria-roledescription.
      6. +
      +

      Assistive technologies SHOULD use the value of aria-brailleroledescription when presenting the role of an element in Braille, but SHOULD NOT change other functionality based on the role of an element that has a value for aria-brailleroledescription. For example, an assistive technology that provides functions for navigating to the next region or button SHOULD allow those functions to navigate to regions and buttons that have an aria-brailleroledescription.

      +

      Assistive technologies SHOULD expose the aria-brailleroledescription property as follows:

      +
        +
      1. If the value of aria-brailleroledescription does not contain characters in Unicode Braille Patterns (U+2800..U+28FF), translate the value according to the user's preferred translation table.
      2. +
      3. Otherwise, pass the value to the user without translation.
      4. +
      +

      The following example shows the use of aria-brailleroledescription to indicate that a button's description has a particular braille contraction.

      +
      <button aria-roledescription="planet" aria-brailleroledescription="pln" id="jupiter">
      +<img alt="jupiter" src="images/jupiter.jpg"/>
      +</button>
      +

      In the previous example, a braille display may display "pln Jupiter" in Braille rather than the verbose "planet Jupiter".

      +
      + + + + + + - - + + - - + + - - - - - - + +
      Characteristics:
      CharacteristicValue
      inlineWhen a user is providing input, text suggesting one way to complete the provided input may be dynamically inserted after the caret.Used in Roles:All elements of the base markup
      listWhen a user is providing input, an element containing a collection of values that could complete the provided input may be displayed.Inherits into Roles:Placeholder
      bothWhen a user is providing input, an element containing a collection of values that could complete the provided input may be displayed. If displayed, one value in the collection is automatically selected, and the text needed to complete the automatically selected value appears after the caret in the input.
      none (default)When a user is providing input, an automatic suggestion that attempts to predict how the user intends to complete the input is not displayed.Value:string
      @@ -8711,8 +10658,8 @@

      Definitions of States and Properties (all aria-* attributes)

      Indicates the current "checked" state of checkboxes, radio buttons, and other widgets. See related aria-pressed and aria-selected.

      The aria-checked attribute indicates whether the element is checked (true), unchecked (false), or represents a group of other elements that have a mixture of checked and unchecked values (mixed). Most inputs only support values of true and false, but the mixed value is supported by certain tri-state inputs such as a checkbox or menuitemcheckbox.

      -

      The mixed value is not supported on radio, menuitemradio, switch or any element that inherits from these in the taxonomy, and user agents MUST treat a mixed value as equivalent to false for those roles.

      -

      Examples using the mixed value of tri-state inputs are covered in WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.1]]

      +

      The mixed value is not supported on radio, menuitemradio, switch or any element that inherits from these, and user agents MUST treat a mixed value as equivalent to false for those roles.

      +

      Examples using the mixed value of tri-state inputs are covered in the WAI-ARIA Authoring Practices.

      @@ -8764,7 +10711,7 @@

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -8835,7 +10782,7 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-colindex
      -

      Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid. See related aria-colcount and aria-colspan.

      +

      Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid. See related aria-colindextext, aria-colcount, and aria-colspan.

      If all of the columns are present in the DOM, it is not necessary to set this attribute as the user agent can automatically calculate the column index of each cell or gridcell. However, if only a portion of the columns is present in the DOM at a given moment, this attribute is needed to provide an explicit indication of the column of each cell or gridcell with respect to the full table.

      Authors MUST set the value for aria-colindex to an integer greater than or equal to 1, greater than the aria-colindex value of any previous elements within the same row, and less than or equal to the number of columns in the full table. For a cell or gridcell which spans multiple columns, authors MUST set the value of aria-colindex to the start of the span.

      If the set of columns which is present in the DOM is contiguous, and if there are no cells which span more than one row or column in that set, then authors MAY place aria-colindex on each row, setting the value to the index of the first column of the set. Otherwise, authors SHOULD place aria-colindex on all of the children or owned elements of each row.

      @@ -8947,6 +10894,42 @@

      Definitions of States and Properties (all aria-* attributes)

      Characteristics:
      The element is checked.
      undefined (default)undefined (default) The element does not support being checked.
      +
      + aria-colindextext +
      +

      Defines a human readable text alternative of aria-colindex. See related aria-rowindextext.

      +

      Authors SHOULD only use aria-colindextext when the provided or calculated value of aria-colindex is not meaningful or does not reflect the displayed index, as is the case with spreadsheets and chess boards.

      +

      Authors SHOULD NOT use aria-colindextext as a replacement for aria-colindex because some assistive technologies rely upon the numeric column index for the purpose of keeping track of the user's position or providing alternative table navigation.

      +

      Unlike aria-colindex, aria-colindextext is not a supported property of row because user agents have no way to reliably calculate aria-colindextext for the purpose of exposing its value on the cell or gridcell.

      +
      + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Characteristics:
      CharacteristicValue
      Related Concepts:
      Used in Roles:Placeholder
      Inherits into Roles:Placeholder
      Value:string
      +
      aria-colspan
      @@ -9110,8 +11093,8 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-describedby
      -

      Identifies the element (or elements) that describes the object. See related aria-labelledby.

      -

      The aria-labelledby attribute is similar to the aria-describedby in that both reference other elements to calculate a text alternative, but a label should be concise, where a description is intended to provide more verbose information.

      +

      Identifies the element (or elements) that describes the object. See related aria-labelledby and aria-description.

      +

      The aria-labelledby attribute is similar to aria-describedby in that both reference other elements to calculate a text alternative, but a label should be concise, where a description is intended to provide more verbose information.

      The element or elements referenced by the aria-describedby comprise the entire description. Include ID references to multiple elements if necessary, or enclose a set of elements (e.g., paragraphs) with the element referenced by the ID.

      @@ -9128,9 +11111,7 @@

      Definitions of States and Properties (all aria-* attributes)

      Related Concepts:
        -
      • Hint or Help in XForms [[XFORMS10]]
      • -
      • Label in XForms
      • -
      • Label in HTML [[XHTML11]]
      • +
      • <label> in [[HTML]]
      • online help
      • HTML table cell headers
      @@ -9151,13 +11132,63 @@

      Definitions of States and Properties (all aria-* attributes)

      -
      +
      + aria-description +
      +

      Defines a string value that describes or annotates the current element. See related aria-describedby.

      +

      The aria-description attribute is similar to aria-label in that both provide a flat string to associate with the element, but a label should be concise, whereas a description is intended to provide more verbose information.

      +

      The purpose of aria-description is the same as that of aria-describedby. It provides the user with additional descriptive text for the object. The most common accessibility API mapping for a description is the accessible description property. User agents MUST give precedence to aria-describedby over aria-description when computing the accessible description property.

      +

      In cases where providing a visible description is not the desired user experience, authors MAY set the accessible description of the element using aria-description. However, if the description text is available in the DOM, authors SHOULD NOT use aria-description, but should use one of the following instead:

      +
        +
      • Authors SHOULD use aria-describedby when the related description or annotation elements contain a simple, small description that is best experienced as a flat string, rather than by having the user navigate to them.
      • +
      • Authors SHOULD use aria-details when the related description or annotation elements contain useful semantics or structure, or there is a lot of content within them, making it difficult to experience as a flat string. Using aria-details will allow assistive technology users to visit the structured content and provide additional navigation commands, making it easier to understand the structure, or to experience the information in smaller pieces.
      • +
      +
      + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Characteristics:
      CharacteristicValue
      Related Concepts:
      Used in Roles:All elements of the base markup
      Inherits into Roles:Placeholder
      Value:string
      +
      +
      aria-details
      -

      Identifies the element that provides a detailed, extended description for the object. See related aria-describedby.

      -

      The aria-details attribute references a single element that provides more detailed information than would normally be provided by aria-describedby. It enables assistive technologies to make users aware of the availability of an extended description as well as navigate to it. Authors SHOULD ensure the element referenced by aria-details is visible to all users.

      -

      Unlike elements referenced by aria-describedby, the element referenced by aria-details is not used in either the Accessible Name Computation or the Accessible Description Computation as defined in the Accessible Name and Description specification [[ACCNAME-AAM-1.1]]. Thus, the content of an element referenced by aria-details is not flattened to a string when presented to assistive technology users. This makes aria-details particularly useful when converting the information to a string would cause a loss of information or make the extended description more difficult to understand.

      -

      In some user agents, multiple reference relationships for descriptive information are not supported by the accessibility API. In such cases, if both aria-describedby and aria-details are provided on an element, aria-details takes precedence.

      +

      Identifies the element (or elements) that provide additional information related to the object. See related aria-describedby.

      +

      The aria-details property is for referencing elements that provide more detailed information than would normally be provided via aria-describedby. The presence of aria-details enables assistive technologies to make users aware of the availability of extended information and navigate to it. Authors SHOULD ensure that elements referenced by aria-details are visible to all users.

      +

      Assistive technologies MAY use the role of elements referenced by the aria-details property to help users understand the types of information associated with the element. Authors MAY convey the type of details associated with an element as follows:

      +
        +
      • Comment: aria-details refers to an element with role comment.
      • +
      • Definition: aria-details is applied to an element with role term and refers to an element with role definition.
      • +
      • Footnote: aria-details refers to an element with role doc-footnote. This role is defined in [[DPUB-ARIA-1.0]].
      • +
      • Endnote: aria-details refers to an element with role doc-endnote. This role is defined in [[DPUB-ARIA-1.0]].
      • +
      • Description or general annotation: aria-details refers to an element with any other role.
      • +
      + +

      Unlike elements referenced by aria-describedby, elements referenced by aria-details are not used in the Accessible Description Computation as defined in the Accessible Name and Description specification. Thus, the content of elements referenced by aria-details are not flattened to a string when presented to assistive technology users. This makes aria-details particularly useful when converting the information to a string would cause a loss of information or make the extended information more difficult to understand.

      +

      The aria-details property supports referring to multiple elements. For example, a paragraph in a document editor may reference multiple comments that are not related to each other. If a user agent relies on an accessibility API that does not support exposing multiple descriptive relations, the user agent SHOULD expose the relationship to the first element referenced by aria-details.

      +

      It is valid for an element to have both aria-details and a description specified with either aria-describedby or aria-description. If a user agent relies on an accessibility API that does not support exposing multiple descriptive relations, and if an element has both aria-details and aria-describedby, the user agent SHOULD expose the aria-details relation and the description string computed from the aria-describedby relationship.

      A common use for aria-details is in digital publishing where an extended description needs to be conveyed in a book that requires structural markup or the embedding of other technology to provide illustrative content. The following example demonstrates this scenario.

                                       <!-- Provision of an extended description -->
      @@ -9173,9 +11204,9 @@ 

      Definitions of States and Properties (all aria-* attributes)

      The following drawing illustrates an application of the Pythagorean Theorem when used to construct a skateboard ramp. </p> - <object data="skatebd-ramp.svg" type="image/svg+xml"/> + <object data="skatebd-ramp.svg" type="image/svg+xml"></object> <p> - In this example you will notice a skateboard with a base and vertical board whose width + In this example you will notice a skateboard ramp with a base and vertical board whose width is the width of the ramp. To compute how long the ramp must be, simply calculate the base length, square it, sum it with the square of the height of the ramp, and take the square root of the sum. @@ -9206,7 +11237,7 @@

      Definitions of States and Properties (all aria-* attributes)

      Value: - ID reference + ID reference list @@ -9217,6 +11248,9 @@

      Definitions of States and Properties (all aria-* attributes)

      Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable. See related aria-hidden and aria-readonly.

      For example, irrelevant options in a radio group may be disabled. Disabled elements might not receive focus from the tab order. For some disabled elements, applications might choose not to support navigation to descendants. In addition to setting the aria-disabled attribute, authors SHOULD change the appearance (grayed out, etc.) to indicate that the item has been disabled.

      The state of being disabled applies to the current element and all focusable descendant elements of the element on which the aria-disabled attribute is applied.

      +

      While aria-disabled and proper scripting can successfully disable an element with role link, fully disabling a host language equivalent can be problematic. Authors are advised not to use aria-disabled on elements that cannot be disabled through features of the host language alone.

      +

      While aria-disabled is currently supported on columnheader, rowheader, and row, in a future version the working group plans to prohibit its use on elements with any of those three roles except when they are in the context of a grid or treegrid.

      +

      This state is being deprecated as a global state in ARIA 1.2. In future versions it will only be allowed on roles where it is specifically supported.

      @@ -9233,7 +11267,7 @@

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -9271,7 +11305,7 @@

      Definitions of States and Properties (all aria-* attributes)

      [Deprecated in ARIA 1.1] Indicates what functions can be performed when a dragged object is released on the drop target.

      The aria-dropeffect property is expected to be replaced by a new feature in a future version of WAI-ARIA. Authors are therefore advised to treat aria-dropeffect as deprecated.

      This property allows assistive technologies to convey the possible drag options available to users, including whether a pop-up menu of choices is provided by the application. Typically, drop effect functions can only be provided once an object has been grabbed for a drag operation as the drop effect functions available are dependent on the object being dragged.

      -

      More than one drop effect may be supported for a given element. Therefore, the value of this attribute is a space-delimited set of tokens indicating the possible effects, or none if there is no supported operation. In addition to setting the aria-dropeffect attribute, authors SHOULD show a visual indication of potential drop targets.

      +

      More than one drop effect may be supported for a given element. Therefore, the value of this attribute is a space-separated set of tokens indicating the possible effects, or none if there is no supported operation. In addition to setting the aria-dropeffect attribute, authors SHOULD show a visual indication of potential drop targets.

      Characteristics:
      Used in Roles:All elements of the base markupUse as a global deprecated in ARIA 1.2
      Inherits into Roles:
      @@ -9342,23 +11376,25 @@

      Definitions of States and Properties (all aria-* attributes)

      Identifies the element that provides an error message for an object. See related aria-invalid and aria-describedby.

      The aria-errormessage attribute references another element that contains error message text. Authors MUST use aria-invalid in conjunction with aria-errormessage.

      When the value of an object is not valid, aria-invalid is set to true, which indicates that the message contained by an element referenced by aria-errormessage is pertinent.

      -

      When an object is in a valid state, it has either aria-invalid set to false or it does not have the aria-invalid attribute. If a valid object has aria-errormessage, the element referenced by aria-errormessage is not rendered because the message it contains is not pertinent.

      -

      When aria-errormessage is pertinent, authors MUST ensure the content is not hidden so users can navigate to and examine the error message. Similarly, when aria-errormessage is not pertinent, authors MUST either ensure the content is not rendered or remove the aria-errormessage attribute or its value.

      +

      When an object is in a valid state, it has either aria-invalid set to false or it does not have the aria-invalid attribute. Authors MAY use aria-errormessage on an object that is currently valid, but only if the element referenced by aria-errormessage is hidden, because the message it contains is not pertinent.

      +

      When aria-errormessage is pertinent, authors MUST ensure the content is not hidden so users can navigate to and examine the error message. Similarly, when aria-errormessage is not pertinent, authors MUST either ensure the content is hidden or remove the aria-errormessage attribute or its value.

      User agents MUST NOT expose aria-errormessage for an object with an aria-invalid value of false.

      Authors MAY call attention to a newly rendered error message with a live region by either applying an aria-live property or using one of the live region roles, such as alert. A live region is appropriate when an error message is displayed to users after they have provided an invalid value.

      -

      A typical message describes what is wrong and informs users what is required. For example, an error message might be, Invalid time: the time must be between 9:00 AM and 5:00 PM. The following example code shows markup for an initial valid state and for a subsequent invalid state. Note the changes to aria-invalid on the text input object, and to aria-live on the element containing the text of the error message:

      +

      A typical message describes what is wrong and informs users what is required. For example, an error message might be, Invalid time: the time must be between 9:00 AM and 5:00 PM. The following example code shows markup for an initial valid state and for a subsequent invalid state. Note the changes to aria-invalid on the text input object, and to aria-live on the element containing the text of the error message:

       				<!-- Initial valid state -->
       				<label for="startTime"> Please enter a start time for the meeting: </label>
       				<input id="startTime" type="text" aria-errormessage="msgID" value="" aria-invalid="false">
      -				<span id="msgID" aria-live="off" style="visibility:hidden"> Invalid time:  the time must be between 9:00 AM and 5:00 PM" </span>
      +				<span id="msgID" aria-live="assertive"><span style="visibility:hidden">Invalid time: the time must be between 9:00 AM and 5:00 PM</span></span>
       
       				<!-- User has input an invalid value -->
       				<label for="startTime"> Please enter a start time for the meeting: </label>
       				<input id="startTime" type="text" aria-errormessage="msgID" aria-invalid="true" value="11:30 PM" >
      -				<span id="msgID" aria-live="assertive" style="visibility:visible"> Invalid time:  the time must be between 9:00 AM and 5:00 PM" </span>
      +				<span id="msgID" aria-live="assertive"><span style="visibility:visible">Invalid time: the time must be between 9:00 AM and 5:00 PM</span></span>
       				
      - +

      This example uses aria-live="assertive" to indicate that assistive technologies should immediately announce the error message rather than completing other queued announcements first. This increases the likelihood that users are aware of the error message before they move focus out of the input.

      +

      This state is being deprecated as a global state in ARIA 1.2. In future versions it will only be allowed on roles where it is specifically supported.

      +
      Characteristics:
      @@ -9370,7 +11406,11 @@

      Definitions of States and Properties (all aria-* attributes)

      - + + + + + @@ -9382,9 +11422,9 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-expanded
      -

      Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

      -

      For example, this indicates whether a portion of a tree is expanded or collapsed. In other instances, this may be applied to page sections to mark expandable and collapsible regions that are flexible for managing content density. Simplifying the user interface by collapsing sections may improve usability for all, including those with cognitive or developmental disabilities.

      -

      If the element with the aria-expanded attribute controls the expansion of another grouping container that is not 'owned by' the element, the author SHOULD reference the container by using the aria-controls attribute.

      +

      Indicates whether a grouping element owned or controlled by this element is expanded or collapsed.

      +

      The aria-expanded attribute is applied to a focusable, interactive element that toggles visibility of content in another element. For example, it is applied to a parent treeitem to indicate whether its child branch of the tree is shown. Similarly, it can be applied to a button that controls visibility of a section of page content.

      +

      If a grouping container that can be expanded or collapsed is not owned by the element that has the aria-expanded attribute, the author SHOULD identify the controlling relationship by referencing the container from the element that has aria-expanded with the aria-controls property.

      Characteristics:
      Used in Roles:All elements of the base markupUse as a global deprecated in ARIA 1.2
      Inherits into Roles:Placeholder
      Value:
      @@ -9397,7 +11437,7 @@

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -9424,15 +11464,15 @@

      Definitions of States and Properties (all aria-* attributes)

      - + - + - +
      Characteristics:
      Related Concepts:
      Used in Roles:
      falseThe element, or another grouping element it controls, is collapsed.The grouping element this element owns or controls is collapsed.
      trueThe element, or another grouping element it controls, is expanded.The grouping element this element owns or controls is expanded.
      undefined (default)The element, or another grouping element it controls, is neither expandable nor collapsible; all its child elements are shown or there are no child elements.The element does not own or control a grouping element that is expandable.
      @@ -9441,8 +11481,8 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-flowto

      Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

      -

      When aria-flowto has a single IDREF, it allows assistive technologies to, at the user's request, forego normal document reading order and go to the targeted object. However, when aria-flowto is provided with multiple IDREFS, assistive technologies SHOULD present the referenced elements as path choices.

      -

      In the case of one or more IDREFS, user agents or assistive technologies SHOULD give the user the option of navigating to any of the targeted elements. The name of the path can be determined by the name of the target element of the aria-flowto attribute. Accessibility APIs can provide named path relationships.

      +

      When aria-flowto has a single ID reference, it allows assistive technologies to, at the user's request, forego normal document reading order and go to the targeted object. However, when aria-flowto is provided with multiple ID references, assistive technologies SHOULD present the referenced elements as path choices.

      +

      In the case of one or more ID references, user agents or assistive technologies SHOULD give the user the option of navigating to any of the targeted elements. The name of the path can be determined by the name of the target element of the aria-flowto attribute. Accessibility APIs can provide named path relationships.

      @@ -9538,10 +11578,16 @@

      Definitions of States and Properties (all aria-* attributes)

      Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

      A popup element usually appears as a block of content that is on top of other content. Authors MUST ensure that the role of the element that serves as the container for the popup content is menu, listbox, tree, grid, or dialog, and that the value of aria-haspopup matches the role of the popup container.

      -

      For the popup element to be keyboard accessible, authors SHOULD ensure that the element that can trigger the popup is focusable, that there is a keyboard mechanism for opening the popup, and that the popup element manages focus of all its descendants as described in Managing Focus.

      -

      The aria-haspopup property is an enumerated type. User agents MUST treat any value of aria-haspopup that is not included in the list of allowed values, including an empty string, as if the value false had been provided. To provide backward compatibility with ARIA 1.0 content, user agents MUST treat an aria-haspopup value of true as equivalent to a value of menu.

      -

      Assistive technologies SHOULD NOT expose the aria-haspopup property if it has a value of false.

      -

      A tooltip is not considered to be a popup in this context.

      +

      For the popup element to be keyboard accessible, authors SHOULD ensure that the element that can trigger the popup is focusable, that there is a keyboard mechanism for opening the popup, and that the popup element manages focus of all its descendants as described in Managing Focus.

      +

      The aria-haspopup property is an enumerated type. User agents MUST treat any value of aria-haspopup that is not included in the list of allowed values, including an empty string, as if the value false had been provided. To provide backward compatibility with ARIA 1.0 content, user agents MUST treat an aria-haspopup value of true as equivalent to a value of menu.

      +

      Assistive technologies SHOULD NOT expose the aria-haspopup property if it has a value of false.

      +

      A tooltip is not considered to be a popup in this context.

      +

      aria-haspopup is most relevant to use when there is a visual indicator in the element that triggers the popup. + For example, many controls styled with a downward pointing triangle, chevron, or ellipsis (three consecutive dots) have become standard visual indicators that a popup will display when the control is activated. + If some functional difference is relevant to display to a sighted user by means of a different visual style, that functional difference is usually relevant to convey to users of assistive technology. + If there is no visual indication that an element will trigger a popup, authors are advised to consider whether use of aria-haspopup is necessary, and avoid using it when it's not. +

      +

      This property is being deprecated as a global property in ARIA 1.2. In future versions it will only be allowed on roles where it is specifically supported.

      Characteristics:
      @@ -9555,15 +11601,12 @@

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -9620,12 +11663,9 @@

      Definitions of States and Properties (all aria-* attributes)

      Indicates whether the element is exposed to an accessibility API. See related aria-disabled.

      User agents determine an element's hidden status based on whether it is rendered, and the rendering is usually controlled by CSS. For example, an element whose display property is set to none is not rendered. An element is considered hidden if it, or any of its ancestors are not rendered or have their aria-hidden attribute value set to true.

      -
      [aria-hidden="true"] { visibility: hidden; }

      Authors MAY, with caution, use aria-hidden to hide visibly rendered content from assistive technologies only if the act of hiding this content is intended to improve the experience for users of assistive technologies by removing redundant or extraneous content. Authors using aria-hidden to hide visible content from screen readers MUST ensure that identical or equivalent meaning and functionality is exposed to assistive technologies.

      Authors are advised to use extreme caution and consider a wide range of disabilities when hiding visibly rendered content from assistive technologies. For example, a sighted, dexterity-impaired individual may use voice-controlled assistive technologies to access a visual interface. If an author hides visible link text "Go to checkout" and exposes similar, yet non-identical link text "Check out now" to the accessibility API, the user may be unable to access the interface they perceive using voice control. Similar problems may also arise for screen reader users. For example, a sighted telephone support technician may attempt to have the blind screen reader user click the "Go to checkout" link, which they may be unable to find using a type-ahead item search ("Go to…").

      At the time of this writing, aria-hidden="false" is known to work inconsistently in browsers. As future implementations improve, use caution and test thoroughly before relying on this approach.

      -

      It is recommended that authors key visibility of elements off this attribute, rather than change visibility and separately update this property. CSS 2 introduced a way to select on attribute values ([[CSS3-SELECTORS]]). The following CSS declaration makes content visible unless the aria-hidden attribute is true; scripts need only update the value of this attribute to change visibility:

      -
      [aria-hidden="true"] { visibility: hidden; }
      Characteristics:
      Related Concepts:
      Used in Roles:All elements of the base markupUse as a global deprecated in ARIA 1.2
      Inherits into Roles:
      @@ -9685,6 +11725,7 @@

      Definitions of States and Properties (all aria-* attributes)

      If the value is computed to be invalid or out-of-range, the application author SHOULD set this attribute to true. User agents SHOULD inform the user of the error. Application authors SHOULD provide suggestions for corrections if they are known.

      When the user attempts to submit data involving a field for which aria-required is true, authors MAY use the aria-invalid attribute to signal there is an error. However, if the user has not attempted to submit the form, authors SHOULD NOT set the aria-invalid attribute on required widgets simply because the user has not yet entered data.

      For future expansion, the aria-invalid attribute is an enumerated type. Any value not recognized in the list of allowed values MUST be treated by user agents as if the value true had been provided. If the attribute is not present, or its value is false, or its value is an empty string, the default value of false applies.

      +

      This state is being deprecated as a global state in ARIA 1.2. In future versions it will only be allowed on roles where it is specifically supported.

      Characteristics:
      @@ -9697,11 +11738,11 @@

      Definitions of States and Properties (all aria-* attributes)

      - + - + @@ -9745,7 +11786,7 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-keyshortcuts

      Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

      -

      The value of the aria-keyshortcuts attribute is a space-delimited list of keyboard shortcuts that can be pressed to activate a command or textbox widget. The keys defined in the shortcuts represent the physical keys pressed and not the actual characters generated. Each keyboard shortcut consists of one or more tokens delimited by the plus sign ("+") representing zero or more modifier keys and exactly one non-modifier key that must be pressed simultaneously to activate the given shortcut.

      +

      The value of the aria-keyshortcuts attribute is a space-separated list of keyboard shortcuts that can be pressed to activate a command or textbox widget. The keys defined in the shortcuts represent the physical keys pressed and not the actual characters generated. Each keyboard shortcut consists of one or more tokens delimited by the plus sign ("+") representing zero or more modifier keys and exactly one non-modifier key that must be pressed simultaneously to activate the given shortcut.

      Authors MUST specify modifier keys exactly according to the UI Events KeyboardEvent key Values spec [[!uievents-key]] - for example, "Alt", "Control", "Shift", "Meta", or "AltGraph". Note that Meta corresponds to the Command key, and Alt to the Option key, on Apple computers.

      The valid names for non-modifier keys are any printable character such as "A", "B", "1", "2", "$", "Plus" for a plus sign, "Space" for the spacebar, or the names of any other non-modifier key specified in the UI Events KeyboardEvent key Values spec [[!uievents-key]] - for example, "Enter", "Tab", "ArrowRight", "PageDown", "Escape", or "F1". The use of "Space" for the spacebar is an exception to the UI Events KeyboardEvent key Values spec [[!uievents-key]] as the space or spacebar key is encoded as ' ' and would be treated as a whitespace character.

      Authors MUST ensure modifier keys come first when they are part of a keyboard shortcut. Authors MUST ensure that required non-modifier keys come last when they are part of a shortcut. The order of the modifier keys is not otherwise significant, so "Alt+Shift+T" and "Shift+Alt+T" are equivalent, but "T+Shift+Alt" is not valid because all of the modifier keys don't come first, and "Alt" is not valid because it doesn't include at least one non-modifier key.

      @@ -9765,7 +11806,7 @@

      Definitions of States and Properties (all aria-* attributes)

      User agents MUST NOT change keyboard behavior in response to the aria-keyshortcuts attribute. Authors MUST handle scripted keyboard events to process aria-keyshortcuts. The aria-keyshortcuts attribute exposes the existence of these shortcuts so that assistive technologies can communicate this information to users.

      Authors SHOULD provide a way to expose keyboard shortcuts so that all users may discover them, such as through the use of a tooltip. Authors MUST ensure that aria-keyshortcuts applied to disabled elements are unavailable.

      -

      Authors SHOULD avoid implementing shortcut keys that inhibit operating system, user agent, or assistive technology functionality. This requires the author to carefully consider both which keys to assign and the contexts and conditions in which the keys are available to the user. For guidance, see the keyboard shortcuts section of the WAI-ARIA Authoring Practices Guide [[WAI-ARIA-PRACTICES-1.1]].

      +

      Authors SHOULD avoid implementing shortcut keys that inhibit operating system, user agent, or assistive technology functionality. This requires the author to carefully consider both which keys to assign and the contexts and conditions in which the keys are available to the user. For guidance, see the keyboard shortcuts section of the WAI-ARIA Authoring Practices.

      Characteristics:
      Related Concepts:
      Used in Roles:All elements of the base markupUse as a global deprecated in ARIA 1.2
      Inherits into Roles:
      @@ -9800,7 +11841,7 @@

      Definitions of States and Properties (all aria-* attributes)

      Defines a string value that labels the current element. See related aria-labelledby.

      The purpose of aria-label is the same as that of aria-labelledby. It provides the user with a recognizable name of the object. The most common accessibility API mapping for a label is the accessible name property.

      -

      If the label text is visible on screen, authors SHOULD use aria-labelledby and SHOULD NOT use aria-label. There may be instances where the name of an element cannot be determined programmatically from the content of the element, and there are cases where providing a visible label is not the desired user experience. Most host languages provide an attribute that could be used to name the element (e.g., the title attribute in HTML), yet this could present a browser tooltip. In the cases where a visible label or visible tooltip is undesirable, authors MAY set the accessible name of the element using aria-label. As required by the text alternative computation, user agents give precedence to aria-labelledby over aria-label when computing the accessible name property.

      +

      If the label text is available in the DOM (i.e. typically visible text content), authors SHOULD use aria-labelledby and SHOULD NOT use aria-label. There may be instances where the name of an element cannot be determined programmatically from the DOM, and there are cases where referencing DOM content is not the desired user experience. Most host languages provide an attribute that could be used to name the element (e.g., the title attribute in [[HTML]]), yet this could present a browser tooltip. In the cases where DOM content or a tooltip is undesirable, authors MAY set the accessible name of the element using aria-label. As required by the accessible name and description computation, user agents give precedence to aria-labelledby over aria-label when computing the accessible name property.

      Characteristics:
      @@ -9813,11 +11854,11 @@

      Definitions of States and Properties (all aria-* attributes)

      - + - + @@ -9833,9 +11874,9 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-labelledby
      -

      Identifies the element (or elements) that labels the current element. See related aria-describedby.

      +

      Identifies the element (or elements) that labels the current element. See related aria-label and aria-describedby.

      The purpose of aria-labelledby is the same as that of aria-label. It provides the user with a recognizable name of the object. The most common accessibility API mapping for a label is the accessible name property.

      -

      If the interface is such that it is not possible to have a visible label on the screen, authors SHOULD use aria-label and SHOULD NOT use aria-labelledby. As required by the text alternative computation, user agents give precedence to aria-labelledby over aria-label when computing the accessible name property.

      +

      If the interface is such that it is not possible to have a visible label on the screen, authors SHOULD use aria-label and SHOULD NOT use aria-labelledby. As required by the accessible name and description computation, user agents give precedence to aria-labelledby over aria-label when computing the accessible name property.

      The aria-labelledby attribute is similar to aria-describedby in that both reference other elements to calculate a text alternative, but a label should be concise, where a description is intended to provide more verbose information.

      The expected spelling of this property in U.S. English is "labeledby." However, the accessibility API features to which this property is mapped have established the "labelledby" spelling. This property is spelled that way to match the convention and minimize the difficulty for developers.

      @@ -9851,11 +11892,11 @@

      Definitions of States and Properties (all aria-* attributes)

      - + - + @@ -9868,6 +11909,56 @@

      Definitions of States and Properties (all aria-* attributes)

      Characteristics:
      Related Concepts:
      Used in Roles:All elements of the base markupAll elements of the base markup except for some roles or elements that prohibit its use
      Inherits into Roles:
      Related Concepts:
      Used in Roles:All elements of the base markupAll elements of the base markup except for some roles or elements that prohibit its use
      Inherits into Roles:
      +
      + aria-braillelabel +
      +

      Defines a string value that labels the current element, which is intended to be converted into Braille. See related aria-label.

      +

      The purpose of aria-braillelabel is similar to that of aria-label. It provides the user with a recognizable name of the object in Braille.

      +

      The aria-braillelabel property gives authors the ability to override how assistive technologies localize and express the accessible name of an element in Braille. Thus inappropriately using aria-braillelabel may inhibit users' ability to understand an element on braille interfaces. Authors SHOULD limit use of aria-braillelabel to instances where the name of an element when converted to Braille is not the desired user experience.

      +

      When using aria-braillelabel, authors SHOULD also ensure that:

      +
        +
      1. The element to which aria-braillelabel is applied has a valid accessible name.
      2. +
      3. The value of aria-braillelabel is not empty or does not contain only whitespace characters.
      4. +
      5. The value of aria-braillelabel does not contain any characters in Unicode Braille Patterns (U+2800..U+28FF) or consists of only characters in Unicode Braille Patterns (U+2800..U+28FF) while not containing only Braille Pattern dots-0 (U+2800).
      6. +
      7. The value of aria-braillelabel is not identical to the element's accessible name.
      8. +
      +

      Note that Assistive Technologies with braille support can convert the accessible name to Braille. In addition, assistive technologies will be able to customize such braille output according to user preferences. Using only the accessible name, e.g., from content or via aria-label is almost always the better user experience and authors are strongly discouraged from using aria-braillelabel to replicate aria-label. Instead, aria-braillelabel is meant to be used only if the accessible name cannot provide an adequate braille representation, i.e., when a specialized braille description is very different from a text description converted to Braille. It is very important to note that when using aria-braillelabel authors are solely responsible to align the attribute value with the document language and clearly communicate the use of this attribute to the user. This is even more important when the value consists of Unicode Braille Patterns because Assistive Technologies will pass such content directly to the user without applying user specific braille translations; in general, authors are strongly discouraged from using Unicode Braille Patterns in aria-braillelabel. +

      +

      Assistive technologies SHOULD use the value of aria-braillelabel when presenting the accessible name of an element in Braille, but SHOULD NOT change other functionality. For example, an assistive technology that provides aural rendering SHOULD use the accessible name.

      +

      Assistive technologies SHOULD expose the aria-braillelabel property as follows:

      +
        +
      1. If the value of aria-braillelabel does not contain characters in Unicode Braille Patterns (U+2800..U+28FF), translate the value according to the user's preferred translation table.
      2. +
      3. Otherwise, pass the value to the user without translation.
      4. +
      +

      The following example shows the use of aria-braillelabel to customize a button's name in braille output.

      +
      <button aria-braillelabel="****">
      +  <img alt="4 stars" src="images/stars.jpg">
      +</button>
      +

      In the previous example, a braille display may display "btn ****" in Braille rather than the verbose "btn gra 4 stars".

      + + + + + + + + + + + + + + + + + + + + + + +
      Characteristics:
      CharacteristicValue
      Used in Roles:All elements of the base markup
      Inherits into Roles:Placeholder
      Value:string
      +
      aria-level
      @@ -9959,7 +12050,7 @@

      Definitions of States and Properties (all aria-* attributes)

      off (default) - Indicates that updates to the region should not be presented to the user unless the used is currently focused on that region. + Indicates that updates to the region should not be presented to the user unless the user is currently focused on that region. polite @@ -10192,7 +12283,7 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-owns

      Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship. See related aria-controls.

      -

      The value of the aria-owns attribute is a space-separated list of IDREFS that reference one or more elements in the document by ID. The reason for adding aria-owns is to expose a parent/child contextual relationship to assistive technologies that is otherwise impossible to infer from the DOM.

      +

      The value of the aria-owns attribute is a space-separated ID reference list that references one or more elements in the document by ID. The reason for adding aria-owns is to expose a parent/child contextual relationship to assistive technologies that is otherwise impossible to infer from the DOM.

      If an element has both aria-owns and DOM children then the order of the child elements with respect to the parent/child relationship is the DOM children first, then the elements referenced in aria-owns. If the author intends that the DOM children are not first, then list the DOM children in aria-owns in the desired order. Authors SHOULD NOT use aria-owns as a replacement for the DOM hierarchy. If the relationship is represented in the DOM, do not use aria-owns. Authors MUST ensure that an element's ID is not specified in more than one other element's aria-owns attribute at any time. In other words, an element can have only one explicit owner.

      @@ -10229,7 +12320,8 @@

      Definitions of States and Properties (all aria-* attributes)

      Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

      Authors SHOULD NOT use aria-placeholder instead of a label as their purposes are different: The label indicates what kind of information is expected. The placeholder text is a hint about the expected value. See related aria-labelledby and aria-label.

      Authors SHOULD present this hint to the user by displaying the hint text at any time the control's value is the empty string. This includes cases where the control first receives focus, and when users remove a previously-entered value.

      -

      As is the case with the related HTML placeholder attribute, use of placeholder text as a replacement for a displayed label can reduce the accessibility and usability of the control for a range of users including older users and users with cognitive, mobility, fine motor skill or vision impairments. While the hint given by the control's label is shown at all times, the short hint given in the placeholder attribute is only shown before the user enters a value. Furthermore, placeholder text may be mistaken for a pre-filled value, and as commonly implemented the default color of the placeholder text provides insufficient contrast and the lack of a separate visible label reduces the size of the hit region available for setting focus on the control.

      +

      As is the case with the related placeholder attribute in [[HTML]], use of placeholder text as a replacement for a displayed label can reduce the accessibility and usability of the control for a range of users including older users and users with cognitive, mobility, fine motor skill or vision impairments. While the hint given by the control's label is shown at all times, the short hint given in the placeholder attribute is only shown before the user enters a value. Furthermore, placeholder text may be mistaken for a pre-filled value, and as commonly implemented the default color of the placeholder text provides insufficient contrast and the lack of a separate visible label reduces the size of the hit region available for setting focus on the control.

      +

      The following examples do not use the HTML label element as it cannot be used to label HTML elements with contenteditable.

      The following example shows a searchbox in which the user has entered a value:

       <span id="label">Birthday:</span>
      @@ -10252,7 +12344,7 @@ 

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -10317,7 +12409,7 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-pressed

      Indicates the current "pressed" state of toggle buttons. See related aria-checked and aria-selected.

      -

      Toggle buttons require a full press-and-release cycle to change their value. Activating it once changes the value to true, and activating it another time changes the value back to false. A value of mixed means that the values of more than one item controlled by the button do not all share the same value. Examples of mixed-state buttons are described in WAI-ARIA Authoring Practices [[WAI-ARIA-PRACTICES-1.1]]. If the attribute is not present, the button is not a toggle button.

      +

      Toggle buttons require a full press-and-release cycle to change their value. Activating it once changes the value to true, and activating it another time changes the value back to false. A value of mixed means that the values of more than one item controlled by the button do not all share the same value. If the attribute is not present, the button is not a toggle button.

      The aria-pressed attribute is similar but not identical to the aria-checked attribute. Operating systems support pressed on buttons and checked on checkboxes.

      Related Concepts:
      Used in Roles:
      @@ -10399,7 +12491,7 @@

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -10439,13 +12531,13 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-relevant

      Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified. See related aria-atomic.

      -

      The attribute is represented as a space delimited list of the following values: additions, removals, text; or a single catch-all value all.

      +

      The attribute is represented as a space-separated list of the following values: additions, removals, text; or a single catch-all value all.

      This is used to describe semantically meaningful changes, as opposed to merely presentational ones. For example, nodes that are removed from the top of a log are merely removed for purposes of creating room for other entries, and the removal of them does not have meaning. However, in the case of a buddy list, removal of a buddy name indicates that they are no longer online, and this is a meaningful event. In that case aria-relevant will be set to all. When the aria-relevant attribute is not provided, the default value, additions text, indicates that text modifications and node additions are relevant, but that node removals are irrelevant.

      aria-relevant values of removals or all are to be used sparingly. Assistive technologies only need to be informed of content removal when its removal represents an important change, such as a buddy leaving a chat room.

      Text removals should only be considered relevant if one of the specified values is 'removals' or 'all'. For example, for a text change from 'foo' to 'bar' in a live region with a default aria-relevant value, the text addition ('bar') would be spoken, but the text removal ('foo') would not.

      aria-relevant is an optional attribute of live regions. This is a suggestion to assistive technologies, but assistive technologies are not required to present changes of all the relevant types.

      When aria-relevant is not defined, an element's value is inherited from the nearest ancestor with a defined value. Although the value is a token list, inherited values are not additive; the value provided on a descendant element completely overrides any inherited value from an ancestor element.

      -

      When text changes are denoted as relevant, user agents MUST monitor any descendant node change that affects the text alternative computation of the live region as if the accessible name were determined from contents (nameFrom: contents). For example, a text change would be triggered if the HTML alt attribute of a contained image changed. However, no change would be triggered if there was a text change to a node outside the live region, even if that node was referenced (via aria-labelledby) by an element contained in the live region.

      +

      When text changes are denoted as relevant, user agents MUST monitor any descendant node change that affects the accessible name and description computation of the live region as if the accessible name were determined from contents (nameFrom: contents). For example, a text change would be triggered if the HTML alt attribute of a contained image changed. However, no change would be triggered if there was a text change to a node outside the live region, even if that node was referenced (via aria-labelledby) by an element contained in the live region.

      Related Concepts:
      Used in Roles:
      @@ -10488,7 +12580,7 @@

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -10525,7 +12617,7 @@

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -10575,7 +12667,8 @@

      Definitions of States and Properties (all aria-* attributes)

      User agents MUST NOT expose the aria-roledescription property if any of the following conditions exist:

      1. The element to which aria-roledescription is applied does not have a valid WAI-ARIA role or does not have an implicit WAI-ARIA role semantic.
      2. -
      3. The value of aria-roledescription is empty or contains only whitespace characters.
      4. +
      5. The element to which aria-roledescription is applied has an explicit or implicit WAI-ARIA role where aria-roledescription is prohibited.
      6. +
      7. The value of aria-roledescription is empty or contains only whitespace characters.

      Assistive technologies SHOULD use the value of aria-roledescription when presenting the role of an element, but SHOULD NOT change other functionality based on the role of an element that has a value for aria-roledescription. For example, an assistive technology that provides functions for navigating to the next region or button SHOULD allow those functions to navigate to regions and buttons that have an aria-roledescription.

      The following two examples show the use of aria-roledescription to indicate that a non-interactive container is a "slide" in a web-based presentation application.

      @@ -10588,10 +12681,6 @@

      Definitions of States and Properties (all aria-* attributes)

      <!-- remaining slide contents --> </section>

      In the previous examples, a screen reader user may hear "Quarterly Report, slide" rather than the more vague "Quarterly Report, region" or "Quarterly Report, group."

      -

      The following examples show the use of aria-roledescription to indicate that a button in a web-based email client is associated with an "attachment."

      -
      <div role="button" tabindex="0" aria-roledescription="attachment button">family_reunion.jpg</div>
      -
      <button aria-roledescription="attachment button">family_reunion.jpg</button>
      -

      In the previous two examples, because "button" is part of the localized description, a screen reader user should still understand how to interact with that control.

      Characteristics:
      Element nodes are added to the accessibility tree within the live region.
      additions textadditions text (default) Equivalent to the combination of values, "additions text".
      Related Concepts:
      Used in Roles:
      @@ -10691,7 +12780,7 @@

      Definitions of States and Properties (all aria-* attributes)

      aria-rowindex
      -

      Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid. See related aria-rowcount and aria-rowspan.

      +

      Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid. See related aria-rowindextext, aria-rowcount, and aria-rowspan.

      If all of the rows are present in the DOM, it is not necessary to set this attribute as the user agent can automatically calculate the index of each row. However, if only a portion of the rows is present in the DOM at a given moment, this attribute is needed to provide an explicit indication of each row's position with respect to the full table.

      Authors MUST set the value for aria-rowindex to an integer greater than or equal to 1, greater than the aria-rowindex value of any previous rows, and less than or equal to the number of rows in the full table. For a cell or gridcell which spans multiple rows, authors MUST set the value of aria-rowindex to the start of the span.

      Authors SHOULD place aria-rowindex on each row. Authors MAY also place aria-rowindex on all of the children or owned elements of each row.

      @@ -10788,6 +12877,42 @@

      Definitions of States and Properties (all aria-* attributes)

      Characteristics:
      +
      + aria-rowindextext +
      +

      Defines a human readable text alternative of aria-rowindex. See related aria-colindextext.

      +

      Authors SHOULD only use aria-rowindextext when the provided or calculated value of aria-rowindex is not meaningful or does not reflect the displayed index, as can be seen in the game Battleship.

      +

      Authors SHOULD NOT use aria-rowindextext as a replacement for aria-rowindex because some assistive technologies rely upon the numeric row index for the purpose of keeping track of the user's position or providing alternative table navigation.

      +

      Authors SHOULD place aria-rowindextext on each row. Authors MAY also place aria-rowindextext on all of the children or owned elements of each row.

      +
      + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Characteristics:
      CharacteristicValue
      Related Concepts:
      Used in Roles:Placeholder
      Inherits into Roles:Placeholder
      Value:string
      +
      aria-rowspan
      @@ -11017,7 +13142,7 @@

      Definitions of States and Properties (all aria-* attributes)

      Related Concepts: - XForms [[XFORMS10]] range + <range> element max attribute in [[HTML]] Used in Roles: @@ -11052,7 +13177,7 @@

      Definitions of States and Properties (all aria-* attributes)

      Related Concepts: - XForms [[XFORMS10]] range + <range> element min attribute in [[HTML]] Used in Roles: @@ -11078,7 +13203,7 @@

      Definitions of States and Properties (all aria-* attributes)

      The value of aria-valuenow is a decimal number. If the range is a set of numeric values, then aria-valuenow is one of those values. For example, if the range is [0, 1], a valid aria-valuenow is 0.5. A value outside the range, such as -2.5 or 1.1, is invalid.

      For progressbar elements and scrollbar elements, assistive technologies SHOULD render the value to users as a percent, calculated as a position on the range from aria-valuemin to aria-valuemax if both are defined, otherwise the actual value with a percent indicator. For elements with role slider and spinbutton, assistive technologies SHOULD render the actual value to users.

      When the rendered value cannot be accurately represented as a number, authors SHOULD use the aria-valuetext attribute in conjunction with aria-valuenow to provide a user-friendly representation of the range's current value. For example, a slider may have rendered values of small, medium, and large. In this case, the values of aria-valuetext would be one of the strings: small, medium, or large.

      -

      If aria-valuetext is specified, assistive technologies render that instead of the value of aria-valuenow.

      +

      If aria-valuetext is specified, assistive technologies render that instead of the value of aria-valuenow.

      @@ -11091,7 +13216,7 @@

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -11115,7 +13240,7 @@

      Definitions of States and Properties (all aria-* attributes)

      This property is used, for example, on a range widget such as a slider or progress bar.

      If the aria-valuetext attribute is set, authors SHOULD also set the aria-valuenow attribute, unless that value is unknown (for example, on an indeterminate progressbar).

      Authors SHOULD only set the aria-valuetext attribute when the rendered value cannot be meaningfully represented as a number. For example, a slider may have rendered values of small, medium, and large. In this case, the values of aria-valuenow could range from 1 through 3, which indicate the position of each value in the value space, but the aria-valuetext would be one of the strings: small, medium, or large. If the aria-valuetext attribute is absent, the assistive technologies will rely solely on the aria-valuenow attribute for the current value.

      -

      If aria-valuetext is specified, assistive technologies SHOULD render that value instead of the value of aria-valuenow.

      +

      If aria-valuetext is specified, assistive technologies SHOULD render that value instead of the value of aria-valuenow.

      Characteristics:
      Related Concepts:
      Used in Roles:
      @@ -11128,7 +13253,7 @@

      Definitions of States and Properties (all aria-* attributes)

      - + @@ -11147,6 +13272,58 @@

      Definitions of States and Properties (all aria-* attributes)

      +
      +

      Accessibility Tree

      +

      The accessibility tree and the DOM tree are parallel structures. The accessibility tree includes the user interface objects of the user agent and the objects of the document. Accessible objects are created in the accessibility tree for every DOM element that should be exposed to an assistive technology, either because it may fire an accessibility event or because it has a property, relationship or feature which needs to be exposed.

      +
      +

      Excluding Elements from the Accessibility Tree

      +

      The following elements are not exposed via the accessibility API and user agents MUST NOT include them in the accessibility tree:

      +
        +
      • Elements, including their descendent elements, that have host language semantics specifying that the element is not displayed, such as CSS display:none, visibility:hidden, or the HTML hidden attribute.
      • +
      • Elements with none or presentation as the first role in the role attribute. However, their exclusion is conditional. In addition, the element's descendants and text content are generally included. These exceptions and conditions are documented in the presentation (role) section.
      • +
      +

      If not already excluded from the accessibility tree per the above rules, user agents SHOULD NOT include the following elements in the accessibility tree:

      +
        +
      • Elements, including their descendants, that have aria-hidden set to true. In other words, aria-hidden="true" on a parent overrides aria-hidden="false" on descendants.
      • +
      • +

        Any descendants of elements that have the characteristic "Children Presentational: True" unless the descendant is not allowed to be presentational because it meets one of the conditions for exception described in Presentational Roles Conflict Resolution. However, the text content of any excluded descendants is included.

        +

        Elements with the following roles have the characteristic "Children Presentational: True":

        +
          +
        • button
        • +
        • checkbox
        • +
        • img
        • +
        • menuitemcheckbox
        • +
        • menuitemradio
        • +
        • meter
        • +
        • option
        • +
        • progressbar
        • +
        • radio
        • +
        • scrollbar
        • +
        • separator
        • +
        • slider
        • +
        • switch
        • +
        • tab
        • +
        +
      • +
      +
      +
      +

      Including Elements in the Accessibility Tree

      +

      If not excluded from the accessibility tree per the rules above in Excluding Elements in the Accessibility Tree, user agents MUST provide an accessible object in the accessibility tree for DOM elements that meet any of the following criteria:

      +
        +
      • Elements that are not hidden and may fire an accessibility API event: +
          +
        • Elements that are focusable even if the element or one of its ancestor elements has its aria-hidden attribute set to true.
        • +
        • Elements that are a valid target of an aria-activedescendant attribute.
        • +
        +
      • +
      • Elements that have an explicit role or a global WAI-ARIA attribute and do not have aria-hidden set to true. (See Excluding Elements in the Accessibility Tree for additional guidance on aria-hidden.)
      • +
      • Elements that are not hidden and have an ID that is referenced by another element via a WAI-ARIA property. +

        Text equivalents for hidden referenced objects may still be used in the name and description computation even when not included in the accessibility tree.

        +
      • +
      +
      +

      Implementation in Host Languages

      The roles, state, and properties defined in this specification do not form a complete web language or format. They are intended to be used in the context of a host language. This section discusses how host languages are to implement WAI-ARIA, to ensure that the markup specified here will integrate smoothly and effectively with the host language markup.

      @@ -11159,7 +13336,7 @@

      Role Attribute

    3. The attribute name MUST be role;
    4. The attribute value MUST allow a token list as the value;
    5. The appearance of the name literal of any concrete WAI-ARIA role as one of these tokens MUST NOT in and of itself make the attribute value illegal in the host-language syntax; and
    6. -
    7. The first name literal of a non-abstract WAI-ARIA role in the list of tokens in the role attribute defines the role according to which the user agent MUST process the element. User Agent processing for roles is defined in the Core Accessibility API Mappings [[CORE-AAM-1.1]].
    8. +
    9. The first name literal of a non-abstract WAI-ARIA role in the list of tokens in the role attribute defines the role according to which the user agent MUST process the element. User Agent processing for roles is defined in the Core Accessibility API Mappings [[CORE-AAM-1.2]].
    10. @@ -11177,14 +13354,14 @@

      State and Property Attributes

      Focus Navigation

      -

      An implementing host language MUST provide support for the author to make all interactive elements focusable, that is, any renderable or event-receiving elements. An implementing host language MUST provide a facility to allow web authors to define whether these focusable, interactive elements appear in the default tab navigation order. The tabindex attribute in HTML 5 is an example of one implementation.

      +

      An implementing host language MUST provide support for the author to make all interactive elements focusable, that is, any renderable or event-receiving elements. An implementing host language MUST provide a facility to allow web authors to define whether these focusable, interactive elements appear in the default tab navigation order. The tabindex attribute in HTML is an example of one implementation.

      Implicit WAI-ARIA Semantics

      WAI-ARIA is designed to provide semantic information about objects when host languages lack native semantics for the object. WAI-ARIA is designed, however, to provide additional semantics for many host languages. Furthermore, host languages over time can evolve and provide new native features that correspond to WAI-ARIA features. Therefore, there are many situations in which WAI-ARIA semantics are redundant with host language semantics.

      These host language features can be viewed as having "implicit WAI-ARIA semantics". User agent processing of features with implicit WAI-ARIA semantics would be similar to the processing for the WAI-ARIA feature. The processing might not be identical because of lexical differences between the host language feature and the WAI-ARIA feature, but generally the user agent would expose the same information to the accessibility API. Features with implicit WAI-ARIA semantics satisfy WAI-ARIA structural requirements such as required owned elements, required states and properties, etc. and do not require explicit WAI-ARIA semantics to be provided. On elements with implicit WAI-ARIA roles, authors can also use WAI-ARIA states and properties supported by those roles without requiring explicit indication of the WAI-ARIA role.

      For example, if an element with the functionality already exists, such as a checkbox or radio button, use the native semantics of the host language. WAI-ARIA markup is only intended to be used to enhance the native semantics (e.g., indicating that the element is required with aria-required), or to change the semantics to a different purpose from the standard functionality of the element.

      -

      Implicit WAI-ARIA semantics affect the conflict resolution procedures in the following section, Conflicts with Host Language Semantics. Therefore, implicit WAI-ARIA semantics need to be defined in a normative specification, such as the host language specification or the Core Accessibility API Mappings [[CORE-AAM-1.1]].

      +

      Implicit WAI-ARIA semantics affect the conflict resolution procedures in the following section, Conflicts with Host Language Semantics. Therefore, implicit WAI-ARIA semantics need to be defined in a normative specification, such as the host language specification or the Core Accessibility API Mappings.

      Conflicts with Host Language Semantics

      @@ -11193,10 +13370,11 @@

      Conflicts with Host Language Semantics

      Host languages can have features that have implicit WAI-ARIA semantics corresponding to roles. When a WAI-ARIA role is provided, user agents MUST use the semantic of the WAI-ARIA role for processing, not the native semantic, unless the role requires WAI-ARIA states and properties whose attributes are explicitly forbidden on the native element by the host language. Values for roles do not conflict in the same way as values for states and properties (for example, the HTML 'checked' attribute and the 'aria-checked' attribute could have conflicting values), and authors are expected to have valid reason to provide a WAI-ARIA role even on elements that would not normally be repurposed.

      When WAI-ARIA states and properties correspond to host language features that have the same implicit WAI-ARIA semantic, it can be particularly problematic to use the WAI-ARIA feature. If the WAI-ARIA feature and the host language feature are both provided but their values are not kept in sync, user agents and assistive technologies cannot know which value to use. Therefore, to prevent providing conflicting states and properties to assistive technologies, host languages MUST explicitly declare where the use of WAI-ARIA attributes on each host language element conflicts with native attributes for that element. When a host language declares a WAI-ARIA attribute to be in direct semantic conflict with a native attribute for a given element, user agents MUST ignore the WAI-ARIA attribute and instead use the host language attribute with the same implicit semantic.

      Host languages MAY document features that cannot be overridden with WAI-ARIA (these are called "strong native semantics"). These can be features that have implicit WAI-ARIA semantics, as well as features where the processing would be uncertain if the semantics were changed with WAI-ARIA. Conformance checkers MAY signal an error or warning when a WAI-ARIA role is used on elements with strong native semantics, but as described above, user agents MUST still use the value of the semantic of the WAI-ARIA role when exposing the element to accessibility APIs unless the native host language semantic is permanently presentational.

      -

      The opportunity for host languages to create exceptions to the WAI-ARIA override of native features is meant to avoid potential author errors or problems with intrinsic processing of host language features. Author errors could happen when a host language and WAI-ARIA provide similar but not identical features, where it might not be clear how changing one but not the other affects the accessibility API. Intrinsic processing refers to the way a feature is processed, beyond simple rendering and exposure to the Accessibility API, that cannot reasonably be changed in response to a ARIA feature, and would lead to unpredictable results were ARIA allowed. In these situations, there is good reason for host languages to limit the scope of WAI-ARIA. However, this provision does not give blanket permission for host languages to forbid the use of WAI-ARIA simply by documenting, feature by feature, that it may not be used. Host languages should create restrictions on the use of ARIA only when it is critical to effective processing of content.

      +

      The opportunity for host languages to create exceptions to the WAI-ARIA override of native features is meant to avoid potential author errors or problems with intrinsic processing of host language features. Author errors could happen when a host language and WAI-ARIA provide similar but not identical features, where it might not be clear how changing one but not the other affects the accessibility API. Intrinsic processing refers to the way a feature is processed, beyond simple rendering and exposure to the Accessibility API, that cannot reasonably be changed in response to an ARIA feature, and would lead to unpredictable results were ARIA allowed. In these situations, there is good reason for host languages to limit the scope of WAI-ARIA. However, this provision does not give blanket permission for host languages to forbid the use of WAI-ARIA simply by documenting, feature by feature, that it may not be used. Host languages should create restrictions on the use of ARIA only when it is critical to effective processing of content.

      Certain ARIA features are critical to building a complete model in the accessibility API. Such features are not expected to conflict with native host language semantics (though they may complement them). Therefore, host languages MUST NOT declare strong native semantics that prevent use of the following ARIA features:

      • aria-describedby
      • +
      • aria-description
      • aria-label
      • aria-labelledby
      @@ -11216,134 +13394,308 @@

      State and Property Attribute Processing

      State and property attributes are included in host languages, and therefore syntax for representation of their value types is governed by the host language. For each of the value types defined in Value, an appropriate value type from the host language is used. Recommended correspondences between WAI-ARIA value types and various host language value types are listed in Mapping WAI-ARIA Value types to languages. This is a non-normative mapping in order to accommodate new host languages supporting WAI-ARIA.

      The list value types—ID reference list and token list—allow more than one value of the given type to be provided. The values are separated by delimiter characters recognized by the host language for list attributes, such as space characters, commas, etc. Some languages may require a specific, single delimiter, while others may allow various delimiters.

      Global states and properties are supported on any element in the host language. However, authors MUST only use non-global states and properties on elements with a role supporting the state or property; either defined as an explicit WAI-ARIA role, or as defined by the host language implicit WAI-ARIA semantic matching an appropriate WAI-ARIA role. When a role attribute is added to an element, the semantics and behavior of the element, including support for WAI-ARIA states and properties, are augmented or overridden by the role behavior. User agents MUST ignore non-global states and properties used on an element without a role supporting the state or property; either defined as an explicit WAI-ARIA role, or as defined by the host language WAI-ARIA semantic matching an appropriate WAI-ARIA role. For example, the aria-valuetext attribute may be used on a progressbar.

      -

      WAI-ARIA roles have associated states and properties that are qualified as "supported" or "required". An example of a property supported by the combobox role is aria-autocomplete. The property is designated "supported" in this case because a given combobox might or might not implement auto completion. In contrast, the combobox role requires the aria-expanded state in order to indicate that it is expandable. Comboboxes have a descendant listbox that is either open or closed. If the listbox is open, the combobox is in its expanded state; otherwise it is collapsed.

      +

      WAI-ARIA roles have associated states and properties that are qualified as "supported" or "required". An example of a property supported by the combobox role is aria-autocomplete. The property is designated "supported" in this case because a given combobox might or might not implement auto completion. In contrast, the combobox role requires the aria-expanded state in order to indicate that it is expandable. Comboboxes have a controlled popup element, such as a listbox, that is either open or closed. If the listbox is open, the combobox is in its expanded state; otherwise it is collapsed.

      When WAI-ARIA roles are used, supported states and properties that are not present in the DOM are treated according to their default value. Keeping with the combobox example, a missing aria-autocomplete attribute is equivalent to aria-autocomplete="none", meaning the combobox does not offer auto completion.

      However, required states and properties that are absent are an author error. Missing required states and properties are treated as if they were present and have an implicit neutral value that is not necessarily their default value. For example, the default value of aria-expanded is undefined, meaning neither expandable nor collapsible. But that does not apply to the case of a combobox. In this case, aria-expanded is needed to convey the expandable/collapsible nature of the combobox. Thus, the implicit value of aria-expanded for the combobox role is false, meaning expandable (and currently collapsed). The characteristics table associated with each WAI-ARIA role has an "Implicit Value for Role" entry that specifies the value of a state or property to use in the context of that role when the state or property is missing.

      Elements that have implicit WAI-ARIA semantics support the full set of WAI-ARIA states and properties supported by the corresponding role. Therefore, authors MAY omit the role when setting states and properties. The role is only needed when the implicit WAI-ARIA role of the element needs to be changed.

      -

      Sometimes states and properties are present in the DOM but have a zero-length string ("") as their value. This is equivalent to their absence. User agents SHOULD treat state and property attributes with a value of "" the same as they treat an absent attribute. For supported states and properties, this corresponds to the default value, but if it is a required attribute, it signals an author error, and the implicit value for the role is used.

      +

      Sometimes states and properties are present in the DOM but have a zero-length string ("") as their value. Authors MAY specify a zero-length string ("") for any supported (but not required) state or property. User agents SHOULD treat state and property attributes with a value of "" the same as they treat an absent attribute. For supported states and properties, this corresponds to the default value, but if it is a required attribute, it signals an author error, and the implicit value for the role is used.

      +
      +

      ID Reference Error Processing

      +

      User agents SHOULD ignore ID references that do not match the ID of another element in the same document.

      +

      It is the web author's responsibility to ensure that IDs are unique. If more than one element has the same ID, the user agent SHOULD use the first element found with the given ID. The behavior will be the same as getElementById.

      +

      If the same element is specified multiple times in a single WAI-ARIA relation, user agents SHOULD return multiple pointers to the same element.

      +

      aria-activedescendant is defined as referencing only a single ID reference. Any aria-activedescendant value that does not match an existing ID reference exactly is an author error and will not match any element in the DOM.

      +
      +
      +
      +

      CSS Selectors

      +

      This section might be removed in a future version.

      +

      Support for attribute selectors MUST include WAI-ARIA attributes. For example, .fooMenuItem[aria-haspopup="true"] would select all elements with class fooMenuItem, and WAI-ARIA property aria-haspopup with value of true. The presentation MUST be updated for dynamic changes to WAI-ARIA attributes. This allows authors to match styling with WAI-ARIA semantics.

      +
      + +
      +

      Handling Author Errors

      +
      +

      Roles

      +

      User agents are expected to perform validation of WAI-ARIA roles.

      +

      As stated in the Definition of Roles section, it is considered an authoring error to use abstract roles in content. User agents MUST NOT map abstract roles via the standard role mechanism of the accessibility API.

      +

      If the role attribute contains no tokens matching the name of a non-abstract WAI-ARIA role, the user agent MUST treat the element as if no role had been provided. For example, <table role="foo"> should be exposed in the same way as <table> and <input type="text" role="structure"> in the same way as <input type="text">.

      +
      +
      +

      States and Properties

      +

      In general, user agents do not do much validation of WAI-ARIA properties. User agents MAY do some minor validation on request, such as making sure valid IDs are specified for WAI-ARIA relations, and enforcing things like aria-posinset being within 1 and aria-setsize, inclusive. User agents are not responsible for logical validation, such as the following:

      +
        +
      1. Circular references created by relations, such as specifying that two elements own each other.
      2. +
      3. Correct usage with regard to DOM tree structure, such as an element being owned by more than one other element.
      4. +
      5. Elements with WAI-ARIA roles correctly implement the behavior of the specified role. For example, user agents do not verify that an element with a role of checkbox actually behaves like a checkbox.
      6. +
      7. Elements that do not correctly observe required child / parent role relationships or that appear elsewhere than in their required parent.
      8. +
      9. Determining whether aria-activedescendant actually points to an owned element of the container widget.
      10. +
      11. Determining implicit values of aria-setsize and aria-posinset when they are specified on some but not all the elements of the set.
      12. +
      +

      If the author specifies a non-numeric value for a decimal or integer value type, the user agent SHOULD do the following:

      +
        +
      • When asked for the string version of the property, return the string if specified by the author.
      • +
      • When asked for the numeric version: + +
      • +
      +

      If a WAI-ARIA property contains an unknown or disallowed value, the user agent SHOULD expose to platform accessibility APIs as follows:

      +
        +
      • When exposing as a platform accessibility API attribute, expose the unknown value — do not vet it against possible values.
      • +
      • When exposing as a platform API Boolean state: + +
      • +
      • Otherwise, ignore the value and treat the property as not present.
      • +
      +

      In UIA, the user agent might leave the corresponding property set to "unsupported."

      +

      User agents MUST NOT expose WAI-ARIA attributes that reference unresolved IDs. For example:

      +
        +
      • When the state or property has only one ID reference that cannot be resolved, treat as if the state or property is not present.
      • +
      • When the state or property has a list of ID references, ignore any that can't be resolved. If none in the list can be resolved, treat as if the state or property is not present.
      • +
      +

      User Agents MUST NOT expose aria-roledescription when:

      +
        +
      • The element it is applied to has an invalid WAI-ARIA role, or
      • +
      • The element does not have an implicit WAI-ARIA role
      • +
      +

      If a required WAI-ARIA attribute for a given role is missing, user agents SHOULD process the attribute as if the values given in the following table were provided.

      +
      Characteristics:
      Related Concepts:
      Used in Roles:
      + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Fallback values for missing required attributes
      WAI-ARIA roleRequired AttributeFallback value
      checkboxaria-checkedfalse
      comboboxaria-controlsno mapping
      comboboxaria-expandedfalse
      headingaria-level2
      menuitemcheckboxaria-checkedfalse
      menuitemradioaria-checkedfalse
      radioaria-checkedfalse
      scrollbararia-controlsno mapping
      scrollbararia-valuenowIf missing or not a number,(aria-valuemax - aria-valuemin) / 2. If present but less than aria-valuemin, the value of aria-valuemin. If present but greater than aria-valuemax, the value of aria-valuemax.
      separator (if focusable)aria-valuenowIf missing or not a number,(aria-valuemax - aria-valuemin) / 2. If present but less than aria-valuemin, the value of aria-valuemin. If present but greater than aria-valuemax, the value of aria-valuemax.
      slideraria-valuenowIf missing or not a number,(aria-valuemax - aria-valuemin) / 2. If present but less than aria-valuemin, the value of aria-valuemin. If present but greater than aria-valuemax, the value of aria-valuemax.
      switcharia-checkedfalse
      meteraria-valuenowA value matching the implicit or explicitly set aria-valuemin.
      +

      Implicit Values for non-required states and properties appear in the characteristics table for each role. These are not considered fallback values so are not included here.

    IDL Interface

    -

    Conforming user agents MUST implement the following IDL interfaces.

    -
    -

    Interface Mixin AccessibilityRole

    +

    Conforming user agents MUST implement the following IDL interface.

    +
    +

    Interface Mixin ARIAMixin

    -			interface mixin AccessibilityRole {
    +			interface mixin ARIAMixin {
     				attribute DOMString? role;
    +
    +				
    +				attribute DOMString ariaAtomic;
    +				attribute DOMString ariaAutoComplete;
    +				attribute DOMString ariaBusy;
    +				attribute DOMString ariaChecked;
    +				attribute DOMString ariaColCount;
    +				attribute DOMString ariaColIndex;
    +				attribute DOMString ariaColIndexText;
    +				attribute DOMString ariaColSpan;
    +				
    +				attribute DOMString ariaCurrent;
    +				
    +				attribute DOMString ariaDescription;
    +				
    +				attribute DOMString ariaDisabled;
    +				
    +				attribute DOMString ariaExpanded;
    +				
    +				attribute DOMString ariaHasPopup;
    +				attribute DOMString ariaHidden;
    +				attribute DOMString ariaInvalid;
    +				attribute DOMString ariaKeyShortcuts;
    +				attribute DOMString ariaLabel;
    +				
    +				attribute DOMString ariaLevel;
    +				attribute DOMString ariaLive;
    +				attribute DOMString ariaModal;
    +				attribute DOMString ariaMultiLine;
    +				attribute DOMString ariaMultiSelectable;
    +				attribute DOMString ariaOrientation;
    +				
    +				attribute DOMString ariaPlaceholder;
    +				attribute DOMString ariaPosInSet;
    +				attribute DOMString ariaPressed;
    +				attribute DOMString ariaReadOnly;
    +				
    +				attribute DOMString ariaRequired;
    +				attribute DOMString ariaRoleDescription;
    +				attribute DOMString ariaRowCount;
    +				attribute DOMString ariaRowIndex;
    +				attribute DOMString ariaRowIndexText;
    +				attribute DOMString ariaRowSpan;
    +				attribute DOMString ariaSelected;
    +				attribute DOMString ariaSetSize;
    +				attribute DOMString ariaSort;
    +				attribute DOMString ariaValueMax;
    +				attribute DOMString ariaValueMin;
    +				attribute DOMString ariaValueNow;
    +				attribute DOMString ariaValueText;
     			};
    -			Element includes AccessibilityRole;
     		
    -

    User agents MUST reflect the role content attribute as the role IDL attribute.

    + +

    Interfaces that include ARIAMixin must provide the following algorithms:

    + +
      +
    • ARIAMixin getter steps, which take the host interface instance, IDL attribute name, and content attribute name, and must return a string value; and +
    • ARIAMixin setter steps, which take the host interface instance, IDL attribute name, content attribute name, and string value, and must return nothing.
    • +
    + +

    For every IDL attribute idlAttribute defined in ARIAMixin, on getting, it must perform the following steps:

    + +
      +
    1. Let contentAttribute be the ARIA content attribute determined by looking up idlAttribute in the ARIA Attribute Correspondence table.

    2. + +
    3. Return the result of running the ARIAMixin getter steps, given this, idlAttribute, and contentAttribute.

    4. +
    + +

    Similarly, on setting, it must perform the following steps:

    + +
      +
    1. Let contentAttribute be the ARIA content attribute determined by looking up idlAttribute in the ARIA Attribute Correspondence table.

    2. + +
    3. Run the ARIAMixin setter steps, given this, idlAttribute, contentAttribute, and the given value.

    4. +
    + +

    This very general framework is motivated by the desire for different host interfaces, such as Element and ElementInternals, to give these IDL attributes different behaviors. The alternative is requiring each host interface to duplicate the IDL attributes independently, so that they can specify independent behaviors, but that comes with a high risk of them getting out of sync.

    -
    -

    Interface Mixin AriaAttributes

    -
    -			interface mixin AriaAttributes {
    -				attribute DOMString? ariaActiveDescendant;
    -				attribute DOMString? ariaAtomic;
    -				attribute DOMString? ariaAutoComplete;
    -				attribute DOMString? ariaBusy;
    -				attribute DOMString? ariaChecked;
    -				attribute DOMString? ariaColCount;
    -				attribute DOMString? ariaColIndex;
    -				attribute DOMString? ariaColSpan;
    -				attribute DOMString? ariaControls;
    -				attribute DOMString? ariaCurrent;
    -				attribute DOMString? ariaDescribedBy;
    -				attribute DOMString? ariaDetails;
    -				attribute DOMString? ariaDisabled;
    -				attribute DOMString? ariaErrorMessage;
    -				attribute DOMString? ariaExpanded;
    -				attribute DOMString? ariaFlowTo;
    -				attribute DOMString? ariaHasPopup;
    -				attribute DOMString? ariaHidden;
    -				attribute DOMString? ariaInvalid;
    -				attribute DOMString? ariaKeyShortcuts;
    -				attribute DOMString? ariaLabel;
    -				attribute DOMString? ariaLabelledBy;
    -				attribute DOMString? ariaLevel;
    -				attribute DOMString? ariaLive;
    -				attribute DOMString? ariaModal;
    -				attribute DOMString? ariaMultiLine;
    -				attribute DOMString? ariaMultiSelectable;
    -				attribute DOMString? ariaOrientation;
    -				attribute DOMString? ariaOwns;
    -				attribute DOMString? ariaPlaceholder;
    -				attribute DOMString? ariaPosInSet;
    -				attribute DOMString? ariaPressed;
    -				attribute DOMString? ariaReadOnly;
    -				attribute DOMString? ariaRelevant;
    -				attribute DOMString? ariaRequired;
    -				attribute DOMString? ariaRoleDescription;
    -				attribute DOMString? ariaRowCount;
    -				attribute DOMString? ariaRowIndex;
    -				attribute DOMString? ariaRowSpan;
    -				attribute DOMString? ariaSelected;
    -				attribute DOMString? ariaSetSize;
    -				attribute DOMString? ariaSort;
    -				attribute DOMString? ariaValueMax;
    -				attribute DOMString? ariaValueMin;
    -				attribute DOMString? ariaValueNow;
    -				attribute DOMString? ariaValueText;
    -			};
    -			Element includes AriaAttributes;
    -		
    -
    -

    ARIA Attribute Reflection

    -

    User agents MUST reflect the following content attributes to each of the corresponding IDL attributes.

    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    IDL AttributeReflected ARIA Content Attribute
    ariaActiveDescendantaria-activedescendant
    ariaAtomicaria-atomic
    ariaAutoCompletearia-autocomplete
    ariaBusyaria-busy
    ariaCheckedaria-checked
    ariaColCountaria-colcount
    ariaColIndexaria-colindex
    ariaColSpanaria-colspan
    ariaControlsaria-controls
    ariaCurrentaria-current
    ariaDescribedByaria-describedby
    ariaDetailsaria-details
    ariaDisabledaria-disabled
    ariaErrorMessagearia-errormessage
    ariaExpandedaria-expanded
    ariaFlowToaria-flowto
    ariaHasPopuparia-haspopup
    ariaHiddenaria-hidden
    ariaInvalidaria-invalid
    ariaKeyShortcutsaria-keyshortcuts
    ariaLabelaria-label
    ariaLabelledByaria-labelledby
    ariaLevelaria-level
    ariaLivearia-live
    ariaModalaria-modal
    ariaMultiLinearia-multiline
    ariaMultiSelectablearia-multiselectable
    ariaOrientationaria-orientation
    ariaOwnsaria-owns
    ariaPlaceholderaria-placeholder
    ariaPosInSetaria-posinset
    ariaPressedaria-pressed
    ariaReadOnlyaria-readonly
    ariaRelevantaria-relevant
    ariaRequiredaria-required
    ariaRoleDescriptionaria-roledescription
    ariaRowCountaria-rowcount
    ariaRowIndexaria-rowindex
    ariaRowSpanaria-rowspan
    ariaSelectedaria-selected
    ariaSetSizearia-setsize
    ariaSortaria-sort
    ariaValueMaxaria-valuemax
    ariaValueMinaria-valuemin
    ariaValueNowaria-valuenow
    ariaValueTextaria-valuetext
    -

    Note: Attributes aria-dropeffect and aria-grabbed were deprecated in ARIA 1.1 and do not have corresponding IDL attributes.

    -
    +
    +

    ARIA Attribute Correspondence

    +

    The following table provides a correspondence between IDL attribute names and content attribute names, for use by ARIAMixin.

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    IDL AttributeReflected ARIA Content Attribute
    rolerole
    ariaAtomicaria-atomic
    ariaAutoCompletearia-autocomplete
    ariaBusyaria-busy
    ariaCheckedaria-checked
    ariaColCountaria-colcount
    ariaColIndexaria-colindex
    ariaColIndexTextaria-colindextext
    ariaColSpanaria-colspan
    ariaCurrentaria-current
    ariaDescriptionaria-description
    ariaDisabledaria-disabled
    ariaExpandedaria-expanded
    ariaHasPopuparia-haspopup
    ariaHiddenaria-hidden
    ariaInvalidaria-invalid
    ariaKeyShortcutsaria-keyshortcuts
    ariaLabelaria-label
    ariaLevelaria-level
    ariaLivearia-live
    ariaModalaria-modal
    ariaMultiLinearia-multiline
    ariaMultiSelectablearia-multiselectable
    ariaOrientationaria-orientation
    ariaPlaceholderaria-placeholder
    ariaPosInSetaria-posinset
    ariaPressedaria-pressed
    ariaReadOnlyaria-readonly
    ariaRequiredaria-required
    ariaRoleDescriptionaria-roledescription
    ariaRowCountaria-rowcount
    ariaRowIndexaria-rowindex
    ariaRowIndexTextaria-rowindextext
    ariaRowSpanaria-rowspan
    ariaSelectedaria-selected
    ariaSetSizearia-setsize
    ariaSortaria-sort
    ariaValueMaxaria-valuemax
    ariaValueMinaria-valuemin
    ariaValueNowaria-valuenow
    ariaValueTextaria-valuetext
    +

    Note: Attributes aria-dropeffect and aria-grabbed were deprecated in ARIA 1.1 and do not have corresponding IDL attributes.

    +

    Disambiguation Pattern

    Though specification authors may make exceptions to this pattern, the following rules were used to disambiguate names and case of the IDL attributes listed above.

    @@ -11361,10 +13713,27 @@

    IDL Attribute Name Notes or Exceptions

    • ariaPosInSet: The aria-posinset attribute refers to an item's position in a set (two words: "in set") rather than the "inset" of an item from the beginning of the collection. Therefore the IDL attribute name is ariaPosInSet with the P, I, and second S capitalized, not ariaPosInset.
    -

    Editor's Note: Should we make an exception on the spelling of "placeholder" and capitalize the H anyway? Some developers will expect this to be ariaPlaceHolder despite the fact that it's not a hyphenated word.

    +
    +

    ARIAMixin Mixed in to Element

    + +

    User agents MUST include ARIAMixin on Element:

    + +
    +			Element includes ARIAMixin;
    +		
    + +

    For Element:

    +
      +
    • The ARIAMixin getter steps given element, idlAttribute, and contentAttribute are to return the result of the getter algorithm for idlAttribute reflecting contentAttribute on element.

    • +
    • The ARIAMixin setter steps given element, idlAttribute, contentAttribute, and value are to perform the setter algorithm for idlAttribute reflecting contentAttribute on element, given value.

    • +
    + +

    In practice, this means that, e.g., the role IDL on Element reflects the role content attribute; the ariaValueMin IDL attribute reflects the aria-valuemin content attribute; etc.

    +
    +

    Example IDL Attribute Usage

    The primary purpose of ARIA IDL attribute reflection is to ease JavaScript-based manipulation of values. The following examples demonstrate its usage.

    @@ -11375,7 +13744,7 @@

    Example IDL Attribute Usage

    <!-- Use semantic markup instead. This is just a retrofit example. --> </div>
    // Get a reference to the element.
    -let el = document.getElementById('inaccessibleButton'); 
    +let el = document.getElementById('inaccessibleButton');
     el.tabIndex = 0; // Make it focusable.
     
     // Set the role and label.
    @@ -11402,149 +13771,61 @@ 

    Example IDL Attribute Usage

    -
    -

    Schemata

    -

    WAI-ARIA roles, states, and properties are available in a number of machine-readable formats to support validation of content using WAI-ARIA attributes. WAI-ARIA is not finalized, however, so these files are subject to change without notice. Todo: Remove disclaimers about not final at rec.

    -

    It is not appropriate to use these document types for live content. These are made available only for download, to support local use in development, evaluation, and validation tools. Using these versions directly from the W3C server could cause automatic blockage, preventing them from loading.

    -

    If it is necessary to use schemata in content, follow guidelines to avoid excessive DTD traffic. For instance, use caching proxies to avoid fetching the schema each time it is used, or ensure software uses a local cache, such as with XML catalogs.

    -
    -

    Roles Implementation

    -

    The taxonomy for WAI-ARIA expressed in RDF is available from http://www.w3.org/WAI/ARIA/schemata/aria-1.rdf.

    -
    -
    -

    WAI-ARIA Attributes Module

    -

    This module declares the WAI-ARIA attributes as a module that can be included in a modularized DTD. A sample XHTML DTD using this module follows. Note the WAI-ARIA attributes are in no namespace, and the attribute name begins with "aria-" to reduce the likelihood of collision with existing attributes.

    -

    This module is available from http://www.w3.org/MarkUp/DTD/aria-attributes-1.mod.

    -
    -
    -

    XHTML plus WAI-ARIA DTD

    -

    This DTD extends XHTML 1.1 and adds the WAI-ARIA state and property attributes to all its elements. In order to provide broader keyboard support and conform with the Focus Navigation section above, it also adds the tabindex attribute to a wider set of elements.

    -

    This is not a formal document type and may be obsoleted by future formal XHTML DTDs that support WAI-ARIA.

    -

    The XHTML 1.1 plus WAI-ARIA DTD is available from http://www.w3.org/WAI/ARIA/schemata/xhtml-aria-1.dtd.

    -

    Documents written using this XHTML Family markup language can be validated using the above DTD. If a document author wants to facilitate such validation, they can include the following declaration at the top of their document:

    -
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+ARIA 1.0//EN"
    -  "http://www.w3.org/WAI/ARIA/schemata/xhtml-aria-1.dtd">
    -

    However, note that when this DOCTYPE is present in a document, most user agents treat the document as generic XML rather than HTML. This causes them to be unable to support named character entities defined by the DTD (e.g., &copy;). Therefore, authors need to avoid use of named entities outside of the predefined entities in XML ([[XML11]], Section 4.6).

    -

    To avoid the above problem, authors can omit the above DOCTYPE statement. This causes user agents to treat the document as generic HTML with named character entity support as well as built-in ARIA support. However, it causes user agents to enter "quirks" mode which affects CSS rendering, and causes conformance checkers to fail the document due to the added ARIA attributes.

    -

    To avoid the issues of named character entity support and quirks mode, authors can instead use the following generic DOCTYPE declaration for HTML:

    -
    <!DOCTYPE html>
    -

    However, this still does not guarantee that documents will be validated by conformance checkers.

    -
    -
    -

    SGML Open Catalog Entry for XHTML+ARIA

    -

    This section contains the SGML Open Catalog-format definition [[SGML-CATALOG]] of the public identifiers for XHTML+ARIA 1.0.

    -
    -- .......................................................................... --
    --- File catalog  ............................................................ --
    -
    ---  XHTML+ARIA Catalog Data File
    -
    -	Revision:  $Revision: 1.40 $
    -
    -	See "Entity Management", SGML Open Technical Resolution 9401 for detailed
    -	information on supplying and using catalog data. This document is available
    -	from OASIS at URL:
    -
    -		<http://www.oasis-open.org/html/tr9401.html>
    -
    ---
    -
    --- .......................................................................... --
    --- SGML declaration associated with XHTML  .................................. --
    -
    -OVERRIDE YES
    -
    -SGMLDECL "xml1.dcl"
    -
    --- :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: --
    -
    --- XHTML+ARIA modules          .............................................. --
    -
    -
    -PUBLIC "-//W3C//DTD XHTML+ARIA 1.0//EN" "xhtml-aria-1.dtd"
    -
    -
    -PUBLIC "-//W3C//ENTITIES XHTML ARIA Attributes 1.0//EN" "aria-attributes-1.mod"
    -
    --- End of catalog data  ..................................................... --
    --- .......................................................................... --
    -
    -
    -
    -

    WAI-ARIA Attributes XML Schema Module

    -

    This module declares the WAI-ARIA attributes as an XML Schema module that can be included in a modularized schema. Note the WAI-ARIA attributes are in no namespace, and the attribute name begins with "aria-" to reduce the likelihood of collision with existing attributes.

    -

    This module is available from http://www.w3.org/MarkUp/SCHEMA/aria-attributes-1.xsd.

    -
    -
    -

    HTML 4.01 plus WAI-ARIA DTD

    -

    This standalone DTD adds WAI-ARIA state and property attributes to all elements in HTML 4.01, as well as a role attribute. In order to provide broader keyboard support, it also adds the tabindex attribute to a wider set of elements.

    -

    The DTD is based on the HTML 4.01 Transitional DTD, and includes all entity references needed to make it a standalone file. This is not an official W3C DTD and should be considered a derivative work of HTML 4.01.

    -

    Documents written using this markup language can be validated using the above DTD. If a document author wants to facilitate such validation, they can include the following declaration at the top of their document:

    -
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML+ARIA 1.0//EN"
    -	"http://www.w3.org/WAI/ARIA/schemata/html4-aria-1.dtd">
    -

    However, note that when this DOCTYPE is present in a document, most user agents treat the document as generic XML rather than HTML. This causes them to be unable to support named character entities defined by the DTD (e.g., &copy;). Therefore, authors need to avoid use of named entities outside of the predefined entities in XML ([[XML11]], Section 4.6).

    -

    To avoid the above problem, authors can omit the above DOCTYPE statement. This causes user agents to treat the document as generic HTML with named character entity support as well as built-in ARIA support. However, it causes user agents to enter "quirks" mode which affects CSS rendering, and causes conformance checkers to fail the document due to the added ARIA attributes.

    -

    To avoid the issues of named character entity support and quirks mode, authors can instead use the following generic DOCTYPE declaration for HTML:

    -
    <!DOCTYPE html>
    -

    However, this still does not guarantee that documents will be validated by conformance checkers.

    -

    The HTML Working Group is incorporating WAI-ARIA into HTML5. Official support for WAI-ARIA in HTML will be provided in that specification. This DTD is made available only as a bridging solution for applications requiring DTD validation but not using HTML 5.

    -

    This module is available from http://www.w3.org/WAI/ARIA/schemata/html4-aria-1.dtd.

    -
    -

    Mapping WAI-ARIA Value types to languages

    -

    The HTML 5 column of the table below is advisory. Guidance on use of WAI-ARIA state and properties in HTML 5 is provided in State and Property Attributes ([[HTML51]], section 3.2.7.3.2).

    -

    The suggested mappings for true/false values in HTML 5 use Keyword and enumerated attributes with allowed values of true and false, instead of using the HTML 5 boolean value type.

    -

    The table below provides recommended mappings between WAI-ARIA state and property types and attribute types from HTML 5, XML Schema Datatypes [[XMLSCHEMA11-2]], SVG, and SGML.

    +

    The HTML column of the table below is advisory. Guidance on use of WAI-ARIA state and properties in HTML is provided in Allowed ARIA roles, states and properties ([[HTML-ARIA]].

    +

    The suggested mappings for true/false values in HTML use Keyword and enumerated attributes with allowed values of true and false, instead of using the HTML boolean value type.

    +

    The table below provides recommended mappings between WAI-ARIA state and property types and attribute types from [[HTML]], XML Schema Datatypes [[XMLSCHEMA11-2]], [[SVG2]], and SGML.

    Languages not listed below might have appropriate value types defined in the language. If they do not, we recommend XML Schema Datatypes for general purpose XML languages. Documents using DTDs instead of schemas will not be able to validate automatically and require additional processing on WAI-ARIA attributes.

    - + - + - + - + - + - + - + - + - + - + @@ -11557,21 +13838,85 @@

    Mapping WAI-ARIA Value types to languages

    Change Log

    +

    Substantive changes targetted for the 1.3 release

    +
      +
    • 11-Mar-2020: Add aria-braillelabel
    • +
    • 13-Feb-2020: Role suggestion added
    • +
    • 11-Feb-2020: Update aria-details to allow multiple IDrefs
    • +
    • 11-Feb-2020: Role comment added
    • +
    • 16-Jan-2020: Add aria-description
    • +
    • 15-Jan-2020: Role mark: Added
    • +
    • 14-Oct-2019: Add aria-brailleroledescription
    • + +

    Substantive changes since the last public working draft

      -
    • 21-Jun-2018: Allow group as child of listbox
    • -
    • 21-Jun-2018: Resolve inconsistencies around group ownevership of menuitem, menuitemcheckbox and menuitemradio
    • -
    • 31-May-2018: Add blockquote, caption, and paragraph roles.
    • -
    • 01-Apr-2018: Added ARIA IDL Section (JavaScript interfaces).
    • -
    • 06-Dec-2017: Make aria-expanded a supported state of menuitem. This change also makes it a supported property of menuitemcheckbox and menuitemradio via inheritance.
    • -
    • 06-Dec-2017: When aria-errormessage is not pertinent, authors MUST either ensure the content is not rendered or remove the aria-errormessage attribute or its value. User agents MUST NOT expose aria-errormessage for an object with an aria-invalid value of false.
    • +
    • 16-Jul-2020: Update to define owned and container for
    • +
    • 09-Jul-2020: Re-add aria-haspopup on links
    • +
    • 25-Jun-2020: Remove multiple inheritance from menuitemcheckbox and menuitemradio
    • +
    • 15-May-2020: Remove nullable from IDL DOMStrings, add enumerated attributes prose and examples, and remove ariaRelevant IDL until Issue #1267 can be resolved.
    • +
    • 07-May-2020: Deprecate aria-disabled, aria-errormessage, aria-haspopup and aria-invalid as globals rather than removing them.
    • +
    • 21-Apr-2020: Require user agents to expose a value for combobox elements
    • +
    • 03-Apr-2020: Clarify default values
    • +
    • 03-Apr-2020: Revise meter authoring advice
    • +
    • 26-Mar-2020: remove recommendation to use role="none presentation"
    • +
    • 26-Mar-2020: Add info about layout and bounds to generic
    • +
    • 04-Mar-2020: prohibit aria-roledescription on generic
    • +
    • 03-Mar-2020: Clean up of Presentational roles conflict resolution section
    • +
    • 20-Feb-2020: Update combobox to remove aria-multiline reference
    • +
    • 01-Nov-2019: Modify combobox to new ARIA 1.2 pattern.
    • +
    • 25-Oct-2019: Modify caption authoring advice
    • +
    • 22-Oct-2019: Change aria-disabled, aria-errormessage, aria-haspopup and aria-invalid from global to widget specific.
    • +
    • 22-Oct-2019: Clarify use of alertdialog and alert roles
    • +
    • 22-Oct-2019: remove aria-level from tablist
    • +
    • 18-Oct-2019: Remove references to taxonomy file
    • +
    • 18-Oct-2019: Remove implicit value from aria-checked on checkbox
    • +
    • 11-Oct-2019: Deprecate directory role
    • +
    • 11-Oct-2019: Make form role accessible name required true
    • +
    • 11-Oct-2019: Remove allowance of group in list
    • +
    • 09-Oct-2019: Add missing implicit value for progressbar
    • +
    • 09-Oct-2019: Remove accessible name required from log and timer
    • +
    • 22-Aug-2019: Remove aria-level from grid
    • +
    • 23-Jul-2019: Add generic role
    • +
    • 11-Jul-2019: Remove advice against changing roles
    • +
    • 11-Jul-2019: Set Accessible Name Required to false on gridcell
    • +
    • 11-Jul-2019: Add associationlist, associationlistitemkey, and associationlistitemvalue roles
    • +
    • 28-Jun-2019: Prohibits Labeling of caption, code, deletion, emphasis, insertion, paragraph, presentation, strong, subscript, superscript
    • +
    • 25 Jun-2019: Add aria-rowindextext and aria-colindextext properties
    • +
    • 04-Jun-2019: Make aria-valuemin and aria-valuemax supported, rather than required, properties of focusable separator, slider, and scrollbar. Make aria-orientation a supported, rather than required, property of scrollbar.
    • +
    • 02-May-2019: Add strong and emphasis roles
    • +
    • 02-May-2019: Add aria-required as a supported property of checkbox
    • +
    • 02-May-2019: Add code role
    • +
    • 02-May-2019: Add aria-expanded support to application and checkbox roles.
    • +
    • 02-May-2019: Remove aria-expanded support from the following roles: alert, alertdialog, article, banner, blockquote, caption, cell, complementary, contentinfo, definition, deletion, dialog, directory, feed, figure, form, grid, group, heading, img, insertion, label, landmark, legend, list, listitem, log, main, marquee, math, menu, menubar, navigation, note, paragraph, radiogroup, region, search, select, status, subscript, superscript, table, tabpanel, term, time, timer, toolbar, tooltip, tree, treegrid.
    • +
    • 11-Apr-2019: Add legend role
    • +
    • 11-Apr-2019: Remove children-presentational=true from math role
    • +
    • 10-Apr-2019: Add label role
    • +
    • 10-Apr-2019: Add time role
    • +
    • 27-Mar-2019: Add Translatable States and Properties Section
    • +
    • 21-Feb-2019: Add subscript and superscript roles.
    • +
    • 07-Feb-2019: Remove contents as a supported name source for rowgroup.
    • +
    • 01-Feb-2019: Add meter> role.
    • +
    • 31-Jan-2019: Change the superclass of range from widget to structure.
    • +
    • 23-Jan-2019: Removed Default value of aria-checked from menuitemcheckbox and menuitemradio roles
    • +
    • 09-Jan-2019: Removed Default value of aria-checked from switch and checkbox roles

    Substantive changes since the WAI-ARIA 1.1 Recommendation

      +
    • 05-Oct-2018: Role spinbutton: Change the default value of aria-valuenow from 0 to "there is no current value." Also add aria-valuetext as a supported property.
    • +
    • 05-Oct-2018: Role spinbutton: allow empty values, no min, no max, and structure with sibling steppers
    • +
    • 21-Aug-2018: Correct normative language in rowheader to be consistent with required states and properties.
    • +
    • 21-Aug-2018: Allow aria-posinset and aria-setsize on row when used in a treegrid.
    • +
    • 21-Jun-2018: Allow group as child of listbox.
    • +
    • 21-Jun-2018: Resolve inconsistencies around group ownership of menuitem, menuitemcheckbox and menuitemradio.
    • +
    • 31-May-2018: Add blockquote, caption, and paragraph roles.
    • +
    • 01-Apr-2018: Added ARIA IDL Section (JavaScript interfaces).
    • +
    • 06-Dec-2017: Make aria-expanded a supported state of menuitem. This change also makes it a supported property of menuitemcheckbox and menuitemradio via inheritance.
    • +
    • 06-Dec-2017: When aria-errormessage is not pertinent, authors MUST either ensure the content is not rendered or remove the aria-errormessage attribute or its value. User agents MUST NOT expose aria-errormessage for an object with an aria-invalid value of false.
    @@ -11586,6 +13931,12 @@

    WAI-ARIA Role, State, and Property Quick Reference

    Placeholder for quick reference table

    --> -
    +
    +

    Acknowledgments

    +

    The following people contributed to the development of this document.

    +
    +
    +
    +
    WAI-ARIA typeHTML 5HTML XML Schema
    true/falseKeyword and enumerated attributes with allowed values of "true" and "false"Keyword and enumerated attributes with allowed values of "true" and "false" boolean
    true/false/undefinedKeyword and enumerated attributes with allowed values of true, false, and undefinedKeyword and enumerated attributes with allowed values of true, false, and undefined NMTOKEN with an enumeration constraint allowing values of true, false, and undefined
    tristateKeyword and enumerated attributes with allowed values of "true", "false", and "mixed"Keyword and enumerated attributes with allowed values of "true", "false", and "mixed" NMTOKEN with an enumeration constraint allowing values of "true", "false", and "mixed"
    numberFloating-point numbersFloating-point numbers decimal
    integerNon-negative integerNon-negative integer integer
    tokenKeyword and enumerated attributesKeyword and enumerated attributes NMTOKEN with an enumeration constraint allowing values listed in the state or property definition
    token listSpace-separated tokensSpace-separated tokens NMTOKENS with an enumeration constraint allowing values listed in the state or property definition
    ID referenceThe value of a defined id attribute on another elementThe value of a defined id attribute on another element IDREF
    ID reference listThe value of one or more defined id attributes on other element(s), represented as Space-separated tokensThe value of one or more defined id attributes on other element(s), represented as Space-separated tokens IDREFS