HTML5 & IE
•Transferir como PPTX, PDF•
0 gostou•718 visualizações
Main features of HTML5 supported by IE9, how Microsoft approaches HTML5, and how to work on HTML5 before it's finalized by W3C
Recomendados
Mais conteúdo relacionado
Semelhante a HTML5 & IE
Semelhante a HTML5 & IE (20)
Mais de Emad Alashi
Mais de Emad Alashi (11)
Último
Último (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
Notas do Editor
- 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