1. HTML5 and Mobile Web Application Development

2. Bio 12+ years HTML/CSS/JavaScript. Focused on those technologies since 1999 Interface Architect at Isobar I work with cool companies- Adidas, Philips, Harvard, Gillette, Compete, Museum of Science Boston, State Street Twitter: @robreact Blog: htmlcssjavascript.comhtmlcssjavascript.com

3. What is HTML5?

4. "HTML5 is anything you want it to be as long as it's new and cool.“ – Peter Paul Koch http://www.quirksmode.org/blog/archives/2010/01/html5_means_wha.html

5. The Web Platform HTML5 – New Semantic elements – Video and audio – Form elements and input types – Offline Web Applications Related Technologies – SVG – Canvas – Geolocation – Web Storage

6. The Web Platform – WebSocket – WebGL EcmaScript, 5 th Edition (ES5) CSS3 – 2D Transforms – 3D Transforms – CSS Animations – CSS Transitions For a full rundown on these technologies see my article HTML5, CSS3, and related technologiesHTML5, CSS3, and related technologies (http://www.ibm.com/developerworks/web/library/wa-webstandards/index.html)http://www.ibm.com/developerworks/web/library/wa-webstandards/index.html

7. Add It All Up

8. What Does That Really Mean Much better tools for developing and deploying rich, interactive applications over the web.

9. Front End Engineers Are Really Happy Group Shot! From kurafire http://www.flickr.com/photos/kurafire/4112642903/ Happy Front End Engineers

10. On the Desktop It’s Not Quite “The Future” Yet

11. Although We Can (and do) Make it Work Raphaël – SVG Support Raphaël Excanvas – Canvas Support Excanvas Amplify.js – Client Side Storage Amplify.js Html5shim – New, Semantic elements Html5shim innerShiv – Dynamic Semantic elements innerShiv History.js – History API History.js css3pie – CSS3 Features css3pie Flexie - Flex box support Flexie Respond – Media Query Support Respond ETC

12. And I Should Point Out… IE9 is a great browser& IE10 will be even better. Crazy Emerging Tech Demo>

13. BUT, Still: ~50% Source: http://gs.statcounter.com/#browser_version-ww-monthly-201005-201105-barhttp://gs.statcounter.com/#browser_version-ww-monthly-201005-201105-bar Taking advantage of this stuff now takes dedication and a knowledgeable front end engineering team, especially if your particular audience skews toward older IE versions.

14. Mobile is a Different Story These are REALLY Good browsers

15. (In case you were wondering) This Will Have a Really Good Browser (that’s IE9)

16. No Wonder We’re Excited We can now build with one common set of APIs and provide engaging experiences for iOs, Android, BlackBerry, WebOS, and Windows Phone 7 devices.

17. Also, for better or worse iOS= (Kind of a big deal) “No Flash Photography of This Exhibit Case Please!” Leo Reynolds http://www.flickr.com/photos/lwr/12906579/

18. We Don’t Have to Leave the Desktop Behind With an all-encompassing design approach and an intelligent implementation, your mobile web app is just a web app that works like a charm on mobile. Your potential audience just jumped from tens to hundreds of millions (or billions, depending on how global your audience is and how well you handle older versions of IE.) This is also very powerful if you’ve got a limited set of browsers/devices to target on an Intranet.

19. Yes, There are Tools

20. They’re Here to Help jQuery Mobile Dojo Mobile mobile focused versions of popular JS libraries Sencha Touch Mobile specific Model-View-Controller (MVC) platform

21. It’s Not Perfect You don’t have full access to the device and device APIs “Webkit” doesn’t always what you think it means (and that’s ignoring any other mobile browser.) That means lots of testing if you’re going for broad support. No app store

22. But it’s Still Pretty Good …and it’s only going to get better