More Related Content Similar to HTML5 - Yeah! (20) HTML5 - Yeah!5. “ The Internet is a strange,
huge beast. It is getting
bigger, faster and more
mobile each day.”
http://www.onlineschools.org/state-of-the-internet/soti.html
Monday, August 8, 11
9. HTML 2
Nov. 1995
Coolio - Gangsta’s Paradise
Monday, August 8, 11
10. HTML 3.2
Jan. 1997
Kenny G - Six of Hearts
Monday, August 8, 11
11. HTML 4
Dec. 1997
Eminem - The Slim Shady EP
Monday, August 8, 11
12. XHTML 1.0
Jan. 2000
The Presidents of the United States of America - Lump
Monday, August 8, 11
14. XHTML 1.1
May 2001
Janet Jackson - All For You
Monday, August 8, 11
15. HTML5
Jun. 2004
Usher - Yeah!
Monday, August 8, 11
16. I’ll get
you! HTML5
Jun. 2004
apple.com/hotnews/thoughts-on-flash/
Monday, August 8, 11
18. Web 2.0 Web 3.0
Everything
jQuery MooTools
What it’s not:
Games Flash Killer
YUI Audio CSS3
Silverlight Killer
Animations Video
Monday, August 8, 11
21. “ In the thinking of its
creators, HTML5 was
always just HTML.”
~ Jeffrey Zeldman
http://www.zeldman.com/2011/01/27/html5-vs-html/
Monday, August 8, 11
22. Natural evolution
HTML
of HTML.
http://blog.whatwg.org/html-is-the-new-html5
Monday, August 8, 11
23. Application
Platform
SEMANTICS CSS 3 GRAPHICS & 3D MULTIMEDIA
DEVICE PERFORMANCE &
CONNECTIVITY OFFLINE STORAGE INTEGRATION
ACCESS
Monday, August 8, 11
25. /> == >
but really
> > />
Monday, August 8, 11
28. <h2>
<a href=”#”>Heading</a>
</h2>
<p>
<a href=”#”>Text</a>
</p>
Hat Tip: Jeremy Keith (@adactio)
Monday, August 8, 11
29. <a href=”#”>
<h2>Heading</h2>
<p>Text</p>
</a>
Hat Tip: Jeremy Keith (@adactio)
Monday, August 8, 11
30. <header> <nav> <footer>
<section> <article>
<aside> <details>
<summary> <figure>
<video> <audio>
<canvas>
Monday, August 8, 11
31. <div class=”footer”>
<div class=”nav”>
<ul>
<li><a href=”#”>This</a></li>
<li><a href=”#”>That</a></li>
</ul>
</div>
</div>
Hat Tip: Jeremy Keith (@adactio)
Monday, August 8, 11
32. <footer>
<nav>
<a href=”#”>This</a>
<a href=”#”>That</a>
</nav>
</footer>
Hat Tip: Jeremy Keith (@adactio)
Monday, August 8, 11
33. <time>
<input type=”email”>
<input type=”url”>
Monday, August 8, 11
37. Section
or
Article?
http://andyrutledge.com/news-redux.php
Monday, August 8, 11
38. <article>
<header>
<h2>Lauren Cheney Stan...</h2>
<summary>Frankfurt...</summary>
<details>by Shelly...</details>
</header>
<figure>
<img src=”/photos/yay.jpg”>
<figcaption>Laur...</figcaption>
</figure>
<section id=”content”>
<p>When the 79th minute...</p>
<p>...</p>
</section>
<aside>
<a>Print</a> <a>Single Page</a>
<ul><li>...</li><li>...</li></ul>
</aside>
</article>
http://andyrutledge.com/news-redux.php
Monday, August 8, 11
39. Application
Platform
SEMANTICS CSS 3 GRAPHICS & 3D MULTIMEDIA
DEVICE PERFORMANCE &
CONNECTIVITY OFFLINE STORAGE INTEGRATION
ACCESS
Monday, August 8, 11
45. “ We realized we could do the full
Pandora experience without Flash.”
~ Tom Conrad, CTO - Pandora
pandora.com/newpandora
Monday, August 8, 11
52. document.createElement(“header”);
document.createElement(“footer”);
document.createElement(“section”);
document.createElement(“nav”);
and so on...
http://html5shiv.googlecode.com
Monday, August 8, 11
57. 95% of the Web
doesn’t validate.
Monday, August 8, 11
58. Beyond the
Rendering Engine
Monday, August 8, 11
60. Internet Explorer 9, Safari 5
<b><i>Hi there</i></b><i></i>
Firefox, Opera, Chrome
<b><i>Hi there</i></b>
http://labs.opera.com/news/2011/02/22/
Monday, August 8, 11
67. MORE RESOURCES
- diveintohtml5.com
- html5doctor.com
- html5wow.com
- html5demos.com
- html5accessibility.com/HTML5ASS/
- html5labs.interoperabilitybridges.com
Monday, August 8, 11
68. 4,835,049,149
400
New people come
online every minute
Monday, August 8, 11
71. “Do or do not.
There is no try.”
~ Yoda
Monday, August 8, 11
72. Thank you.
J. Cornelius
jcornelius.com
Monday, August 8, 11