Téléchargé 26 fois
Téléchargé parMicrosoft
Les nouveautés d’HTML5 et IE11 en action
Le document présente les nouvelles fonctionnalités d'HTML5 et CSS3 dans Internet Explorer 11, mettant en avant des améliorations de l'expérience utilisateur, des performances et des outils pour les développeurs. Les nouveautés incluent le support de WebGL, des API de médias avancées, et une meilleure gestion des chargements. Il souligne également l'importance de l'intégration avec les autres produits Microsoft et le développement autour d'ECMAScript 6.
![[Tech Days 2014 - Plénière J1] Votre futur est dans le code](https://cdn.slidesharecdn.com/ss_thumbnails/key201plenirej1v2-140212084321-phpapp02-thumbnail.jpg?width=640&height=640&fit=bounds)
Les nouveautés d’HTML5 et IE11 en action
- 2. Les nouveautés d’HTML5 &IE11 en action Philippe DIDIERGEORGES Développeur chez EID IE UserAgent http://blogs.developpeur.org/Philess @DePhiless Web
- 3. Donnez votre avis! Depuis votre smartphone sur : http://notes.mstechdays.fr De nombreux lots à gagner toute les heures !!! Claviers, souris et jeux Microsoft… Merci de nous aider à améliorer les Techdays ! #mstechdays Web
- 4. Sommaire • • • • • • Les nouveautés d’HTML5et CSS3 sur IE11 Expérience utilisateur Un nouveau monde de divertissement Performances Le futur avec Internet Explorer Développeur: Trouvez de l’aide #mstechdays Web
- 5. LES NOUVEAUTÉS D’HTML5ET CSS3 DANS IE11 Les nouveautés d’HTML5 et IE11 en action #mstechdays Web
- 6. I hav standards •Nouveau User Agent Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko • Document mode HTML5 par défaut <!doctype html> • pointerEvents, flexbox non préfixés #mstechdays Web
- 7. APIS HTML 5,CSS 3 ET JS Custom Data Attributes Device Pixel Ratio Encrypted Media Extensions Pagehide/Pageshow events MPEG-Dash NoFollow CSS3 Flexbox Canvas 2D Niveau 2 Internationalization ECMAScript 6 Lazy-loading #mstechdays Device Orientation events DOM4 Mutation Observers Fullscreen API Pointer Events TTML Simple Delivery Profile Navigation Timing CSS3 Border-Image HTTP 2.0 / SPDY Device Motion Events Dynamic TextTracks Input Method Editor API Media Source Extension Performance API Web Cryptographic API WebGL ECMAScript CSS3 Scrolling Snap Points YUV Compression Prefetch and Prerender DDS images Web
- 8. EXPERIENCE UTILISATEUR Les nouveautésd’HTML5 et IE11 en action #mstechdays Web
- 9. EXPERIENCE UTILISATEUR Les nouveautésd’HTML5 et IE11 en action #mstechdays Web
- 10. Gestion des favoris •Gestion de dossiers • Synchronisation entre tous les appareils • Tuiles avec image dominante en mode immersif #mstechdays Web
- 11. Mode lecture Mise enforme d’une page en mode lecture pour plus de confort: - Pas de pub, bannière, menu, fond inutile - Juste le contenu: texte, titres, images et vidéo #mstechdays Web
- 12. Partage • Mise enforme automatique • Listes de lectures #mstechdays Web
- 13. Parmi les autresnouveautés… • • • • • Onglets illimités Gestion du Hover en tactile Click to call Navigation pagination Swipe CSS3 Scrolling Snap Points: -ms-scroll-snap-points-x: snapInterval(0px,100%); -ms-scroll-snap-type: mandatory; #mstechdays Web
- 14. Tuiles dynamiques pourle web Possibilité de définir: - Tailles disponibles - Couleur - Image - Texte - Notifications http://www.buildmypinnedsite.com #mstechdays Web
- 15. UN MONDE DEDIVERTISSEMENT Les nouveautés d’HTML5 et IE11 en action #mstechdays Web
- 16. WebGL WebGl enfin supporté Desperformances de premier ordre. Three.js et BabylonJS pour le dev #mstechdays Web
- 17. Vidéo • • • • • • • Perfs améliorées (MediaSource Extensions) Streaming XHR (msCaching attr) FullScreen API Sous-titres TTML et WebVTT: <track> Encrypted Media Extensions (support DRM) Web Cryptograhic API Partenariat US avec netflix #mstechdays Web
- 18.
- 19. Device-Orientation Events screen.msLockOrientation("landscape-primary"); window.addEventListener("deviceorientation", onDeviceOriented); function onDeviceOriented(evt){ var z = evt.alpha; var x = evt.beta; var y = evt.gamma; } #mstechdays Web
- 20. Device-Motion Events window.addEventListener("devicemotion", onDeviceMotion); functiononDeviceMotion(evt) { var accl = evt.acceleration; var x = accl.x; var rot = evt.rotationRate; var rz = rot.alpha; } #mstechdays Web
- 21. DIVERTISSEMENT Les nouveautés d’HTML5et IE11 en action #mstechdays Web
- 22. PERFORMANCES Les nouveautés d’HTML5et IE11 en action #mstechdays Web
- 23. Trident et Chakra Trident:rendering Chakra: Javascript #mstechdays Web
- 24. Une meilleure gestiondes chargements • • • • • Ordonnancement des chargements automatique Lazyloading Prefetch et Dns-Prefetch Prerender History Cache #mstechdays Web
- 25. Les nouveaux outilsdu développeur • • • • • Nouveautés Dom explorer et debugger JS UI responsiveness tool JS & Memory Profiler Network profiler Emulation Démo #mstechdays Web
- 26. LE FUTUR AVECINTERNET EXPLORER #mstechdays Web
- 27. Support d’EcmaScript 6 •Support du language ES6: let, const, set map, weakmap, Class, Super, Extends, static, constructor • ES6 Globalization • Iterators et Generators #mstechdays Web
- 28. One Microsoft, OneIE • Windows • Windows Phone • XBox #mstechdays Web
- 29.
- 30. Ou trouver del’aide? #IEUserAgents @IEDevChat #AskIE #mstechdays Web
- 31. Donnez votre avis! Depuis votre smartphone sur : http://notes.mstechdays.fr De nombreux lots à gagner toute les heures !!! Claviers, souris et jeux Microsoft… Merci de nous aider à améliorer les Techdays ! #mstechdays Web
- 32.
- 33.