Cloud Computing

W4A Keynote: Equal Access For All
T. V. Raman


Outline

  • Creating Web Applications
  • Tangible User Interfaces
  • Consuming Web Applications
  • Usable UI Patterns
  • Web APIs And Specialized Browsing
  • Conclusion

Goal: Ubiquitous access.

1


Separate UI From Application

2


Web Architecture

Basic Web building blocks
URI
Universal means for addressing content.
HTTP
Protocol for client/server communication.
HTML
A language for hypertext documents.

Web Browser —a lens for viewing the Web

3


Discovering Web Applications

Web —Global hypertext system
HTML
Presentation-independent information.
Forms
Interactive Web hypertext.
CSS
Style content.
DOM
Programmable Web.
JavaScript
Custom behaviors.

4


Distributed Web Applications

Application Logic and Data separate from UI!
Data
Resides in the Web cloud.
Application
Logic runs on the server.
Presentation
Delivered as HTML to the client.
UI
Augmented by DOM-based interaction.

Facilitates multiple UI to a single application.

5


Google Calendar

Data
UI-independent, lives in the cloud.
UI
Delivered via the Web.
Clients
Manipulate underlying representation.
Sync
Multiple clients manipulate same data.
Specific UI used is no longer significant!

6


Creating Web Applications

7


Anatomy Of A Web Application

Server
Manage data, application logic.
Client
Presentation, interaction.
Bind
Connect the dots.
Opportunity: Separation of UI!

8


Application Data

  • Resides in the network cloud.
  • Enables ubiquitous access.
  • Is independent of any specific UI.
  • Ranges from the simple to the complex:
    • Maps
    • Spreadsheets

9


User Operations

User operations manipulate application data
Create
Add new data PUT.
Read
Retrieve existing data GET.
Update
Modify/edit data POST.
Delete
Delete data DELETE.

User operations mapped to HTTP verbs.

10


Examples




Maps Calendar






Model Lat/Long Data hierarchy



MetaData Geo-coding Dependencies



Operations View, Zoom Edit, View



Request Name values ATOM Feeds



Protocol HTTP HTTP+APP



Response Maps Tables



11


Tangible User Interfaces

12


Tangible User Interfaces

UI realized as a dynamic hypertext document!
  • Connect application model to desired UI.
  • Instantiate by creating an HTML DOM.
  • DOM holds presentation content.
  • Encapsulate content, style and interaction.

Web Applications come alive!

13


Document Is The Interface

User interface delivered as interactive hypertext.
HTML
Serialization of the HTML DOM.
DOM
Encapsulates content.
CSS
Style rules.
Handlers
JavaScript event handlers for behavior.

Result is a UI, not a document.

14


User Interface Is Not A Document!



Documents User Interfaces




Pure content Includes interaction


Consistent structure Highly customizable


Mostly static Mostly dynamic


User reads User interacts


15


Consuming Web Applications

16


Web Browser

Web application model discovered not designed.
  • Web UI rendered by the browser.
  • Browsers require augmentation via AT.
  • AT treats Web pages as documents.
  • Web pages are now live user interfaces.

Transition causes impedance mismatch.

17


Eliminating Feature Gap

W3C ARIA: enable AT regain lost ground.
DOM
Live properties expose metadata.
Role
Identifies widget type.
State
Reflects current interaction state.
Live Regions
Observer-observable relations.

Web user interfaces gain parity with desktop GUI.

18


Usable UI Patterns

19


Usable UI

From accessible widgets to usable applications!
  • ARIA makes UI controls visible to AT.
  • Web applications are more than UI controls.
  • Task completion is the final determiner.

ARIA is necessary but not sufficient!

20


End-To-End Usability

Steps in UI augmentation
  • Automatically speak relevant updates.
  • Augment icons with relevant metadata.
  • Add navigation keys for random access.
  • Allow user to query for information.
  • Produce automatic feedback for user actions.

Not all accessibility gaps are due to bugs.

21


Examples

Augmenting UI for visually impaired users
Emacspeak
Extensions and Web wizards.
JAWS
Application-specific scripts.
ORCA
Application-specific Python extensions.
Window Eyes
User set files.

Augmentation happens at multiple levels.

22


Web Applications

Web Applications present unique challenges
  • Large number of small Web applications.
  • Applications updated continuously.
  • New features delivered incrementally.
  • Enables ubiquitous access.

Web-2.0 benefits for all users?

23


Evolving Web Accessibility

Mainstream benefits for users with special needs.
  • Extend platform AT via the Web.
  • Deliver augmentation via the Web.
  • Distribute augmentation at Web scale.
  • Expose relevant APIs to Web developers.

24


Web-Scale Augmentation

Injection
AT-neutral application augmentation.
AT Scripts
AT-specific augmentation.
Metadata
Wire-formats like ARIA in HTML DOM.
Web
Distributing scripts via the Web.
Approaches are not mutually exclusive.

25


Examples Of Augmentation

Browsers
Implement W3C ARIA.
Screenreaders
Bundle application scripts.
Community
Open Source projects.
AxsJAX
Inject AT-neutral augmentation.

26


Specialized Browsing

27


Web APIs

Enable custom access to Webformation!
Task
Task-specific gadgets, e.g., weather.
Environment
Specialized access, e.g., mobile.
User
Special needs, e.g., AT.

Custom Web access liberates end-users!

28


Conclusions

  • Web applications are here to stay.
  • Desktop AT has found transition challenging.
  • W3C ARIA goes a long way in helping.
  • Web access creates new opportunities.

Profound impact on how we work and play!

29


Watch The Web Take Off!

take-off.eps

30