WebAIM: Introduction to ARIA – Accessible Rich Internet Applications

Introduction to ARIA – Accessible Rich Internet Applications

Article Contents

  • Introduction to ARIA
  • Rules of ARIA Use
  • Core Components
  • Landmark Roles
  • Dynamic Content Updates
  • ARIA Labels and Descriptions
  • Keyboard Accessibility of ARIA Widgets
  • Basic ARIA Examples
  • Further Reading
  • Introduction to ARIA

    WAI-ARIA (Accessible Rich Internet Applications or ARIA) is a W3C specification for enhancing accessibility in ways that plain HTML cannot. When used properly, ARIA can…

    • enhance accessibility of interactive controls, such as tree menus, sliders, pop-ups, etc.
    • define helpful landmarks for page structure
    • define dynamically-updated “live regions”
    • improve keyboard accessibility and interactivity
    • and much more

    HTML has a defined—but evolving—vocabulary. For example, <blink> has been removed while <main> has been added. ARIA provides new code attributes and values that expand the vocabulary and semantics of HTML for enhanced screen reader accessibility.

    Like HTML, ARIA evolves over time, and is generally well supported in modern browsers and screen readers. Many scripting libraries also support ARIA.

    Rules of ARIA Use

    The ARIA specification defines five rules of ARIA use to support optimal accessibility. Summaries of these rules are below.

    Rule #1 – If you can use HTML a native HTML element or attribute, then do so.

    HTML is the foundation of web accessibility. ARIA should not be used when HTML provides sufficient semantics for [...]

    Read article at w3.org

    Article Taxonomies

    Fatal error: Uncaught Error: Object of class WP_Error could not be converted to string in /home/webable/www/www/wp-content/themes/webable/content-mcm.php:65 Stack trace: #0 /home/webable/www/www/wp-includes/template.php(812): require() #1 /home/webable/www/www/wp-includes/template.php(745): load_template('/home/webable/w...', false, Array) #2 /home/webable/www/www/wp-includes/general-template.php(206): locate_template(Array, true, false, Array) #3 /home/webable/www/www/wp-content/themes/webable/single-mcm_article.php(15): get_template_part('content-mcm') #4 /home/webable/www/www/wp-includes/template-loader.php(106): include('/home/webable/w...') #5 /home/webable/www/www/wp-blog-header.php(19): require_once('/home/webable/w...') #6 /home/webable/www/www/index.php(17): require('/home/webable/w...') #7 {main} thrown in /home/webable/www/www/wp-content/themes/webable/content-mcm.php on line 65