Upgrade to Pro — share decks privately, control downloads, hide ads and more …

HTML5 - Yeah!

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for J Cornelius J Cornelius
November 18, 2011
Technology
3
370

HTML5 - Yeah!

Presented at ReMix South, Aug. 6th 2011.

Avatar for J Cornelius

J Cornelius

November 18, 2011
Tweet

More Decks by J Cornelius

See All by J Cornelius
Product Strategy for the New Normal
Avatar for J Cornelius jc
0
45
Human-Centered Product Design
Avatar for J Cornelius jc
3
390
Designing for Humans
Avatar for J Cornelius jc
1
100
Redesign Your Design Thinking
Avatar for J Cornelius jc
5
1.3k
Digital Fluency and User Experience
Avatar for J Cornelius jc
1
240
Mobile Commerce Mistakes
Avatar for J Cornelius jc
1
180
Design, Experience, Startups
Avatar for J Cornelius jc
3
180
Design for Success - Fundamentals that Build Brand
Avatar for J Cornelius jc
3
590
The Why of HTML5 - ConvergeSE 2012
Avatar for J Cornelius jc
2
290

Other Decks in Technology

See All in Technology
AIエンジニア Devin と歩む、自律型運用プロセスの構築
Avatar for a2-ito a2ito
0
490
Windows ネットワークを再確認する
Avatar for Murachi Akira murachiakira
PRO
0
210
Claude Codeはレガシー移行でどこまで使えるのか？
Avatar for ak2ie ak2ie
1
1.1k
論文検索を日本語でできるアプリを作ってみた
Avatar for sai-lens sailen2
0
150
全自動で回せ！Claude Codeマーケットプレイス運用術
Avatar for ugo yukyu30
3
150
社内ワークショップで終わらせない 業務改善AIエージェント開発
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
1
430
primeNumber DATA MANAGEMENT CAMP #2：
Avatar for 阿部 昌利 masatoshi0205
1
650
dbt meetup #19 『dbtを『なんとなく動かす』を卒業します』
Avatar for t-hiroto tiltmax3
0
130
競争優位を生み出す戦略的内製開発の実践技法
Avatar for 増田 亨 masuda220
PRO
2
520
NW構成図の自動描画は何が難しいのか?/netdevnight3
Avatar for m.hagiwara corestate55
2
520
社内でAWS BuilderCards体験会を立ち上げ、得られた気づき / 20260225 Masaki Okuda
Avatar for SHIFT EVOLVE shift_evolve
PRO
1
150
LINEアプリ開発のための Claude Code活用基盤の構築
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
1
1.2k

Featured

See All Featured
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
370
20k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.4k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.1k
The SEO Collaboration Effect
Avatar for Kristina Bergwall kristinabergwall1
0
380
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
47
8k
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
274
21k
SEO Brein meetup: CTRL+C is not how to scale international SEO
Avatar for Linda Hogenes lindahogenes
0
2.4k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
Avatar for Dr. Kim W Petersen kimpetersen
PRO
1
620
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.3k
It's Worth the Effort
Avatar for 3n 3n
188
29k
Marketing Yourself as an Engineer | Alaka | Gurzu
Avatar for Gurzu gurzu
0
140

Transcript

  1. Monday, August 8, 11

  2. #remixhtml5 Monday, August 8, 11

  3. Monday, August 8, 11

  4. WHY? Monday, August 8, 11

  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

  6. 4,835,049,149 Monday, August 8, 11

  7. www.lingscars.com Monday, August 8, 11

  8. TIMELINE 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

  13. /> 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. HTML5 Jun. 2004 I’ll get you! apple.com/hotnews/thoughts-on-flash/ Monday, August 8,

    11

  17. apple.com/html5 Monday, August 8, 11

  18. Web 3.0 Web 2.0 What it’s not: Flash Killer Silverlight

    Killer CSS3 jQuery Animations MooTools YUI Video Audio Games Everything Monday, August 8, 11

  19. HTML 5 see that space? ...and it’s not Monday, August

    8, 11

  20. What it is. 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 of HTML. HTML http://blog.whatwg.org/html-is-the-new-html5 Monday, August 8, 11

  23. Application Platform SEMANTICS CSS 3 GRAPHICS & 3D MULTIMEDIA DEVICE

    ACCESS CONNECTIVITY OFFLINE STORAGE PERFORMANCE & INTEGRATION Monday, August 8, 11

  24. SEMANTICS Monday, August 8, 11

  25. /> > == /> > > but really Monday, August

    8, 11

  26. <!DOCTYPE html> Monday, August 8, 11

  27. <meta charset=”utf-8”> 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

  34. http://dev.opera.com/articles/view/new-form-features-in-HTML5/ Monday, August 8, 11

  35. <section> <article> Monday, August 8, 11

  36. http://andyrutledge.com/news-redux.php Monday, August 8, 11

  37. Section or Article? http://andyrutledge.com/news-redux.php Monday, August 8, 11

  38. <article> </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> http://andyrutledge.com/news-redux.php Monday, August 8, 11

  39. Application Platform SEMANTICS CSS 3 GRAPHICS & 3D MULTIMEDIA DEVICE

    ACCESS CONNECTIVITY OFFLINE STORAGE PERFORMANCE & INTEGRATION Monday, August 8, 11

  40. www.nikebetterworld.com Monday, August 8, 11

  41. www.thisshell.com Monday, August 8, 11

  42. http://mbostock.github.com/d3/ex/stack.html Monday, August 8, 11

  43. http://mbostock.github.com/d3/ex/bullet.html Monday, August 8, 11

  44. phonegap.com 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

  46. WHY? Monday, August 8, 11

  47. You already know it. Monday, August 8, 11

  48. What about browser support, man? Monday, August 8, 11

  49. Monday, August 8, 11

  50. Browsers already know it, too. Monday, August 8, 11

  51. document.createElement(); http://html5shiv.googlecode.com 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

  53. Offline Storage Monday, August 8, 11

  54. Geolocation Monday, August 8, 11

  55. Because it’s already all around you. Monday, August 8, 11

  56. Because of IE6. 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

  59. <b><i>Hi there</b></i> http://labs.opera.com/news/2011/02/22/ Monday, August 8, 11

  60. Internet Explorer 9, Safari 5 <b><i>Hi there</i></b> <b><i>Hi there</i></b><i></i> Firefox,

    Opera, Chrome http://labs.opera.com/news/2011/02/22/ Monday, August 8, 11

  61. Because it’s cool. Monday, August 8, 11

  62. Resources Monday, August 8, 11

  63. vid.ly Monday, August 8, 11

  64. html5boilerplate.com @boiler_plate Monday, August 8, 11

  65. modernizr.com @modernizr Monday, August 8, 11

  66. github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills 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. 400 New people come online every minute 4,835,049,149 Monday, August

    8, 11

  69. www.lingscars.com Monday, August 8, 11

  70. nissanusa.com/leaf-electric-car 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