Flash vs-html5-adrien-leygues-pw-2011

18
Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues Agenda FLASH ou HTML5 Quelles technos choisir et pour quel prix ?

description

Support de conférence pour les ateliers Paris-Web 2011 sur les coûts de production liés à l'utilisation des tehcnos HTML5

Transcript of Flash vs-html5-adrien-leygues-pw-2011

Page 1: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

AgendaFLASH ou HTML5

Quelles technos choisir et pour quel prix ?

Page 2: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 : Les technos

Ce n’est pas :

CSSJAVASCRIPTSVGPNG

http://www.w3.org/TR/html5/

Page 3: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 : Les technos

C’est :

Un ensemble de balises Des API

http://www.w3.org/TR/html5/

Page 4: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 : Un buzzword pour les réunir tous

ClientsDécideursMarketingCréatifsDéveloppeursErgonomes …

HTML + CSS+ JAVASCRIPT+ AJAX+ SVG

HTML5Applications

richesCreative commons - LeJoe

Page 5: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 == FLASH ? NON.

NISSAN JUKE : goo.gl/JKiCi

Page 6: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 == FLASH ? NON.

NUMANTHIA : http://goo.gl/HeOYx

Page 7: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

DEMONSTRATIONS

Page 8: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 et ses limites

Pas toujours possible de faire à l’identique

Nécessite des adaptations graphiques

De 2 à 3 fois plus cher qu’un équivalent Flash

Les outils Flash sont maîtrisés et fiables

Page 9: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 et ses limites : Cross-Compatibilité

Fallback : Ici du Flash pour afficher de la vidéo sur IE 6/7/8 > 2 développements

Page 10: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 et ses limites : Performances

VISIONS OF BEAUTIES :http://goo.gl/dV5K0

IE6/IE7/IE8 :40% de dév. en plusImpossibilités de dév.Moteur JS à genouxImplémentation CSS trop faible

iPad : Moteur JS à genoux mais accélération 3D via CSS

Page 11: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 et ses limites : Solutions

Google Chrome FrameIE Frame ?

Page 12: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 et ses limites : IE6 (et IE7 voire IE8)

LA CHINE :

Un problème pour les sites internationaux

34% d’utilisateurs dans un pays de 1 350 millions d’internautes !

http://www.ie6countdown.com/

Page 13: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 : Des outils d’animation

Enfin des IDE HTML/CSS/JS pour animer du contenu : - 12 ans de retard sur Flash- Optimisé iTruc (Bouh!)- Un nouvel horizon

Page 14: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

HTML5 : Les avantages

Interopérabilité

Cross-Device : Mobile, Browser Web Tv, Browser Console

Javascript un langage puissant : NodeJS, jQuery, Javascript MVC, Unity3D, AVES-Engine, Backbone …

SEO / Accessibilité / ARIA

SANS PLUG-IN !

Page 15: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

Conclusion

Réfléchir en amont des projets avec les différents profils pour définir les technos utilisées en fonction des contraintes d’accessibilité, de référencement, de coûts et de cible

Définir les apports de chaque technologie et ne pas être catégorique, HTML5 et Flash sont complémentaires

Page 16: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

Des questions ?

Page 17: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

Agenda

MERCI !

Page 18: Flash vs-html5-adrien-leygues-pw-2011

Flash ou HTML5 : Quelles technos choisir pour quel prix ? Paris Web 2011 | Adrien Leygues

Adrien Leygueshttp://www.bootleygues.net/http://twitter.com/[email protected]

Icônes : http://www.wefunction.com/