Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
DEN ODELL
AKQA
#TECHINSIGHT TECHINSIGHT.IO
One Web To Rule
Them All
@DENODELL
this print for content only—size & color not accurate spine = 0.844" 440 page count
BOOKS FOR PROFESSIONALS BY P...
“Imagine a console in your office that will bring
the accumulated knowledge of the world to
your fingertips.”
Arthur C. Cl...
“You can get the data on some historical event,
or hear an illustrated lecture on any subject
you wish. Or you can hold an...
1993
“The web is an incredible democratiser. A
small company can look as large as a big
company and be as accessible as a big
c...
ACCESS THE WEB
ANYTIME, ANYPLACE,
ANYWHERE, ANYHOW.
ONE WEB
User Interface Varies Based On Device Characteristics
RESPONSIVE
Web
design
MULTIMODAL
INTERACTION
Multimodal Interaction
DATA STORE
SERVICES (RESTful)
WEB BROWSER iOS APP ANDROID APP
Multimodal Interaction
DATA STORE
SERVICES (RESTful)
MODALITY COMPONENT
INTERACTION MANAGER
MODALITY COMPONENT MODALITY CO...
MULTIMODAL
INTERACTION
Bringing The User Interface To The User
INPUTS AND
OUTPUTS
Inputs
Inputs
InkML HTML5 Touch Events API VoiceXML
HTML5 Touch Events API HTML DOM Events API
Outputs
Outputs
HTML5 / CSS3
CSS Braille Media Type
VoiceXML / JavaScript Web
Speech API
HTML5 Vibration API
RESPONSIVE
Web
design
+ VoiceXML
RESPONSIVE
Web
design
Welcome to the ticket booking service. What
are you looking for - concert, conference, or
cinema tickets?
Welcome to the ticket booking service. What
are you looking for - concert, conference, or
cinema tickets?
Cinema tickets
Which film would you like to purchase tickets
for - White House Down, The Call, or About
Time?
Which film would you like to purchase tickets
for - White House Down, The Call, or About
Time?
The Call
OK, and which cinema should we book the
tickets for The Call at?
OK, and which cinema should we book the
tickets for The Call at?
The Odeon, Leicester Square
Great. We've now reserved you tickets to see
The Call at The Odeon, Leicester Square.
RESPONSIVE
Web
design
Bringing The User Interface To The User
TODAY
Voice Search
Native Apps
Voice Search
Native Apps
TOMORROW
StreamInput API
StreamInput API
EmotionML
ACCESS THE WEB
ANYTIME, ANYPLACE,
ANYWHERE, ANYHOW.
ONE WEB
One Web To Rule Them All
One Web To Rule Them All
One Web To Rule Them All
Upcoming SlideShare
Loading in …5
×

One Web To Rule Them All

1,187 views

Published on

The web is supposed to be the great democratiser, but what happens if you don't have a web browser? Anybody should be able to access any web content, service or application using any type of connected device from anywhere at any time, but the current reality is far from this.

In this talk, join Den Odell, Head of Web Development at AKQA, as he envisions a "One Web" future, the ultimate form of Responsive Design where sites truly adapt to their users' devices, needs and context, a future where user interfaces reach beyond the browser to create an optimal experience for everyone, all built with W3C open standards.

Published in: Technology, Design

One Web To Rule Them All

  1. 1. DEN ODELL AKQA #TECHINSIGHT TECHINSIGHT.IO One Web To Rule Them All
  2. 2. @DENODELL this print for content only—size & color not accurate spine = 0.844" 440 page count BOOKS FOR PROFESSIONALS BY PROFESSIONALS® Pro JavaScript RIA Techniques: Best Practices, Performance, and Presentation Dear Reader, Many people are familiar with rich Internet applications (RIAs), those web sites that blur the line between desktop software and the web browser. Applications like webmail clients, photo editors, and social networking sites cross this boundary. They feature intuitive, user-friendly interfaces, without the need for page refreshes or other interruptions to the end user’s experience. It is widely regarded that this type of web site will continue to grow in popularity. I wrote this book to help web developers with some existing JavaScript skills suc- cessfully create their own professional, visually rich, dynamic, and performance- tuned RIAs. And following the guidelines in this book, you’ll be safe in the knowledge that your code is built according to best practices, adhering to web standards and accessibility guidelines. In this book, I will show you how best to build a solid, maintainable foundation of HTML, CSS, and JavaScript code for your RIAs, together with the Ajax techniques needed to provide the dynamic communication between the browser and web server behind the scenes. I will describe the performance limitations you may run into when building your web applications and how best to overcome these. And I’ll give you some tips for making your user interfaces feel more responsive, even when you can’t get around the performance limitations. You also will learn how to improve your RIA user interfaces by adding typo- graphical headings using custom fonts, multimedia playback components, customized form controls, and dynamic charting capabilities. Additionally, I will demonstrate how to continue running your web applications when the connection to the server is broken, how to use Ajax to read hidden data stored within binary files, and how to ensure the highest level of accessibility within your JavaScript web applications. Den Odell US $44.99 Shelve in Web Development User level: Intermediate–Advanced OdellProJavaScriptRIATechniques THE EXPERT’S VOICE® IN WEB DEVELOPMENT Pro JavaScript RIA Techniques Best Practices, Performance, and Presentation CYAN MAGENTA YELLOW BLACK PANTONE 123 C Den Odell Companion eBook Available www.apress.com SOURCE CODE ONLINE Companion eBook See last page for details on $10 eBook version Turn your JavaScript knowledge into beautiful, dynamic, and performance-tuned rich Internet applications ISBN 978-1-4302-1934-7 9 781430 219347 5 4 4 9 9 RELATEDTITLES DEN ODELL HEAD OF WEB DEVELOPMENT, AKQA Out July
  3. 3. “Imagine a console in your office that will bring the accumulated knowledge of the world to your fingertips.” Arthur C. Clarke, Popular Science, 1970
  4. 4. “You can get the data on some historical event, or hear an illustrated lecture on any subject you wish. Or you can hold an electronic conference with any group of people scattered all over the world, seeing each other as you talk.” Arthur C. Clarke, Popular Science, 1970
  5. 5. 1993
  6. 6. “The web is an incredible democratiser. A small company can look as large as a big company and be as accessible as a big company on the web.” Steve Jobs, Wired Magazine, 1996
  7. 7. ACCESS THE WEB ANYTIME, ANYPLACE, ANYWHERE, ANYHOW.
  8. 8. ONE WEB
  9. 9. User Interface Varies Based On Device Characteristics RESPONSIVE Web design
  10. 10. MULTIMODAL INTERACTION
  11. 11. Multimodal Interaction DATA STORE SERVICES (RESTful) WEB BROWSER iOS APP ANDROID APP
  12. 12. Multimodal Interaction DATA STORE SERVICES (RESTful) MODALITY COMPONENT INTERACTION MANAGER MODALITY COMPONENT MODALITY COMPONENT
  13. 13. MULTIMODAL INTERACTION Bringing The User Interface To The User
  14. 14. INPUTS AND OUTPUTS
  15. 15. Inputs
  16. 16. Inputs InkML HTML5 Touch Events API VoiceXML HTML5 Touch Events API HTML DOM Events API
  17. 17. Outputs
  18. 18. Outputs HTML5 / CSS3 CSS Braille Media Type VoiceXML / JavaScript Web Speech API HTML5 Vibration API
  19. 19. RESPONSIVE Web design + VoiceXML
  20. 20. RESPONSIVE Web design
  21. 21. Welcome to the ticket booking service. What are you looking for - concert, conference, or cinema tickets?
  22. 22. Welcome to the ticket booking service. What are you looking for - concert, conference, or cinema tickets? Cinema tickets
  23. 23. Which film would you like to purchase tickets for - White House Down, The Call, or About Time?
  24. 24. Which film would you like to purchase tickets for - White House Down, The Call, or About Time? The Call
  25. 25. OK, and which cinema should we book the tickets for The Call at?
  26. 26. OK, and which cinema should we book the tickets for The Call at? The Odeon, Leicester Square
  27. 27. Great. We've now reserved you tickets to see The Call at The Odeon, Leicester Square.
  28. 28. RESPONSIVE Web design Bringing The User Interface To The User
  29. 29. TODAY
  30. 30. Voice Search Native Apps
  31. 31. Voice Search Native Apps
  32. 32. TOMORROW
  33. 33. StreamInput API
  34. 34. StreamInput API
  35. 35. EmotionML
  36. 36. ACCESS THE WEB ANYTIME, ANYPLACE, ANYWHERE, ANYHOW.
  37. 37. ONE WEB

×