Your SlideShare is downloading. ×
0
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

WHAT IS HTML5?(20100510)

3,869

Published on

Published in: Technology
1 Comment
2 Likes
Statistics
Notes
No Downloads
Views
Total Views
3,869
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
147
Comments
1
Likes
2
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



































  • こういう方向性により、既存ベンダの実装努力を無為にせず、それらのAPIに依存したプログラムに「標準」のお墨付きを与えられる


  • Backward Compatibilityについては、非推奨の要素もブラウザがサポートすべきだし、
  • progress要素はtextContentもパースする。
    HTML4ブラウザで見ると、要素の内側のみが表示される。





















  • Transcript

    • 1. WHAT IS HTML5? SHUMPEI SHIRAISHI HTML5-DEVELOPERS-JP/GOOGLE API EXPERT(HTML5)
    • 2. WELCOME!
    • 3. WHO IS THIS?
    • 4. SHUMPEI SHIRAISHI
    • 5. OPEN WEB TECHNOLOGY HTML5
    • 6. MY ACTIVITY FOR HTML5
    • 7. GOOGLE API EXPERT(HTML5) HTML5-DEVELOPERS-JP SOME ARTICLES @ @ 11 HTML5 @ HP ...
    • 8. HTML5&API 2940 BP
    • 9. HTML5 HTML
    • 10. HTML5 HTML
    • 11. HTML5 API ( )
    • 12. HTML5 IS API
    • 13. HTML5 IS API DOM “DOM5 HTML” HTML/XHTML JavaScript API
    • 14. HTML5 IS API HTML/XHTML
    • 15. “HTML5” IS AMBIGUOUS WORD “HTML5” API API API Web Workers/Web SQL Database/Web Storage/etc/etc/etc....
    • 16. “HTML5” IS AMBIGUOUS WORD “Open Web Platform” HTML+CSS+JavaScript (+SVG) “ HTML5”
    • 17. HTML5 IS VERY, VERY, VERY BIG
    • 18. HTML5 ( HTML5 )
    • 19. HTML5 IS VERY, VERY, VERY BIG
    • 20. HTML5 IS VERY, VERY, VERY BIG
    • 21. HTML5
    • 22. SEMANTICS, ACCESSIBILITY PAVE THE COWPATHS HTML5 RICH INTERNET APPLICATIONS
    • 23. ARE YOU READY?
    • 24. HTML5 & ” PAVE THE COWPATHS”
    • 25. ,
    • 26. SEMANTICS, ACCESSIBILITY More Readable for Everyone
    • 27. SEMANTICS, ACCESSIBILITY More Readable for Everyone
    • 28. SEMANTICS, ACCESSIBILITY (section/article/nav/aside/...) (header/footer/time/command...) hidden (strong/small/b/i/address/menu...)
    • 29. SEMANTICS, ACCESSIBILITY <div class=”header”> <h1>Site Title</h1> <div class=”site-nav”> <ul><li>Home</li><li>Profile</li><li>Settings</li></ul> </div> </div> <div class=”content”> <div class=”article”>Main Content <div class=”date”>2009/11/23 </div> <div class=”address”> <a href=”mailto:a@a.jp”> </a></div> </div> </div> <div class=”footer”> <div class=”copyright”>Copyright ...</div> </div>
    • 30. SEMANTICS, ACCESSIBILITY <header> <h1>Site Title</h1> <nav> <ul><li>Home</li><li>Profile</li><li>Settings</li></ul> </nav> </header> <div class=”content”> <article>Main Content <time datetime=”2009-11-23”>2009/11/23 </time> <div> <address><a href=”mailto:a@a.jp”> </a></address></div> </article> </div> <footer> <small class=”copyright”>Copyright ...</small> </div>
    • 31. “PAVE THE COWPATH”
    • 32. Image by Noel Sarah Dietrich via Flickr
    • 33. EXAMPLES OF “PAVE THE COWPATH” HTML contentEditable/designMode/document.execCommand() innerHTML Drag & Drop API ...
    • 34. EXAMPLES OF “PAVE THE COWPATH” API IE6 Safari Firefox - Ian Hickson(HTML5 hito
    • 35. HTML5 HTML5 HTML4 HTML5 HTML5
    • 36. EXAMPLE OF COMPATIBILITY <progress> <progress value=75 max=100> ...[75 / 100]</progress> ...[75 / 100]
    • 37. “This specification evolves HTML and its related APIs to ease the authoring of Web-based applications.” HTML5 Draft Standard - 13 Nov 2009 (Ian Hickson)
    • 38. “ ” -Shumpei Shiraishi
    • 39. HTML5 & API 2D & 3D Web ....
    • 40. HTML5 & API 2D & 3D Graphics - HTML5 <canvas> element and API Video & Audio - HTML5 <video>/<audio> element and API Offline Web Applications - HTML5 <html manifest=attribute> and ApplicationCache Cross Domain Communication - HTML5 Cross Document Messaging, XHR Level2 Client Side Storage - Web Storage, Web SQL Database, Indexed Database API Background Processing - Web Workers Server Push / Bidirectional Communication - Server-Sent Events, Web Sockets ....
    • 41. 100%
    • 42. HTML5
    • 43. canvas IE XDM Video/Audio IE,Opera Web Storage Opera Web SQL Database Safari, Chrome Web Workers IE, Opera ...
    • 44. HTTP://A.DEVERIA.COM/CANIUSE/
    • 45. HTML5
    • 46. Blowing apart fragments of Video • HTML5 o Video o Canvas 1.video canvas 2 2. video canvas 3. canvas
    • 47. Movement Tracker • HTML5 o Video o Canvas o Web Workers 1. video canvas 2. 3.
    • 48. QuakeⅡ GWT Port • HTML5 o WebGL o Video/Audio o WebSockets o LocalStorage
    • 49. JAPANESE RESOURCES HTML5.jp HTML5 html5 Google API Expert ! HTML 5 API html5 API HTML5 html5
    • 50. JAPANESE COMMUNITY HTML5-developers-jp HTML5 html5 developers HTML5 Japanese Interest Group HTML5 W3C html5 japanese
    • 51. CONTACT mailto: shumpei.shiraishi at gmail.com twitter: @shumpei blog: http://d.hatena.ne.jp/Syunpei/ mixi: id=3989166

    ×