1 / 23

WEB304 Deep Dive into “HTML5”

WEB304 Deep Dive into “HTML5”. Giorgio Sardo Sr. Technical Evangelist Microsoft Corporation. blogs.msdn.com/Giorgio @ gisardo. What is “HTML5”?. HTML5 is the future of the Web. HTML5 is not (only) a marketing message. HTML5 is not complete, yet. HTML5 is large: testing is not binary.

merton
Download Presentation

WEB304 Deep Dive into “HTML5”

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. WEB304Deep Dive into “HTML5” Giorgio Sardo Sr. Technical Evangelist Microsoft Corporation • blogs.msdn.com/Giorgio • @gisardo

  2. What is “HTML5”? HTML5 is the future of the Web HTML5 is not (only) a marketing message HTML5 is not complete, yet HTML5 is large: testing is not binary HTML5 needs to be done the right way

  3. Map of “HTML5”

  4. Web Standards in action demo

  5. W3C HTML5 • <Canvas> • <Audio> • <Video> • Markup Elements • Header, Hgroup, Nav, Aside, Footer • Article, Section • Figure, Figcaption

  6. HTML5 Markup, <canvas>, <video> demo

  7. SVG 1.1 • Basic Shapes • Paths • Text • Transforms • Painting, Filling, Color • Scripting • Styling • Gradients, Patterns

  8. SVG 1.1 demo

  9. CSS 3 • Selectors • Backgrounds and Borders • Fonts (WOFF) • Media Queries • Color • Transformations • Namespaces • Values and Units

  10. CSS 3 demo

  11. ECMA Script 262 • Native JSON • New Array Methods • indexOf, forEach, every, map • Enhanced Object Model • create, defineProperty, getPrototypeOf • Computational Methods • string.Trim, toISOString, data.parse, date.now, bind

  12. ECMA Script 262 demo

  13. Frameworks and Tools • Visual Studio HTML5 & SVG Extensions • visualstudiogallery.msdn.microsoft.com

  14. Frameworks and Tools • Ai2Canvas Exporter • www.visitmix.com/lab

  15. Frameworks and Tools • Modernizr • www.modernizr.com

  16. Frameworks and Tools • Polyfills • github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills

  17. What’s next? • First Public Working Draft • Working Draft • Last Call • Candidate Recommendation • Recommendation

  18. The Beauty of the Web

  19. Resources • Book: Introducing HTML5 (Bruce Lawson, Remy Sharp) • W3C HTML5 Working Group – www.w3.org/html/wg • HTML5 Demo Gallery – www.beautyoftheweb.com • IE Blog – blogs.msdn.com/IE • IE9 Test Drive – www.ietestdrive.com • This Presentation: blogs.msdn.com/Giorgio

  20. Q&A • blogs.msdn.com/Giorgio Thank you

  21. Session Evaluations Tell us what you think, and you could win! All evaluations submitted are automatically entered into a daily prize draw*  Sign-in to the Schedule Builder at http://europe.msteched.com/topic/list/ * Details of prize draw rules can be obtained from the Information Desk.

  22. © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

More Related