1 / 15

Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA

Learn about the importance of static and interactive roles in ensuring proper functionality in ARIA. Discover the role categories, examples, and tools. Contact Bryan Garaventa or Terri Fellers for more information.

Download Presentation

Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA Presented by: Bryan Garaventa,Accessibility Fellow Terri Fellers, Director Accessibility Services

  2. Who is Level Access? Formerly Known As SSB BART Group • New Corporate Identity – Name and Branding • New Website – Coming Spring 2017!! • No Change in our Innovative Technology or Excellent Service CSUN 2017 Assistive Technology Conference

  3. Overview Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA • What is ARIA? • ARIA Role Categories • Static ARIA Roles • Pseudo Interactive Roles • Interactive Widget Roles • Tools and Resources • Interactive Examples • Contact Information CSUN 2017 Assistive Technology Conference

  4. What is ARIA?

  5. ARIA Definition Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA • ARIA stands for Accessible Rich Internet Applications • ARIA is a technical specification published by the World Wide Web Consortium (W3C) Web Accessibility Initiative (WAI) CSUN 2017 Assistive Technology Conference

  6. ARIA Role Categories

  7. ARIA Role Categories Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA Three Primary Categories: • Static ARIA roles – do not require any scripting • Pseudo Interactive roles – nearly static but require some scripting to properly implement • Interactive Widget roles – roles that cannot be used without comprehensive scripting The ARIA Role Matrices can be used to quickly identify these categories, including specific implementation guidance: http://whatsock.com/training/matrices/ CSUN 2017 Assistive Technology Conference

  8. Static ARIA Roles Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA Static ARIA Roles can be included within standard HTML markup and require no scripting. Static ARIA Roles include: • Landmark and Region Roles: application, banner, complementary, contentinfo, form, main, navigation, region, search • Structural Roles: article, definition, directory + listitem, document, feed + article, figure, heading, img, list + listitem, math, notes, separator, table + cell, toolbar • Specialty Roles: none, presentation CSUN 2017 Assistive Technology Conference

  9. Pseudo Interactive Roles Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA Pseudo Interactive Roles are static roles that can be included within standard HTML markup, but require some basic accompanying scripting to ensure proper functionality. Pseudo Interactive Roles include: • Dialog Roles: alertdialog, dialog • Live Region Roles: alert, log, marquee, status, timer CSUN 2017 Assistive Technology Conference

  10. Interactive Widget Roles Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA Interactive Widget Roles can be included in standard HTML markup, but require precise scripting to ensure proper functionality. Interactive Widget Roles: • Simple Interactive Widget Roles: button, checkbox, link, progressbar, searchbox, scrollbar, slider, spinbutton, switch, textbox, tooltip • Complex Interactive Widget Roles: combobox, grid or treegrid + rowgroup + row + columnheader + gridcell, listbox + option, menu or menubar + menuitem or menuitemcheckbox or menuitemradio, radiogroup + radio, tablist + tab + tabpanel, tree + treeitem + group CSUN 2017 Assistive Technology Conference

  11. Interactive Examples

  12. Tools and Resources

  13. Tools and Resources Static vs. Interactive Widget Roles: Ensuring Proper Functionality in ARIA • Visual ARIA tool: http://whatsock.com/training/matrices/visual-aria.htm • ARIA Role Matrices: http://whatsock.com/training/matrices/ • The Accessibility Tree Training Guide: detailed training course for learning ARIA from beginning to end: http://whatsock.com/training/ • Archive of open source provably accessible widgets for use within any web technology project: • Powered by jQuery: https://github.com/accdc/tsg • Powered by MooTools: https://github.com/accdc/tsg-mootools • Powered by Dojo: https://github.com/accdc/tsg-dojo CSUN 2017 Assistive Technology Conference

  14. Any Questions?

  15. Thank you.Bryan Garaventabryan.garaventa@ssbbartgroup.comTerri Fellersterri.fellers@ssbbartgroup.com

More Related