Achieving a Safe and Seamless         User ExperienceThrough Accessible Web Applications       Alejandro Piñeiro Iglesias
2    Topics    ●   Accessibility-based solutions to improve safety    ●   Implementation via accessibility APIs    ●   App...
Accessibility-Based Solutions     to Improve Safety               `
4    Safety First?    9 November 2012                                 8 November 2012    “Off-duty officer killed, Cal Tra...
5    "In 2010, 3092 people were killed in crashes    involving a distracted driver and an estimated    additional 416,000 ...
6    Hands-Free via Speech Input    For:     ●   Users who cannot use a keyboard and/or         touch screen (i.e. due to ...
7    Eyes-Minimal via Simplified UI    For:     • Users who have difficulty visually accessing       screen contents (i.e....
8    Eyes-Free via Speech Output    For:     • Users who cannot visually access screen       contents (i.e. due to disabil...
9    Eyes-Free via Gestures    For:     • Users who cannot activate on-screen       elements directly (i.e. due to disabil...
10     “Since driving ... is primarily a visual-spatial-     motor task, it is predicted (and observed) to be     fairly e...
Implementationvia Accessibility APIs          `
12     Accessibility APIs     Accessibility APIs allow you to interact with     applications programmatically on behalf of...
13     Example: Remember the Milk     1. Remember The Milk displays an alert that the        driver is in an area with an ...
14     Accessibility API Events     • Focus changes     • Selection changes     • Text changes     • Value changes     • V...
15     Accessibility API Actions     • Press, release, and click on a button     • Toggle the state of a widget     • Drag...
16     Accessibility API Interfaces     ●   Application                              ●   Selection     ●   Component      ...
17     Accessibility API Use Cases     • Provide access to users with disabilities     • Automated testing     • (Distract...
18     Requirements     • Developers: create accessible web apps.     • Layout engine: implement accessibility       suppo...
Applicable Standards and    Existing Support            `
20     For Web Application Developers     W3C Mobile Web Initiative      • Mobile Web Best Practices       http://www.w3.o...
21     For Web Application Developers     W3C Web Accessibility Initiative      • Mobile Accessibility Overview       http...
22     For Web Application Developers     W3C HTML Speech Incubator Group     • Speech Input API Specification      http:/...
23     Layout Engines Supporting ARIA     ●   Trident     ●   WebKit     ●   Gecko     ●   Presto              Achieving a...
24     Choosing One     ●   Trident     ●   WebKit     ●   Gecko     ●   Presto              Achieving a Safe and Seamless...
25     WebKit: Free as in Freedom     ●   Primarily BSD-style and LGPL licenses     ●   http://svn.webkit.org/repository/w...
26     WebKit: Embedded-Friendly     ●   Desktop (Safari, Chromium, Epiphany, etc.)     ●   iPhone, iPad, iPod Touch     ●...
27     WebKit: Developer Community     9000             8151     8000     7000                       6099     6000        ...
28     WebKit: Accessibility     • Mature, platform-independent core support     • Adaptations from WebCore to platform, e...
29   The Indie UI Working Group     “The mission of the Indie UI Working Group ...     is to develop event models for Appl...
30     Indie UI Working Group Members:     ●   Access Co, LTD                          ●   Nokia     ●   Apple            ...
31         Summary     ●   In-vehicle device applications can be used more         safely via alternative input and/or out...
Questions?
Upcoming SlideShare
Loading in …5
×

Achieving a Safe and Seamless User Experience Through Accessible Web Applications (Rome 2012 W3C Web&Automotive Workshop)

1,020 views
981 views

Published on

By Alejandro Piñeiro.

Web applications with flexible and dynamic user interaction models form
a set of tools which are growing rapidly in availability and can be used
at any time, in any place, on any device, and without the learning curve
typically associated with a new platform. But perhaps more importantly,
web applications which are fully accessible to users with disabilities
can be equally accessible to users who are driving and require hands- and
eyes-free interaction with their device in order to be safe. Thus
accessible web applications are a means to achieve a user experience
which is safe and seamless and do so at a greatly reduced cost to device
manufacturers who can provide their customers with the tools they desire
simply by implementing browser support. The automotive industry should
strongly consider moving in this direction.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,020
On SlideShare
0
From Embeds
0
Number of Embeds
684
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Achieving a Safe and Seamless User Experience Through Accessible Web Applications (Rome 2012 W3C Web&Automotive Workshop)

  1. 1. Achieving a Safe and Seamless User ExperienceThrough Accessible Web Applications Alejandro Piñeiro Iglesias
  2. 2. 2 Topics ● Accessibility-based solutions to improve safety ● Implementation via accessibility APIs ● Applicable standards and existing support Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  3. 3. Accessibility-Based Solutions to Improve Safety `
  4. 4. 4 Safety First? 9 November 2012 8 November 2012 “Off-duty officer killed, Cal Trans “Police say a distracted driver caused flagger seriously hurt in chain a head-on crash.... The driver of the reaction crash.... Cal Trans said the second truck and his passenger had to accident was likely caused by a be extricated from the vehicle by distracted driver." firefighters." 3 November 2012 31 October 2012 “Authorities say a driver distracted “An eastern Utah man was charged by his cell phone caused a head-on Wednesday with hitting and killing a crash that killed an elderly man and Vernal teenager with his car while seriously injured an elderly woman in texting behind the wheel.” central California." Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  5. 5. 5 "In 2010, 3092 people were killed in crashes involving a distracted driver and an estimated additional 416,000 were injured in motor vehicle crashes involving a distracted driver." U.S. National Highway Traffic Safety Administration Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  6. 6. 6 Hands-Free via Speech Input For: ● Users who cannot use a keyboard and/or touch screen (i.e. due to disability) ● Users who should not use a keyboard and/or touch screen (i.e. due to driving) Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  7. 7. 7 Eyes-Minimal via Simplified UI For: • Users who have difficulty visually accessing screen contents (i.e. due to disability) • Users who have difficulty visually accessing screen contents (i.e. due to driving) Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  8. 8. 8 Eyes-Free via Speech Output For: • Users who cannot visually access screen contents (i.e. due to disability) • Users who should not visually access screen contents (i.e. due to driving) Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  9. 9. 9 Eyes-Free via Gestures For: • Users who cannot activate on-screen elements directly (i.e. due to disability) • Users who should not activate on-screen elements directly (i.e. due to driving) Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  10. 10. 10 “Since driving ... is primarily a visual-spatial- motor task, it is predicted (and observed) to be fairly efficiently time shared with tasks that are auditory and language based.” Models of Attention, Distraction, and Highway Hazard Avoidance Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  11. 11. Implementationvia Accessibility APIs `
  12. 12. 12 Accessibility APIs Accessibility APIs allow you to interact with applications programmatically on behalf of the end user. Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  13. 13. 13 Example: Remember the Milk 1. Remember The Milk displays an alert that the driver is in an area with an associated task. 2. Device checks the cars speed to be sure it is safe, then speaks the displayed alert. 3. Driver says “No” to indicate he does not want to be given navigation directions. 4. Device clicks on the “No” button for the driver. Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  14. 14. 14 Accessibility API Events • Focus changes • Selection changes • Text changes • Value changes • Visual appearance changes • Addition and removal of new objects • Etc. Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  15. 15. 15 Accessibility API Actions • Press, release, and click on a button • Toggle the state of a widget • Drag and drop an item • Etc. Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  16. 16. 16 Accessibility API Interfaces ● Application ● Selection ● Component ● Streamable Content ● Desktop ● Text ● Document ● Editable Text ● Hypertext ● Table ● Image ● Value Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  17. 17. 17 Accessibility API Use Cases • Provide access to users with disabilities • Automated testing • (Distraction-free access for drivers?) Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  18. 18. 18 Requirements • Developers: create accessible web apps. • Layout engine: implement accessibility support for the platform. • Platform: provide a means to expose that support to end-user tools. Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  19. 19. Applicable Standards and Existing Support `
  20. 20. 20 For Web Application Developers W3C Mobile Web Initiative • Mobile Web Best Practices http://www.w3.org/TR/mobile-bp • Mobile Web Application Best Practices http://www.w3.org/TR/mwabp Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  21. 21. 21 For Web Application Developers W3C Web Accessibility Initiative • Mobile Accessibility Overview http://www.w3.org/WAI/mobile/Overview.html • Web Content Accessibility Guidelines http://www.w3.org/TR/WCAG20 • Accessible Rich Internet Applications (ARIA) http://www.w3.org/TR/wai-aria Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  22. 22. 22 For Web Application Developers W3C HTML Speech Incubator Group • Speech Input API Specification http://lists.w3.org/Archives/Public/public-xg-htmlspeech/2011Feb/att-0020/api-draft.html • HTML Text to Speech (TTS) API Specification http://lists.w3.org/Archives/Public/public-xg-htmlspeech/2011Feb/att-0022/htmltts-draft.html • Speech JavaScript API Specification http://lists.w3.org/Archives/Public/public-webapps/2011OctDec/att-1696/speechapi.html • Final Report http://www.w3.org/2005/Incubator/htmlspeech/XGR-htmlspeech/ Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  23. 23. 23 Layout Engines Supporting ARIA ● Trident ● WebKit ● Gecko ● Presto Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  24. 24. 24 Choosing One ● Trident ● WebKit ● Gecko ● Presto Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  25. 25. 25 WebKit: Free as in Freedom ● Primarily BSD-style and LGPL licenses ● http://svn.webkit.org/repository/webkit/trunk Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  26. 26. 26 WebKit: Embedded-Friendly ● Desktop (Safari, Chromium, Epiphany, etc.) ● iPhone, iPad, iPod Touch ● Android ● Palm Pre ● Amazon Kindle ● Others Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  27. 27. 27 WebKit: Developer Community 9000 8151 8000 7000 6099 6000 5083 5000 4000 3000 2026 2000 1465 924 1104 1000 749 375 315 313 0 Chromium Apple WebKit Google Igalia Gmail Nokia OpenBossa Samsung RIM Others Commits Per Affiliation in 2011 Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  28. 28. 28 WebKit: Accessibility • Mature, platform-independent core support • Adaptations from WebCore to platform, e.g.: – Macintosh – EFL – Chromium – Qt – GTK – Win Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  29. 29. 29 The Indie UI Working Group “The mission of the Indie UI Working Group ... is to develop event models for Application Programming Interfaces (APIs) that facilitate interaction in Web applications that are input method independent, and hence accessible to people with disabilities.” W3C Web Accessibility Initiative Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  30. 30. 30 Indie UI Working Group Members: ● Access Co, LTD ● Nokia ● Apple ● Opera ● Google ● Univ. Catholique de Louvain ● IBM ● Univ. of Manchester ● Institut Telecom ● Invited (accessibility) experts Representation from the Automotive Industry? http://www.w3.org/WAI/IndieUI/participation Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  31. 31. 31 Summary ● In-vehicle device applications can be used more safely via alternative input and/or output. ● The alternatives are quite similar to, and may even be thought of as, assistive technologies. ● Accessibility APIs and standards for accessible web applications are established and being used. ● The automotive industry should evaluate this solution. Achieving a Safe and Seamless User Experience Through Accessible Web Applications Alejandro Piñeiro | apinheiro@igalia.com | www.igalia.com/accessibility
  32. 32. Questions?

×