HTML5 & IE
•Download as PPTX, PDF•
0 likes•718 views
Main features of HTML5 supported by IE9, how Microsoft approaches HTML5, and how to work on HTML5 before it's finalized by W3C
Recommended
More Related Content
Similar to HTML5 & IE
Similar to HTML5 & IE (20)
More from Emad Alashi
More from Emad Alashi (11)
Recently uploaded
Recently uploaded (20)
HTML5 & IE
- 1. M i c r o s o f t | O p e n D o o r • • • • • www.EmadAshi.com • www.DotNetArabi.com •
- 2. M i c r o s o f t | O p e n D o o r
- 3. M i c r o s o f t | O p e n D o o r HTML5&IE
- 4. M i c r o s o f t | O p e n D o o r • • • •
- 5. M i c r o s o f t | O p e n D o o r W3C WHATWG Web Hypertext Application Technology Working Group World Wide Web Consortium
- 6. M i c r o s o f t | O p e n D o o r HTML CSS3 JS SVG
- 7. M i c r o s o f t | O p e n D o o r Platform Independent Standards Rich User Experience Less Bandwidth Semantically Connected Content The Next Web Device Independent
- 8. M i c r o s o f t | O p e n D o o r Candidate Recommendation 2012 W3C Recommendation 2022
- 9. M i c r o s o f t | O p e n D o o r Site-ready HTML5 IE9 CTP’s IE10 Test Cases to W3C HTML5 Lab
- 10. M i c r o s o f t | O p e n D o o r • • • • • •
- 11. M i c r o s o f t | O p e n D o o r
- 12. M i c r o s o f t | O p e n D o o r Semantic Web <footer>
- 13. M i c r o s o f t | O p e n D o o r Video & Audio • • • • • •
- 14. M i c r o s o f t | O p e n D o o r Demo Video & Audio
- 15. M i c r o s o f t | O p e n D o o r • • • • • SVG
- 16. M i c r o s o f t | O p e n D o o r Demo SVG
- 17. M i c r o s o f t | O p e n D o o r Canvas <canvas id="myCanvas" width="400" height="200" > Your browser does not support the canvas element. </canvas> <script type="text/javascript"> var c = document.getElementById("myCanvas"); var cxt = c.getContext("2d"); cxt.fillStyle = "#FF0000"; cxt.fillRect(0,0,150,75); </script>
- 18. M i c r o s o f t | O p e n D o o r Canvas Demo1 Demo2
- 19. M i c r o s o f t | O p e n D o o r Geolocation Microsoft Location Service
- 20. M i c r o s o f t | O p e n D o o r Geolocation navigator.geolocation.getCurrentPosition(foundIt, failed); Function foundIt(pos) { pos.coords.latitude; pos.coords.longitude; } Function failed() { alert(‘Hahahaaaawz!’); }
- 21. M i c r o s o f t | O p e n D o o r Geolocation Demo
- 22. M i c r o s o f t | O p e n D o o r • • • • • • • • Web Storage
- 23. M i c r o s o f t | O p e n D o o r Web Storage localStorage.getItem(‘key’) localStorage.setItem(‘key’) sessionStorage.getItem(‘key’) sessionStorage.setItem(‘key’)
- 24. M i c r o s o f t | O p e n D o o r Web Storage Demo
- 25. M i c r o s o f t | O p e n D o o r • • • • • CSS3 MediaQuery @media screen and (min-width: 400px) and (max-width: 800px) { … }
- 26. M i c r o s o f t | O p e n D o o r CSS3 MediaQuery Demo
- 27. M i c r o s o f t | O p e n D o o r HTML5 <!DOCTYPE html>
- 28. M i c r o s o f t | O p e n D o o r Graphic Accelerator
- 29. M i c r o s o f t | O p e n D o o r • • • • JavaScript Engine Chakra
- 30. M i c r o s o f t | O p e n D o o r
- 31. M i c r o s o f t | O p e n D o o r IE10 • • • • • • • • •
- 32. M i c r o s o f t | O p e n D o o r
- 33. M i c r o s o f t | O p e n D o o r • • • • Modernizr.load({ test: Modernizr.geolocation, yep : 'geo.js', nope: 'geo-polyfill.js' });
- 34. M i c r o s o f t | O p e n D o o r • • • •
- 35. M i c r o s o f t | O p e n D o o r • beautyoftheweb.com • caniuse.com • ietestdrive.com • html5labs.com • html5demos.com • html5rocks.com • html5readiness.com • Internet Explorer 10 Guide for Developers
- 36. M i c r o s o f t | O p e n D o o r • http://msdn.microsoft.com/en-us/magazine/hh335062.aspx • http://msdn.microsoft.com/en-us/magazine/hh394148.aspx • http://www.w3schools.com/html5/default.asp • The Architecture of Full Hardware Acceleration of All Web Page Content • http://html5doctor.com/ •
- 37. M i c r o s o f t | O p e n D o o r www.EmadAshi.com www.DotNetArabi.com
Editor's Notes
- WHATWG: 2004, Apple, Mozilla, and Opera W3c: 2007 Microsoft is a member of W3C
- Usually when you say HTML5 it means the group, not only HTML
- The whole features and specifications together make the next web, look at the whole picture
- W3C Recommendation: two 100% complete and fully interoperable implementations
- Deliver the best site-ready HTML5 today via Internet Explorer 9. (Canvas, Geolocation, Audio, Video,…etc) IETestDrive.com Expose upcoming features to developers via Internet Explorer Platform Previews CTP: Internet Explorer 10 Guide for Developers: http://msdn.microsoft.com/en-us/ie/gg192966.aspx. Invest in interoperability through tests submitted to the W3C (IE Testing Center : http://samples.msdn.microsoft.com/ietestcenter). Prototype unstable standards via HTML5 labs (HTML5Labs.com). Reference: http://msdn.microsoft.com/en-us/magazine/hh335062.aspx
- You can use the attribute “controls” to display controls, you can control the video through API’s
- http://www.w3schools.com/html5/tryit.asp?filename=tryhtml5_video_all
- created and edited with any text editor searched, indexed, scripted, and compressed printed with high quality at any resolution zoomable
- Compiled Type optimized Fast Interpreter Library Optimizations