AEGIS SP3 story - building an accessible web application
Download as ODP, PDF1 like594 views
The document describes how an accessibility framework called AEGIS Open Accessibility Framework (OAF) was used to build an accessible web-based calendar application. It follows a fictional developer, Clyde Channing, as he uses tools from the OAF like the Accessibility Advisor, ARIA specifications, and stock UI components to design, test, and release the calendar application. These tools helped ensure the application was accessible to users with disabilities. The presentation concludes by discussing next steps to further test the OAF tools with developers.
![Mr. Channing's research
Methodology: Search the web for tools, resources, guidance in creating
accessible web applications
Solution: Accessibility Adviser tool, UI components implementing ARIA,
developer tools, and simulation tools
Relevant material developed in AEGIS:
Accessibility Adviser provides guidance [OAF step 3: “Developer Tool”]
WAI-ARIA specification [OAF step 1: “Define Accessible”]
jQuery, MooTools, Fluid Infusion [OAF step 2: “Stock Elements”]
NetBeans plug-in for using ARIA-enabled UI components [OAF step 3:
“Developer Tool”]
ACCESSIBLE project's DIAS disability simulation tool for web apps
Firefox web browser exposing ARIA information using IAccessible2 on
Windows, ATK/AT-SPI on Linux [OAF step 4: “Platform support”]
International Technology and Persons with Disabilities Conference 12 of](https://image.slidesharecdn.com/aegissp3story-buildinganaccessiblewebapplicationfinal-120306150614-phpapp01/85/AEGIS-SP3-story-building-an-accessible-web-application-12-320.jpg)
![Design app w/accessibility support
jQuery & MooTools components [OAF step 2:
“Stock Elements”] taken from NetBeans
palette [OAF step 3: “Developer Tool”]
International Technology and Persons with Disabilities Conference 14 of](https://image.slidesharecdn.com/aegissp3story-buildinganaccessiblewebapplicationfinal-120306150614-phpapp01/85/AEGIS-SP3-story-building-an-accessible-web-application-14-320.jpg)
![First tests
Developer continues
with NetBeans IDE,
builds the app
[OAF step 5:
“The app itself”]
Uses “View” option to
preview app in local
web browser
International Technology and Persons with Disabilities Conference 15 of](https://image.slidesharecdn.com/aegissp3story-buildinganaccessiblewebapplicationfinal-120306150614-phpapp01/85/AEGIS-SP3-story-building-an-accessible-web-application-15-320.jpg)
![First tests
Developer continues
with NetBeans IDE,
builds the app
[OAF step 5:
“The app itself”]
Uses “View” option to
preview app in local
web browser
International Technology and Persons with Disabilities Conference 16 of](https://image.slidesharecdn.com/aegissp3story-buildinganaccessiblewebapplicationfinal-120306150614-phpapp01/85/AEGIS-SP3-story-building-an-accessible-web-application-16-320.jpg)
![User evaluation
Testing with end users using:
JAWS & NVDA on Windows
VoiceOver on Mac, iOS
Orca on Linux / UNIX systems [OAF step 6: “AT”]
Firefox web browser via ARIA & IAccessible2;
via ARIA & ATK/AT-SPI
Safari web browser via ARIA & NSAccessibility
[OAF step 4: “Platform support”]
Results of the testing:
A few final issues found by end users, which are fixed
based on their feedback
International Technology and Persons with Disabilities Conference 21 of](https://image.slidesharecdn.com/aegissp3story-buildinganaccessiblewebapplicationfinal-120306150614-phpapp01/85/AEGIS-SP3-story-building-an-accessible-web-application-21-320.jpg)
![Summary
Tools & components used to build the app:
Accessibility Advisor [OAF step 3: “Developer
Tool”]
NetBeans IDE with a palette of stock components,
using drag-and-drop into code [OAF step 3:
“Developer Tool”]
jQuery & MooTools components implementing WAI-
ARIA, keyboard operation & theme support [OAF
step 2: “Stock Elements”]
WAI-ARIA, DHTML Style Guide [OAF step 1: “Define
Accessible”]
DesignInternational Technology and Persons with Disabilities Conference
the app w/accessibility support [OAF23 of](https://image.slidesharecdn.com/aegissp3story-buildinganaccessiblewebapplicationfinal-120306150614-phpapp01/85/AEGIS-SP3-story-building-an-accessible-web-application-23-320.jpg)
AEGIS SP3 story - building an accessible web application
- 1. Using the AEGIS OAF: Accessible Rich Internet Apps Peter Korn, Oracle Nikolaos Kaklanis, CERTH International Technology and Persons with Disabilities Conference
- 2. What we will be doing today... Following a fictional software developer who will build an accessible Rich Internet Application Demonstrate how AEGIS helps do this Using the “Open Accessibility Framework” Using the tools developed in the AEGIS project Presentation in the style of a “cooking show” International Technology and Persons with Disabilities Conference
- 3. What is AEGIS? 4 Year EC-funded ICT accessibility project 20 in consortium: from industry, disability, research By the words of the acronym: open: collaborate with existing communities Accessibility: focus of the project Everywhere: desktop, web, mobile Groundwork: start from users, user needs Infrastructure: build it in to ICT International Technology and Persons with Disabilities Conference 3 of
- 4. Where AEGIS comes from EC call: FP7-ICT-2007-2 Objective: ICT-2007.7.2: Accessible & Inclusive ICT ICT-2007.7.2(a) New approaches and solutions for deeply embedding generalised accessibility support within future mainstream ICT-based products and services. Examples are user interfaces and content representations adaptable to people with specific needs. It includes open, plug & play accessibility architectures and standards enabling a seamless integration of personalised assistive solutions for ICT access. The research is expected to International Technology and Persons with Disabilities Conference 4 of
- 5. AEGIS Concept – build it in “deeply embed generalised accessibility support within future mainstream ICT ” = build accessibility into all facets of the “value delivery chain” Learn from the built environment: Need to address “creation” steps: What does it mean to be “accessible”, etc. Need to address “use” steps Wheelchair ramps don't help unless people have wheelchairs Apply to ICT environment: Open Accessibility Framework International Technology and Persons with Disabilities Conference 5 of
- 6. AEGIS OAF International Technology and Persons with Disabilities Conference 6 of
- 7. AEGIS OAF International Technology and Persons with Disabilities Conference 7 of
- 8. AEGIS Concept – generations... Accessibility evolving: 3 distinct generations 1st generation accessibility: Character-based systems 2nd generation accessibility: GUI with off-screen models 3rd generation accessibility: “Access by contract” - accessibility APIs International Technology and Persons with Disabilities Conference 8 of
- 9. Our protagonist developer Clyde Channing lives in Manchester, UK He has been working as a senior developer at Quixcon Software Solutions His company develops software for hire, and has been hired to create an accessible web-based calendar International Technology and Persons with Disabilities Conference 9 of
- 10. Mr. Channing's work environment Clyde uses many tools in his work NetBeans Eclipse Windows (XP-7) ASP .NET Visual Studio Linux / Ubuntu Java He does not have a disability International Technology and Persons with Disabilities Conference 10 of
- 11. Create an accessible calendar UK government agencies having difficulty scheduling meetings across their agencies: need for shared calendar – led to decision: make a web-based calendar app UK Disability Discrimination Act & Equality Act – led to decision: web-based calendar must be accessible After competitive bids, UK government decides to hire Quixcon Software Solutions to create an accessible web-based calendar application International Technology and Persons with Disabilities Conference 11 of
- 12. Mr. Channing's research Methodology: Search the web for tools, resources, guidance in creating accessible web applications Solution: Accessibility Adviser tool, UI components implementing ARIA, developer tools, and simulation tools Relevant material developed in AEGIS: Accessibility Adviser provides guidance [OAF step 3: “Developer Tool”] WAI-ARIA specification [OAF step 1: “Define Accessible”] jQuery, MooTools, Fluid Infusion [OAF step 2: “Stock Elements”] NetBeans plug-in for using ARIA-enabled UI components [OAF step 3: “Developer Tool”] ACCESSIBLE project's DIAS disability simulation tool for web apps Firefox web browser exposing ARIA information using IAccessible2 on Windows, ATK/AT-SPI on Linux [OAF step 4: “Platform support”] International Technology and Persons with Disabilities Conference 12 of
- 13. Define end users, accessibility env. Use the Accessibility Adviser To understand the end users & their major barriers and limitations Specifies a set of recommendations that to develop the application, as well as the recommended technologies that can be used Select target peronas Low vision: Gert Van Dijk Blindness: Paulina Reyes International Technology and Persons with Disabilities Conference 13 of
- 14. Design app w/accessibility support jQuery & MooTools components [OAF step 2: “Stock Elements”] taken from NetBeans palette [OAF step 3: “Developer Tool”] International Technology and Persons with Disabilities Conference 14 of
- 15. First tests Developer continues with NetBeans IDE, builds the app [OAF step 5: “The app itself”] Uses “View” option to preview app in local web browser International Technology and Persons with Disabilities Conference 15 of
- 16. First tests Developer continues with NetBeans IDE, builds the app [OAF step 5: “The app itself”] Uses “View” option to preview app in local web browser International Technology and Persons with Disabilities Conference 16 of
- 17. Accessibility simulation International Technology and Persons with Disabilities Conference 17 of
- 18. Accessibility simulation International Technology and Persons with Disabilities Conference 18 of
- 19. Programmatic Testing Testing with ACCESSIBLE WaaT tool International Technology and Persons with Disabilities Conference 19 of
- 20. Programmatic Testing International Technology and Persons with Disabilities Conference 20 of
- 21. User evaluation Testing with end users using: JAWS & NVDA on Windows VoiceOver on Mac, iOS Orca on Linux / UNIX systems [OAF step 6: “AT”] Firefox web browser via ARIA & IAccessible2; via ARIA & ATK/AT-SPI Safari web browser via ARIA & NSAccessibility [OAF step 4: “Platform support”] Results of the testing: A few final issues found by end users, which are fixed based on their feedback International Technology and Persons with Disabilities Conference 21 of
- 22. Release! Release of the application Finally the application is released – installed on the UK gov't internal web site for use across agencies Used by employees – with and without disabilities – to schedule meetings with each other International Technology and Persons with Disabilities Conference 22 of
- 23. Summary Tools & components used to build the app: Accessibility Advisor [OAF step 3: “Developer Tool”] NetBeans IDE with a palette of stock components, using drag-and-drop into code [OAF step 3: “Developer Tool”] jQuery & MooTools components implementing WAI- ARIA, keyboard operation & theme support [OAF step 2: “Stock Elements”] WAI-ARIA, DHTML Style Guide [OAF step 1: “Define Accessible”] DesignInternational Technology and Persons with Disabilities Conference the app w/accessibility support [OAF23 of
- 24. Next steps in AEGIS Third Pilot testing with developers CS students in Prague & Madrid will test these tools Two groups: using tools & control group Key question: to what extent do these tools help developers who aren't otherwise familiar with accessibility in creating accessible web apps We will publish results by August 2012 International Technology and Persons with Disabilities Conference 24 of
- 25. Questions? http://www.aegis-project.eu International Technology and Persons with Disabilities Conference 25 of