ARIA 1.1 overview

Description

the modern web is becoming more and more rich from day by day but at the same time it is becoming more and more complex in terms of accessibility.  To address the accessibility challenges of modern web, ARIA has evolved. ARIA stands for accessible rich internet applications and it defines the way to make the web content or web applications more accessible to people with the disabilities. It helps especially with dynamic content and advanced controls(such as tree, menu, slider and so on..) developed with the various technologies(ajax, java script, and so on..). before aria, it was tough for the screen reader users to understand what was going on in the dynamic web application.

WAI ARIA1.0 has become w3c recommendation on 20th march 2014. After 3 and half years, WAI ARIA1.1 has become w3c recommendation and it is on 14th dec 2017. ARIA1.1 extends version 1.0 and provides no of additional features to continue bridging the gap for accessibility in html.

 

What’s new in the aria1.1

8 new roles (now 81 total)

The following new roles have been added

  1. cell
  2. Feed
  3. Figure
  4. Table
  5. Term
  6. none (synonym for presentation)
  7. Searchbox
  8. Switch

 

13 new states & properties (now 48 total)

The following new states and properties have been added

  1. aria-colcount(property)
  2. aria-colindex(property)
  3. aria-colspan(property)
  4. aria-current(state)
  5. aria-details(property)
  6. aria-errormessage(property)
  7. aria-keyshortcuts(property)
  8. aria-modal(property)
  9. aria-placeholder(property)
  10. aria-roledescription(property)
  11. aria-rowcount(property)
  12. aria-rowindex(property)
  13. aria-rowspan(property)

 

8 roles with major updates

The below roles have been updated in terms of it’s usage

  1. Application: it is not a landmark and needs to be thought as last option
  2. Article: along with the original behavior, in addition, it is the child of feed role
  3. Combobox: it should also own an element that has a role of tree, grid, or dialog along with the role of listbox.
  4. Dialog: it should be considered as a window and assistive technologies should not pass through keys.
  5. Document: it is Recommended to use inside application elements.
  6. Grid: spec provides the additional guidance on how focus management should be, and how aria-readonly should be used
  7. Region: it should be considered as a landmark
  8. Separator: If focusable, it should be widget requiring aria-valuenow, aria-valuemin, and aria-valuemax, supports aria-valuetext.

 

11 states & properties with significant changes

The below attributes have been updated in terms of it’s usage

  1. aria-activedescendant: editorial change
  2. aria-autocomplete: editorial change
  3. aria-busy: it should not be limited to live regions
  4. aria-haspopup: it should support additional values such as menu, grid, dialog, tree, listbox along with the original values(true/false)
  5. aria-hidden: editorial change
  6. aria-level: it should be required for the heading role
  7. aria-orientation: default value should be undefined and it is allowed for more roles
  8. aria-readonly: it should support other roles too such as combobox, listbox, radiogroup, slider, and spinbutton.
  9. aria-posinset: it should Support other roles too such as radio, tab, article in feed.
  10. aria-setsize: it should Support other roles too such as , radio, tab, article in feed.
  11. aria-setsize: the value should be set to “-1” if the size is unknown.

 

Deprecations

The following attributes have been deprecated in aria1.1

  1. aria-dropeffect
  2. aria-grabbed

 

references

  1. aria1.1 specification: c. change log