Les nouveautés d’HTML5 et IE11 en action

67 %
33 %
Information about Les nouveautés d’HTML5 et IE11 en action
Technology

Published on February 17, 2014

Author: Developpeurs

Source: slideshare.net

Description

Au menu de cette session, présentation et surtout des démos (!!) des nouveautés d'HTML5, CSS3 et Javascript avec Internet Explorer 11! Venez également découvrir toutes les nouveautés pour le jeu et le divertissement en ligne avec les interactions rendues possibles par le support des API Device-Motion et Device-orientation, WebGL, l'API Fullscreen, le nouveau tag vidéo et les snap-points CSS3. Nous traiterons également des dernière techniques d’amélioration des performances de votre site grâce aux nouvelles API mais aussi aux nouveau outils du développeur sur IE. Enfin, nous verrons ce qu’il est possible de faire en terme d’intégration au système avec Windows 8.1 avec les nouveau mode Lecture, les nouvelles gestures de navigation et les Live Tiles.

Speakers : Philippe Didiergeorges (Euro Information Développement)

Les nouveautés d’HTML5 & IE11 en action Philippe DIDIERGEORGES Développeur chez EID IE UserAgent http://blogs.developpeur.org/Philess @DePhiless Web

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

Sommaire • • • • • • Les nouveautés d’HTML5 et 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

LES NOUVEAUTÉS D’HTML5 ET CSS3 DANS IE11 Les nouveautés d’HTML5 et IE11 en action #mstechdays Web

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

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

EXPERIENCE UTILISATEUR Les nouveautés d’HTML5 et IE11 en action #mstechdays Web

EXPERIENCE UTILISATEUR Les nouveautés d’HTML5 et IE11 en action #mstechdays Web

Gestion des favoris • Gestion de dossiers • Synchronisation entre tous les appareils • Tuiles avec image dominante en mode immersif #mstechdays Web

Mode lecture Mise en forme 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

Partage • Mise en forme automatique • Listes de lectures #mstechdays Web

Parmi les autres nouveauté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

Tuiles dynamiques pour le web Possibilité de définir: - Tailles disponibles - Couleur - Image - Texte - Notifications http://www.buildmypinnedsite.com #mstechdays Web

UN MONDE DE DIVERTISSEMENT Les nouveautés d’HTML5 et IE11 en action #mstechdays Web

WebGL WebGl enfin supporté Des performances de premier ordre. Three.js et BabylonJS pour le dev #mstechdays Web

Vidéo • • • • • • • Perfs améliorées (Media Source 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

Device-Orientation Events #mstechdays Web

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

Device-Motion Events window.addEventListener("devicemotion", onDeviceMotion); function onDeviceMotion(evt) { var accl = evt.acceleration; var x = accl.x; var rot = evt.rotationRate; var rz = rot.alpha; } #mstechdays Web

DIVERTISSEMENT Les nouveautés d’HTML5 et IE11 en action #mstechdays Web

PERFORMANCES Les nouveautés d’HTML5 et IE11 en action #mstechdays Web

Trident et Chakra Trident: rendering Chakra: Javascript #mstechdays Web

Une meilleure gestion des chargements • • • • • Ordonnancement des chargements automatique Lazyloading Prefetch et Dns-Prefetch Prerender History Cache #mstechdays Web

Les nouveaux outils du développeur • • • • • Nouveautés Dom explorer et debugger JS UI responsiveness tool JS & Memory Profiler Network profiler Emulation Démo #mstechdays Web

LE FUTUR AVEC INTERNET EXPLORER #mstechdays Web

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

One Microsoft, One IE • Windows • Windows Phone • XBox #mstechdays Web

DEVELOPPEURS, TROUVEZ DE L’AIDE #mstechdays Web

Ou trouver de l’aide? #IEUserAgents @IEDevChat #AskIE #mstechdays Web

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

Questions Philippe DIDIERGEORGES http://blogs.developpeur.org/Philess @DePhiless Web

Digital is business

#mstechdays presentations

Add a comment

Related presentations

Related pages

Les nouveautés d'HTML5 et IE11 en action- Video et slides ...

Au menu de cette session, présentation et surtout des démos (!!) des nouveautés d'HTML5, CSS3 et Javascript avec Internet Explorer 11! Venez également ...
Read more

Les nouveautés d'HTML5 et IE11 en action - YouTube

Au menu de cette session, présentation et surtout des démos (!!) des nouveautés d'HTML5, CSS3 et Javascript avec Internet Explorer 11! Venez ...
Read more

Les nouveautés d’HTML5 et IE11 en action - Technology

Home; Technology; Les nouveautés d’HTML5 et IE11 en action; Download. of 33 ×
Read more

Orientation change ie11 videos | YTmp3Download.com

Les nouveautés d'HTML5 et IE11 en action. Video duration : 46:58; ... Delete IE11 Cache on Exit. Video duration : 03:17; Video uploaded by : Tim Rolston;
Read more

Techdays 2014: toutes les vidéos des 2 parcours Web ...

– Mardi 11 février 16h30: Les nouveautés d’HTML5 et IE11 en action animée par Philippe Didiergeorges. Ce sera l’occasion de constater que nous ...
Read more

Is Microsoft (IE11) Cheating on HTML5 Benchmarks? - YouTube

Do you think Microsoft's IE 11 is using unfair tactics to make their browser stand ... Les nouveautés d'HTML5 et IE11 en action ...
Read more

Conférences Microsoft TechDays 2014 - Alsacreations

Les nouveautés d'HTML5 et IE11 en action. Par Philippe Didiergeorges; Compatibilité Internet Explorer : pour le meilleur et pour le pire!
Read more

Ie11 html5 drag and drop videos | Vidbazar.com

Les nouveautés d'HTML5 et IE11 en action. Video duration : 46:58; Video uploaded by : Microsoft Développeurs France; Video release date : Feb 24th, 2014;
Read more