HTML5 Web Standards

•

0 gostou•793 visualizações

Vu Tran Lam

HTML5 Web Standards

Tecnologia

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 (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

+
The Web Platform is Accelerating
Saturday, March 9, 13

+
It’s Solving Developer Challenges
Saturday, March 9, 13

+
Timeline of Web Technologies
Saturday, March 9, 13

+
More Powerful Web?
Saturday, March 9, 13

+
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

+
Form Field Types
Implemented
Not yet (Only Opera supports)
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="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

+
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

+
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

+
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

+
New JS APIs
n Desktop experience (Notifications, Drag and Drop API)
n Geolocation
n Web Storage
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 Code
Saturday, March 9, 13

+
Geolocation Demo
n Show current postion
Saturday, March 9, 13

+
Web Storage Demo
Saturday, March 9, 13

+
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

+
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/CSS/current-work#CSS3
n http://css3generator.com/
Saturday, March 9, 13

Mais conteúdo relacionado

Destaque

Introduction to iPhone Programming Vu Tran Lam

Responsive Web DesignVu Tran Lam

Building a Completed iPhone AppVu Tran Lam

Session 4 - Object oriented programming with Objective-C (part 2)Vu Tran Lam

Session 15 - Working with Image, Scroll, Collection, Picker, and Web ViewVu Tran Lam

Session 16 - Designing universal interface which used for iPad and iPhoneVu Tran Lam

Succeed in Mobile careerVu Tran Lam

Introduction to MVC in iPhone DevelopmentVu Tran Lam

3D & Animation Effects Using CSS3 & jQueryVu Tran Lam

Session 3 - Object oriented programming with Objective-C (part 1)Vu Tran Lam

Session 12 - Overview of taps, multitouch, and gestures Vu Tran Lam

Session 13 - Working with navigation and tab barVu Tran Lam

Session 14 - Working with table view and search barVu Tran Lam

Session 5 - Foundation frameworkVu Tran Lam

130522 book study-사례로보는ux디자인정인 주

Session 8 - Xcode 5 and interface builder for iOS 7 applicationVu Tran Lam

서비스디자인, 경험 경제를 디자인하다 - K디자인 2014년 가을호 서비스디자인 특집한국디자인진흥원 공공서비스디자인PD

Session 7 - Overview of the iOS7 app development architectureVu Tran Lam

Some Dos and Don’ts in UI/UX Design of Mobile ApplicationsAshiq Uz Zoha

Session 1 - Introduction to iOS 7 and SDKVu Tran Lam

Destaque (20)

Introduction to iPhone Programming

Responsive Web Design

Building a Completed iPhone App

Session 4 - Object oriented programming with Objective-C (part 2)

Session 15 - Working with Image, Scroll, Collection, Picker, and Web View

Session 16 - Designing universal interface which used for iPad and iPhone

Succeed in Mobile career

Introduction to MVC in iPhone Development

3D & Animation Effects Using CSS3 & jQuery

Session 3 - Object oriented programming with Objective-C (part 1)

Session 12 - Overview of taps, multitouch, and gestures

Session 13 - Working with navigation and tab bar

Session 14 - Working with table view and search bar

Session 5 - Foundation framework

130522 book study-사례로보는ux디자인

Session 8 - Xcode 5 and interface builder for iOS 7 application

서비스디자인, 경험 경제를 디자인하다 - K디자인 2014년 가을호 서비스디자인 특집

Session 7 - Overview of the iOS7 app development architecture

Some Dos and Don’ts in UI/UX Design of Mobile Applications

Session 1 - Introduction to iOS 7 and SDK

Semelhante a HTML5 Web Standards

Drupal, rotative numérique pour un groupe de presseAudaxis

Drupal - Digital publishing platform for Press & Media groupEric Fesler

IE9 the story so farthebeebs

Echo HTML5Nathan Smith

夜宴39期《Seven》Koubei Banquet

JSDay 2013 - Practical Responsive Web DesignJonathan Klein

Beyond The Web: Drupal Meets The Desktop (And Mobile)Justin Miller

Green Shoots in the Brownest Field: Being a Startup in GovernmentC4Media

Tek 2013 - Building Web Apps from a New Angle with AngularJSPablo Godel

HTML5ではないサイトを HTML5へ - Change HTML5 from Not HTML5.Sadaaki HIRAI

The Rich Standard: Getting Familiar with HTML5Todd Anglin

This Old Website: : Applying HTML5, CSS3, and Responsive Design to An Existin...Wolf Loescher

WI Azure User Group MeetingClark Sell

Familiar HTML5 - 事例とサンプルコードから学ぶ身近で普通に使わているHTML5Sadaaki HIRAI

Developing web applications in 2010Ignacio Coloma

Html5/CSS3Melissa kadi

Giáo trình học Html5/Css3Ho Ngoc Tan

Making the Switch, Part 1: Top 5 Things to Consider When Evaluating DrupalAcquia

HTML5 multimedia - where we are, where we're goingbrucelawson

WebDev Referencesdynamis

Semelhante a HTML5 Web Standards (20)

Drupal, rotative numérique pour un groupe de presse

Drupal - Digital publishing platform for Press & Media group

IE9 the story so far

Echo HTML5

夜宴39期《Seven》

JSDay 2013 - Practical Responsive Web Design

Beyond The Web: Drupal Meets The Desktop (And Mobile)

Green Shoots in the Brownest Field: Being a Startup in Government

Tek 2013 - Building Web Apps from a New Angle with AngularJS

HTML5ではないサイトを HTML5へ - Change HTML5 from Not HTML5.

The Rich Standard: Getting Familiar with HTML5

This Old Website: : Applying HTML5, CSS3, and Responsive Design to An Existin...

WI Azure User Group Meeting

Familiar HTML5 - 事例とサンプルコードから学ぶ身近で普通に使わているHTML5

Developing web applications in 2010

Html5/CSS3

Giáo trình học Html5/Css3

Making the Switch, Part 1: Top 5 Things to Consider When Evaluating Drupal

HTML5 multimedia - where we are, where we're going

WebDev References

Último

Developer Data Modeling Mistakes: From Postgres to NoSQLScyllaDB

SAP Build Work Zone - Overview L2-L3.pptxNavinnSomaal

Ensuring Technical Readiness For Copilot in Microsoft 3652toLead Limited

Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar

AI as an Interface for Commercial BuildingsMemoori

E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxnull - The Open Security Community

SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero

Advanced Test Driven-Development @ php[tek] 2024Scott Keck-Warren

My INSURER PTE LTD - Insurtech Innovation Award 2024The Digital Insurer

Story boards and shot lists for my a level piececharlottematthew16

Human Factors of XR: Using Human Factors to Design XR SystemsMark Billinghurst

Powerpoint exploring the locations used in television show Time Clashcharlottematthew16

Anypoint Exchange: It’s Not Just a Repo!Manik S Magar

Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationSafe Software

Gen AI in Business - Global Trends Report 2024.pdfAddepto

Install Stable Diffusion in windows machinePadma Pradeep

Connect Wave/ connectwave Pitch Deck PresentationSlibray Presentation

Commit 2024 - Secret Management made easyAlfredo García Lavilla

Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Patryk Bandurski

Training state-of-the-art general text embeddingZilliz

HTML5 Web Standards

1. Saturday, March 9, 13

2. HTML 5* Saturday, March 9, 13

3. Next Generation Web Standards HTML 5* Saturday, March 9, 13

4. Next Generation Web Standards Presented by Vu Tran Lam HTML 5* Saturday, March 9, 13

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. + The Web Platform is Accelerating Saturday, March 9, 13

7. + The Web Platform is Accelerating Saturday, March 9, 13

8. + It’s Solving Developer Challenges Saturday, March 9, 13

9. + It’s Solving Developer Challenges Saturday, March 9, 13

10. + Timeline of Web Technologies Saturday, March 9, 13

11. + Timeline of Web Technologies Saturday, March 9, 13

12. + More Powerful Web? Saturday, March 9, 13

13. + More Powerful Web? Saturday, March 9, 13

14. + Saturday, March 9, 13

15. + Saturday, March 9, 13

16. + Saturday, March 9, 13

17. + Saturday, March 9, 13

18. + What is HTML 5? Saturday, March 9, 13

19. + What is HTML 5? Saturday, March 9, 13

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. + Layout Tags Saturday, March 9, 13

22. + Layout Tags Saturday, March 9, 13

23. + Layout Tags Saturday, March 9, 13

24. + Form Field Types Implemented Not yet (Only Opera supports) Saturday, March 9, 13

25. + Multimedia (Audio + Video) Saturday, March 9, 13

26. + Multimedia (Audio + Video) Saturday, March 9, 13

27. + Multimedia (Audio + Video) Saturday, March 9, 13

28. + Multimedia (Audio + Video) Saturday, March 9, 13

29. + Multimedia (Audio + Video) Saturday, March 9, 13

30. + Flash Video HTML Tag Saturday, March 9, 13

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. + 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. + 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. + HTML 5 Audio and Video Saturday, March 9, 13

35. + HTML 5 Audio and Video Saturday, March 9, 13

36. + HTML 5 Audio and Video Saturday, March 9, 13

37. + HTML 5 Audio and Video Look, so easy, so simple Saturday, March 9, 13

38. + Audio and Video Demo n Make ogg Video n Audio and Video player demo Saturday, March 9, 13

39. + 2D and 3D Drawing Saturday, March 9, 13

40. + 2D and 3D Drawing Saturday, March 9, 13

41. + Canvas Saturday, March 9, 13

42. + Canvas Saturday, March 9, 13

43. + Canvas Tag Saturday, March 9, 13

44. + Canvas Demo n Basic canvas n Photo viewer FPT - Aptech Saturday, March 09, 2013 Saturday, March 9, 13

45. + 03/09/13FPT - Aptech Saturday, March 9, 13

46. + 03/09/13FPT - Aptech Saturday, March 9, 13

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. + CSS 3 Demo Saturday, March 9, 13

49. + New JS APIs n Desktop experience (Notifications, Drag and Drop API) n Geolocation n Web Storage Saturday, March 9, 13

50. + Drag and Drop Saturday, March 9, 13

51. + Drag and Drop Saturday, March 9, 13

52. + Drag and Drop Drag here Saturday, March 9, 13

53. + Drag and Drop Drag here Saturday, March 9, 13

54. + Drag and Drop Code Saturday, March 9, 13

55. + Drag and Drop Demo n Web demo n Coming soon: drag files from your desktop Saturday, March 9, 13

56. + Geolocation Saturday, March 9, 13

57. + Geolocation Saturday, March 9, 13

58. + Geolocation Code Saturday, March 9, 13

59. + Geolocation Demo n Show current postion Saturday, March 9, 13

60. + Web Storage Saturday, March 9, 13

61. + Web Storage Demo Saturday, March 9, 13

62. + HTML 5 Support Saturday, March 9, 13

63. + HTML 5 Support Saturday, March 9, 13

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. + Q & A Saturday, March 9, 13

66. + Q & A Saturday, March 9, 13

67. + What is the Future of Flash? Saturday, March 9, 13

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. + Saturday, March 9, 13

70. + Saturday, March 9, 13