Bruce lawson Stockholm Geek Meet

1,602 views

Published on

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,602
On SlideShare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Bruce lawson Stockholm Geek Meet

  1. 1. Open Standards: democratising and future-proofing the Web Bruce Lawson / Geek Meetup / Stockholm / 20 September 2010
  2. 2. Web Evangelist at Opera
  3. 3. Opera – one browser on many devices
  4. 4. "Our goal is to take the one true Web and make it available to people on their terms." Jon S. von Tetzchner, Opera Co-founder "All I ask is access to the full Web, everywhere. And some more beer." Me
  5. 5. Executive Summary: Open Web Standards make the Web open for people with disabilities and people without access to the latest expensive hardware.
  6. 6. Executive Summary continued: Open Web Standards reduce reliance on any single vendor. Open Web Standards = profit!
  7. 7. The most important program on your computer is your browser
  8. 8. Legal and General's redesign www.brucelawson.co.uk/pas78
  9. 9. By-products of the redesign: ● 30% increase in natural search-engine traffic ● 75% reduction in page load time ● No more browser-incompatibility problems ● Accessible to mobile devices ● Time spent to manage content “reduced from 5 days to 0.5 days per job”
  10. 10. No money, no honey etc ● Savings of £200,000 annually on site maintenance ● 90% increase in online sales ● 100% return on investment in less than 12 months.
  11. 11. 1. new web standards 2. adaptive content 3. browser as platform
  12. 12. 1. new web standards 2. adaptive content 3. browser as platform
  13. 13. HTML5 <!DOCTYPE html>
  14. 14. HTML5 does not replace HTML 4.01
  15. 15. HTML5 has more bling!
  16. 16. “...extending the language to better support Web applications, since that is one of the directions the Web is going in and is one of the areas least well served by HTML so far. This puts HTML in direct competition with other technologies intended for applications deployed over the Web, in particular Flash and Silverlight.” Ian Hickson, Editor of HTML5 http://lists.w3.org/Archives/Public/public-html/2009Jan/0215.html
  17. 17. HTML5 is umbrella term: markup elements and JavaScript APIs
  18. 18. Webforms – more powerful form elements Validation, without JavaScript
  19. 19. <canvas> “scriptable images”
  20. 20. <video>
  21. 21. video as native object...why is it important? ● “play nice” with rest of the page ● keyboard accessibility built-in ● API for controls ● developers have a choice
  22. 22. 1. new web standards 2. adaptive content 3. browser as platform
  23. 23. WWW
  24. 24. Wealthy Western Web
  25. 25. Towards a World-Wide Web 1.6 billion people are online, yet more than 4 billion people — two out of every three people on Earth — have a mobile phone or access to one. www.opera.com/smw/2009/10/
  26. 26. China “The proportion of [people] accessing the Internet by mobile increased enormously from 39.5% in late 2008 to 46% in June 2009, while the proportion of using desktops and laptops decreased”. (close to 150 million people). Statistical Report on Internet Development in China, p25-26, July 2009, www.ccnic.cn
  27. 27. India There is one bank branch for every 14,000 people, one ATM for every 5000 people but a mobile for every 2.3 people in India. More people in India have access to a mobile phone than even a proper toilet.
  28. 28. “One Web means making, as far as is reasonable, the same information and services available to users irrespective of the device they are using. However, it does not mean that exactly the same information is available in exactly the same representation across all devices.” W3C Mobile Web Best Practices http://www.w3.org/TR/mobile-bp/#OneWeb
  29. 29. 1. do nothing
  30. 30. not WAP or text anymore...
  31. 31. mobile browsers will work ok-ish
  32. 32. 2. separate mobile site (m.flickr.com, mobile.mysite.com, ...)
  33. 33. beware browser sniffing photo: http://www.flickr.com/photos/timdorr/2096272747/
  34. 34. refactored for small screen, not dumbed down for mobile
  35. 35. offer users choice: desktop or mobile?
  36. 36. 3. single adaptive site
  37. 37. CSS 3 Media Queries: @media screen and (max-device-width: 480px) { // insert CSS rules here } http://www.w3.org/TR/css3-mediaqueries/ Demonstration of Media Queries
  38. 38. 1. new web standards 2. adaptive content 3. browser as platform
  39. 39. “…the browser run-time is perfect…you’re out of writing for Windows Mobile, Android, S60, each of which require testing...we want to abstract that. All the cool innovation is happening inside the browser – you don’t need to write to the native operating system anymore.” Mobile Entertainment Market, June, 2009
  40. 40. W3C Widgets – application development filled with web standards goodness, using browser engine as platform
  41. 41. Anatomy of a widget
  42. 42. W3C DAP (Devices and Protocols Working Group)
  43. 43. Defining JavaScript APIs: ● Contacts (access address book) ● Calendar API ● Media Capture API (programmatic access to camera/microphone) ● Messaging API (email/ SMS) http://www.w3.org/2009/dap/ Read all about it: http://berjon.com/blog/2010/09/dap.html
  44. 44. 1. new web standards 2. adaptive content 3. browser as platform
  45. 45. www.opera.com/developer bruce.lawson@opera.com twitter.com@brucel

×