html5 for all
Post on 11-Sep-2014
12 views
DESCRIPTION
Keynote at the Converge SE about HTML5 and how to use it/support the cause. Amazing intro picture by Marina Lawson as a father's day present to her Dad Bruce !TRANSCRIPT
![Page 1: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/1.jpg)
Christian Heilmann, Mozilla, Converge SE, Columbia, SC, June 2011Picture of win by Marina Lawson, who rocks!
![Page 2: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/2.jpg)
![Page 3: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/3.jpg)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html lang="en"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>HTML - c'est moi!</title> <link rel="stylesheet" type="text/css" href="styles.css"> <script type="text/javascript" src="magic.js"> </script></head><body> <h1>Heading! Everybody duck!</h1> <p>I am content, hear me roar!</p> <p class="footer">By me!</p></body></html>
![Page 4: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/4.jpg)
![Page 5: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/5.jpg)
![Page 6: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/6.jpg)
![Page 7: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/7.jpg)
![Page 8: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/8.jpg)
<!DOCTYPE html> <html lang="en"><head> <meta charset="utf-8"> <title>HTML5, c'est moi, ou HTML...</title> <link rel="stylesheet" href="styles.css"> <script src="magic.js"></script></head><body> <h1>Heading! Everybody duck!</h1> <p>I am content, hear me roar!</p> <p class="footer">By me!</p></body></html>
![Page 9: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/9.jpg)
<!DOCTYPE html> <html lang="en"><head> <title>HTML5, c'est moi, ou HTML...</title> <link rel="stylesheet" href="styles.css"> <script src="magic.js"></script></head><body> <header><h1>Heading! Everybody duck!</h1></header> <section> <p>I am content, hear me roar!</p> </section> <footer><p>By me!</p></footer></body></html>
![Page 10: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/10.jpg)
<section> <nav> <article>
<aside> <hgroup>
<header> <footer> <time>
<mark> <details> <figure> <figcaption> ...
![Page 11: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/11.jpg)
![Page 12: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/12.jpg)
<video src="interview.ogv" controls> <a href="interview.ogv">Download video</a></video>
![Page 13: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/13.jpg)
<canvas></canvas>
![Page 14: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/14.jpg)
And that’s it!
![Page 15: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/15.jpg)
![Page 17: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/17.jpg)
http://wheelsofsteel.net
http://wheelsofsteel.net
![Page 18: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/18.jpg)
Using capacities...
![Page 19: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/19.jpg)
http://folding.stanford.edu/
http://folding.stanford.edu/
![Page 20: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/20.jpg)
![Page 21: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/21.jpg)
![Page 22: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/22.jpg)
![Page 23: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/23.jpg)
10.2bnAndroid Devices
![Page 24: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/24.jpg)
42.3bn
iPhones
![Page 25: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/25.jpg)
2
numbers I made up and showed in a keynote style fashion!
![Page 26: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/26.jpg)
![Page 27: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/27.jpg)
Building the future web...
![Page 28: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/28.jpg)
![Page 29: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/29.jpg)
![Page 30: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/30.jpg)
![Page 31: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/31.jpg)
![Page 32: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/32.jpg)
NIHhttp://en.wikipedia.org/wiki/Not_Invented_Herehttp://www.flickr.com/photos/tillwe/1526490488/
http://www.flickr.com/photos/london/51301816/
![Page 33: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/33.jpg)
Old and good principles.
![Page 34: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/34.jpg)
![Page 35: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/35.jpg)
![Page 36: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/36.jpg)
![Page 37: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/37.jpg)
CMD+U(CTRL+U)
![Page 38: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/38.jpg)
Company support
![Page 39: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/39.jpg)
![Page 40: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/40.jpg)
http://www.youtube.com/watch?v=p92QfWOw88I
![Page 41: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/41.jpg)
![Page 42: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/42.jpg)
http://forums.silverlight.net/forums/p/230502/562077.aspx
![Page 43: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/43.jpg)
Screencast of Nikebetterworld
http://nikebetterworld.com/
![Page 44: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/44.jpg)
http://www.nissanusa.com/leaf-electric-car/index
![Page 45: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/45.jpg)
![Page 46: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/46.jpg)
Adapting to change...
![Page 47: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/47.jpg)
Markup
Stuff for Browser/Parser developers
HTML(5)
JavaScript APIsgeneral WTF
![Page 48: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/48.jpg)
![Page 49: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/49.jpg)
![Page 50: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/50.jpg)
![Page 51: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/51.jpg)
Let’s check the toy box!
![Page 53: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/53.jpg)
http://jasonweaver.name
Mediaqueries
![Page 54: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/54.jpg)
![Page 55: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/55.jpg)
http://thisshell.com
HTML5 Video + Canvas
![Page 56: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/56.jpg)
http://github.com
History pushstate
![Page 59: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/59.jpg)
Local Storage
http://www.flickr.com/photos/blude/2665906010/
![Page 60: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/60.jpg)
Offline
![Page 61: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/61.jpg)
CSS3
![Page 62: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/62.jpg)
Geolocation
![Page 63: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/63.jpg)
Web Sockets
![Page 64: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/64.jpg)
![Page 65: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/65.jpg)
in
3D
![Page 66: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/66.jpg)
![Page 67: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/67.jpg)
WebGL
http://bodybrowser.googlelabs.com
![Page 68: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/68.jpg)
http://pepetz.com
WebGL
![Page 70: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/70.jpg)
https://demos.mozilla.org/en-US/#holo-mobile
![Page 71: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/71.jpg)
http://animatable.com
![Page 73: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/73.jpg)
![Page 74: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/74.jpg)
http://www.schillmania.com/content/entries/2011/wheels-of-steel/
http://wheelsofsteel.net
![Page 75: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/75.jpg)
http://butterapp.org | http://popcorn.js http://www.aviary.com/html5editor
![Page 76: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/76.jpg)
![Page 77: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/77.jpg)
![Page 78: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/78.jpg)
Help is available!
![Page 79: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/79.jpg)
![Page 80: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/80.jpg)
![Page 81: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/81.jpg)
http://butterapp.org | http://popcorn.js
![Page 89: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/89.jpg)
![Page 90: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/90.jpg)
![Page 91: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/91.jpg)
![Page 92: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/92.jpg)
![Page 93: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/93.jpg)
![Page 94: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/94.jpg)
![Page 95: HTML5 for all](https://reader034.vdocument.in/reader034/viewer/2022051512/5411c4567bef0ad2678b8708/html5/thumbnails/95.jpg)