HTML5 and the web of tomorrow!

  • 14,139 views
Uploaded on

Presentation at web2day in Nantes, France about the opportunities we have with HTML5 and how it means we move away from a static to an web of applications.

Presentation at web2day in Nantes, France about the opportunities we have with HTML5 and how it means we move away from a static to an web of applications.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
14,139
On Slideshare
0
From Embeds
0
Number of Embeds
11

Actions

Shares
Downloads
260
Comments
4
Likes
21

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. HTML5 and the web of tomorrow!Christian Heilmann, Mozilla, Web2Day, Nantes, France, June 2011
  • 2. Let’s take a lookat the web...
  • 3. Where is themagic?
  • 4. 6.5 minutes = 45,000 picturesHTML4
  • 5. Good enough?
  • 6. Extendingbrowsers
  • 7. NIHhttp://www.flickr.com/photos/tillwe/1526490488/http://www.flickr.com/photos/london/51301816/ Paving the road http://en.wikipedia.org/wiki/Not_Invented_Here
  • 8. Screencast of Nikebetterworld http://nikebetterworld.com/
  • 9. http://www.nissanusa.com/leaf-electric-car/index
  • 10. CMD+U(CTRL+U)
  • 11. Big players!
  • 12. http://www.20thingsilearned.com/
  • 13. http://www.htmlfivewow.com/
  • 14. http://www.youtube.com/watch?v=p92QfWOw88I
  • 15. http://forums.silverlight.net/forums/p/230502/562077.aspx
  • 16. http://wheelsofsteel.nethttp://wheelsofsteel.net
  • 17. You can be part of this!
  • 18. NIHhttp://en.wikipedia.org/wiki/Not_Invented_Here
  • 19. Things that make mehappy!
  • 20. <sec tion > <n <asid av> <hea e> < <art der> hgro icle><ma <foo up> rk> < ter> deta <tim <figc ils> < e> aptio figur n> .. e> .
  • 21. File APIs http://min.us
  • 22. Mediaqueries http://jasonweaver.name
  • 23. Multimedia in HTML<video src="interview.ogv" controls> <a href="interview.ogv">Download video</a></video>
  • 24. http://www.w3.org/2010/05/video/mediaevents.html
  • 25. HTML5 Video + Canvas http://thisshell.com
  • 26. History pushstate http://github.com
  • 27. SVG http://mbostock.github.com/d3/
  • 28. http://highcharts.com
  • 29. Local Storage http://www.flickr.com/photos/blude/2665906010/
  • 30. Offline
  • 31. CSS3
  • 32. Geolocation
  • 33. Web Sockets
  • 34. 2D is boring!
  • 35. in3D
  • 36. WebGL http://bodybrowser.googlelabs.com
  • 37. WebGL http://pepetz.com
  • 38. http://ro.me
  • 39. http://wheelsofsteel.nethttp://www.schillmania.com/content/entries/2011/wheels-of-steel/
  • 40. CSS3 animation + JS http://benthebodyguard.com
  • 41. https://demos.mozilla.org/en-US/#holo-mobile
  • 42. How can you take part inthis ride?
  • 43. Demand change!
  • 44. Internet Explorer 6...
  • 45. http://html5forxp.com
  • 46. Support open video!
  • 47. http://youtube.com/html5
  • 48. HTML5 Video, simple!
  • 49. http://butterapp.org | http://popcorn.js
  • 50. Start from a solid baseline.
  • 51. http://html5boilerplate.com/
  • 52. http://www.modernizr.com/
  • 53. https://build.phonegap.com/
  • 54. Use good tools!
  • 55. http://www.aloha-editor.org
  • 56. http://butterapp.org | http://popcorn.js http://www.aviary.com/html5editor
  • 57. http://scribd.com
  • 58. http://slideshare.net
  • 59. http://animatable.com
  • 60. http://animatable.com
  • 61. Learn and discuss!
  • 62. http://diveintohtml5.org/
  • 63. http://html5doctor.com/
  • 64. http://www.whatwg.org/mailing-list
  • 65. http://webowonder.org
  • 66. Merci!Chris Heilmann @codepo8 #mozilla#html5/freenet