Saturday, March 9, 13
HTML 5*
Saturday, March 9, 13
Next Generation Web Standards
HTML 5*
Saturday, March 9, 13
Next Generation Web Standards
Presented by Vu Tran Lam
HTML 5*
Saturday, March 9, 13
+
IT News
n iPad wifi + 3G is available in Apple Store and iPhone 4G with iPhone
OS 4 is coming in June or July of 2010 (...
+
The Web Platform is Accelerating
Saturday, March 9, 13
+
The Web Platform is Accelerating
Saturday, March 9, 13
+
It’s Solving Developer Challenges
Saturday, March 9, 13
+
It’s Solving Developer Challenges
Saturday, March 9, 13
+
Timeline of Web Technologies
Saturday, March 9, 13
+
Timeline of Web Technologies
Saturday, March 9, 13
+
More Powerful Web?
Saturday, March 9, 13
+
More Powerful Web?
Saturday, March 9, 13
+
Saturday, March 9, 13
+
Saturday, March 9, 13
+
Saturday, March 9, 13
+
Saturday, March 9, 13
+
What is HTML 5?
Saturday, March 9, 13
+
What is HTML 5?
Saturday, March 9, 13
+
New HTML 5 Elements
n Semantics (New tags, Link Relations, Microdata)
n Web Forms 2.0 (Input Fields)
n Multimedia (Au...
+
Layout Tags
Saturday, March 9, 13
+
Layout Tags
Saturday, March 9, 13
+
Layout Tags
Saturday, March 9, 13
+
Form Field Types
Implemented
Not yet (Only Opera supports)
Saturday, March 9, 13
+
Multimedia (Audio + Video)
Saturday, March 9, 13
+
Multimedia (Audio + Video)
Saturday, March 9, 13
+
Multimedia (Audio + Video)
Saturday, March 9, 13
+
Multimedia (Audio + Video)
Saturday, March 9, 13
+
Multimedia (Audio + Video)
Saturday, March 9, 13
+
Flash Video HTML Tag
Saturday, March 9, 13
+
Flash Video HTML Tag
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="344"
codebase="htt...
+
Flash Video HTML Tag
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="344"
codebase="htt...
+
Flash Video HTML Tag
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="344"
codebase="htt...
+
HTML 5 Audio and Video
Saturday, March 9, 13
+
HTML 5 Audio and Video
Saturday, March 9, 13
+
HTML 5 Audio and Video
Saturday, March 9, 13
+
HTML 5 Audio and Video
Look, so easy,
so simple
Saturday, March 9, 13
+
Audio and Video Demo
n Make ogg Video
n Audio and Video player demo
Saturday, March 9, 13
+
2D and 3D Drawing
Saturday, March 9, 13
+
2D and 3D Drawing
Saturday, March 9, 13
+
Canvas
Saturday, March 9, 13
+
Canvas
Saturday, March 9, 13
+
Canvas Tag
Saturday, March 9, 13
+
Canvas Demo
n Basic canvas
n Photo viewer
FPT - Aptech
Saturday, March 09,
2013
Saturday, March 9, 13
+
03/09/13FPT - Aptech
Saturday, March 9, 13
+
03/09/13FPT - Aptech
Saturday, March 9, 13
+
CSS 3
Cool stuff includes:
n Rounded corners
n Drop shadows
n Transparency
n Multiple background images
n Multi-col...
+
CSS 3 Demo
Saturday, March 9, 13
+
New JS APIs
n Desktop experience (Notifications, Drag and Drop API)
n Geolocation
n Web Storage
Saturday, March 9, 13
+
Drag and Drop
Saturday, March 9, 13
+
Drag and Drop
Saturday, March 9, 13
+
Drag and Drop
Drag here
Saturday, March 9, 13
+
Drag and Drop
Drag here
Saturday, March 9, 13
+
Drag and Drop Code
Saturday, March 9, 13
+
Drag and Drop Demo
n Web demo
n Coming soon: drag files from your desktop
Saturday, March 9, 13
+
Geolocation
Saturday, March 9, 13
+
Geolocation
Saturday, March 9, 13
+
Geolocation Code
Saturday, March 9, 13
+
Geolocation Demo
n Show current postion
Saturday, March 9, 13
+
Web Storage
Saturday, March 9, 13
+
Web Storage Demo
Saturday, March 9, 13
+
HTML 5 Support
Saturday, March 9, 13
+
HTML 5 Support
Saturday, March 9, 13
+
Websites Using HTML 5
n The NewYork Times - http://www.nytimes.com/
n Youtube.com (beta) - http://www.youtube.com/html...
+
Q & A
Saturday, March 9, 13
+
Q & A
Saturday, March 9, 13
+
What is the Future of Flash?
Saturday, March 9, 13
+
References
n http://dev.w3.org/html5/spec/Overview.html
n http://en.wikipedia.org/wiki/HTML
n http://www.w3.org/Style...
+
Saturday, March 9, 13
+
Saturday, March 9, 13
Upcoming SlideShare
Loading in...5
×

HTML5 Web Standards

470

Published on

HTML5 Web Standards

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
470
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
11
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "HTML5 Web Standards"

  1. 1. Saturday, March 9, 13
  2. 2. HTML 5* Saturday, March 9, 13
  3. 3. Next Generation Web Standards HTML 5* Saturday, March 9, 13
  4. 4. Next Generation Web Standards Presented by Vu Tran Lam HTML 5* Saturday, March 9, 13
  5. 5. + IT News n iPad wifi + 3G is available in Apple Store and iPhone 4G with iPhone OS 4 is coming in June or July of 2010 (Apple News) n Apple say No with flash platform (Apple News) n Mozilla trying to build VP8 into HTML5 video (CNET News) n Google tries freeing Web video with WebM (CNET News) n Google Chrome 5 adds HTML5 security feature for developers n Facebook videos make switch to HTML5 n Dreamweaver CS5 gets HTML5 extension Saturday, March 9, 13
  6. 6. + The Web Platform is Accelerating Saturday, March 9, 13
  7. 7. + The Web Platform is Accelerating Saturday, March 9, 13
  8. 8. + It’s Solving Developer Challenges Saturday, March 9, 13
  9. 9. + It’s Solving Developer Challenges Saturday, March 9, 13
  10. 10. + Timeline of Web Technologies Saturday, March 9, 13
  11. 11. + Timeline of Web Technologies Saturday, March 9, 13
  12. 12. + More Powerful Web? Saturday, March 9, 13
  13. 13. + More Powerful Web? Saturday, March 9, 13
  14. 14. + Saturday, March 9, 13
  15. 15. + Saturday, March 9, 13
  16. 16. + Saturday, March 9, 13
  17. 17. + Saturday, March 9, 13
  18. 18. + What is HTML 5? Saturday, March 9, 13
  19. 19. + What is HTML 5? Saturday, March 9, 13
  20. 20. + New HTML 5 Elements n Semantics (New tags, Link Relations, Microdata) n Web Forms 2.0 (Input Fields) n Multimedia (Audio Tag,Video Tag) n 2D and 3D drawing (Canvas,WebGL) Saturday, March 9, 13
  21. 21. + Layout Tags Saturday, March 9, 13
  22. 22. + Layout Tags Saturday, March 9, 13
  23. 23. + Layout Tags Saturday, March 9, 13
  24. 24. + Form Field Types Implemented Not yet (Only Opera supports) Saturday, March 9, 13
  25. 25. + Multimedia (Audio + Video) Saturday, March 9, 13
  26. 26. + Multimedia (Audio + Video) Saturday, March 9, 13
  27. 27. + Multimedia (Audio + Video) Saturday, March 9, 13
  28. 28. + Multimedia (Audio + Video) Saturday, March 9, 13
  29. 29. + Multimedia (Audio + Video) Saturday, March 9, 13
  30. 30. + Flash Video HTML Tag Saturday, March 9, 13
  31. 31. + Flash Video HTML Tag <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="344" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/ swflash.cab#version=6,0,40,0"> <param name="allowFullScreen" value="true" /> <param name="allowscriptaccess" value="always" /> <param name="src" value="http://www.youtube.com/v/oHg5SJYRHA0&hl=en&fs=1&"/> <param name="allowfullscreen" value="true" /> <embed type="application/x-shockwave-flash" width="425" height="344" src="http:// www.youtube.com/v/oHg5SJYRHA0&hl=en&fs=1&" allowscriptaccess="always" allowfullscreen="true"> </embed> </object> Saturday, March 9, 13
  32. 32. + Flash Video HTML Tag <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="344" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/ swflash.cab#version=6,0,40,0"> <param name="allowFullScreen" value="true" /> <param name="allowscriptaccess" value="always" /> <param name="src" value="http://www.youtube.com/v/oHg5SJYRHA0&hl=en&fs=1&"/> <param name="allowfullscreen" value="true" /> <embed type="application/x-shockwave-flash" width="425" height="344" src="http:// www.youtube.com/v/oHg5SJYRHA0&hl=en&fs=1&" allowscriptaccess="always" allowfullscreen="true"> </embed> </object> Saturday, March 9, 13
  33. 33. + Flash Video HTML Tag <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="344" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/ swflash.cab#version=6,0,40,0"> <param name="allowFullScreen" value="true" /> <param name="allowscriptaccess" value="always" /> <param name="src" value="http://www.youtube.com/v/oHg5SJYRHA0&hl=en&fs=1&"/> <param name="allowfullscreen" value="true" /> <embed type="application/x-shockwave-flash" width="425" height="344" src="http:// www.youtube.com/v/oHg5SJYRHA0&hl=en&fs=1&" allowscriptaccess="always" allowfullscreen="true"> </embed> </object> Ugh, terrible code Saturday, March 9, 13
  34. 34. + HTML 5 Audio and Video Saturday, March 9, 13
  35. 35. + HTML 5 Audio and Video Saturday, March 9, 13
  36. 36. + HTML 5 Audio and Video Saturday, March 9, 13
  37. 37. + HTML 5 Audio and Video Look, so easy, so simple Saturday, March 9, 13
  38. 38. + Audio and Video Demo n Make ogg Video n Audio and Video player demo Saturday, March 9, 13
  39. 39. + 2D and 3D Drawing Saturday, March 9, 13
  40. 40. + 2D and 3D Drawing Saturday, March 9, 13
  41. 41. + Canvas Saturday, March 9, 13
  42. 42. + Canvas Saturday, March 9, 13
  43. 43. + Canvas Tag Saturday, March 9, 13
  44. 44. + Canvas Demo n Basic canvas n Photo viewer FPT - Aptech Saturday, March 09, 2013 Saturday, March 9, 13
  45. 45. + 03/09/13FPT - Aptech Saturday, March 9, 13
  46. 46. + 03/09/13FPT - Aptech Saturday, March 9, 13
  47. 47. + CSS 3 Cool stuff includes: n Rounded corners n Drop shadows n Transparency n Multiple background images n Multi-column support FPT - Aptech Saturday, March 09, 2013 Saturday, March 9, 13
  48. 48. + CSS 3 Demo Saturday, March 9, 13
  49. 49. + New JS APIs n Desktop experience (Notifications, Drag and Drop API) n Geolocation n Web Storage Saturday, March 9, 13
  50. 50. + Drag and Drop Saturday, March 9, 13
  51. 51. + Drag and Drop Saturday, March 9, 13
  52. 52. + Drag and Drop Drag here Saturday, March 9, 13
  53. 53. + Drag and Drop Drag here Saturday, March 9, 13
  54. 54. + Drag and Drop Code Saturday, March 9, 13
  55. 55. + Drag and Drop Demo n Web demo n Coming soon: drag files from your desktop Saturday, March 9, 13
  56. 56. + Geolocation Saturday, March 9, 13
  57. 57. + Geolocation Saturday, March 9, 13
  58. 58. + Geolocation Code Saturday, March 9, 13
  59. 59. + Geolocation Demo n Show current postion Saturday, March 9, 13
  60. 60. + Web Storage Saturday, March 9, 13
  61. 61. + Web Storage Demo Saturday, March 9, 13
  62. 62. + HTML 5 Support Saturday, March 9, 13
  63. 63. + HTML 5 Support Saturday, March 9, 13
  64. 64. + Websites Using HTML 5 n The NewYork Times - http://www.nytimes.com/ n Youtube.com (beta) - http://www.youtube.com/html5 n Vimeo.com n CNN.com Saturday, March 9, 13
  65. 65. + Q & A Saturday, March 9, 13
  66. 66. + Q & A Saturday, March 9, 13
  67. 67. + What is the Future of Flash? Saturday, March 9, 13
  68. 68. + References n http://dev.w3.org/html5/spec/Overview.html n http://en.wikipedia.org/wiki/HTML n http://www.w3.org/Style/CSS/current-work#CSS3 n http://css3generator.com/ Saturday, March 9, 13
  69. 69. + Saturday, March 9, 13
  70. 70. + Saturday, March 9, 13
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×