Pendant les trois jours au Web 11, on peut voir des conférences, rencontrer du monde mais aussi assister à des ateliers. Un certain nombre d’ateliers sont animés par Orange, Google, Evernote, Linkedin ou Intel.
Pendant les trois jours au Web 11, on peut voir des conférences, rencontrer du monde mais aussi assister à des ateliers. Un certain nombre d’ateliers sont animés par Orange, Google, Evernote, Linkedin ou Intel.
![[LeWeb11] Créer une application en HTML 5 html5 intel leweb11 [LeWeb11] Créer une application en HTML 5](http://www.presse-citron.net/wordpress_prod/wp-content/uploads/html5-intel-leweb11.jpg)
J’ai eu l’occasion d’assister à un atelier d’Intel sur l’HTML 5. Cet atelier prodiguait des bonnes pratiques et conseillait des bons outils et frameworks pour créer des applications en HTML 5. Le code de votre application doit être agile, maintenable et rapide. Il faut la tester le plus possible pour éventuellement repérer et corriger les bugs.
Des compilers existent pour simplifier l’écriture du code :
Les fonctions Stylus permettent d’apporter de la clarté dans le code CSS, on peut par exemple imaginer une fonction pour créer un dégradé en CSS 3 (qui ajoute les préfixes -moz, -webkit nécessaires pour une compatibilité sur la plupart des navigateurs récents).
HTML 5 Boilerplate fait partie des outils les plus populaires pour initialiser son application HTML 5.
Des frameworks CSS existent pour faciliter et normaliser la mise en page : 960 Grid System, Blueprint et Bootstrap (par Twitter).
Afin d’optimiser le chargement de son application, il peut être intéressant de minifier et compresser les fichiers CSS et JavaScript (cela supprime toutes les parties inutiles du code dont les espaces et les commentaires).
La librairie Modernizr permet de détecter si certaines fonctionnalités HTML 5 et CSS 3 sont supportées par le navigateur. Bien pratique pour assurer la rétrocompatibilité avec les anciens navigateurs.
Firebug, Page Speed et YSlow sont également très utiles pour débugger.
L’atelier était assez technique mais passionnant et enrichissant. Si vous avez des outils, bonnes pratiques ou conseils, n’hésitez pas à en parler dans les commentaires.
Derniers articles parCamille (voir tous)
- Vélib’ libère ses données… à moitié - 4 mai 2013
- Test du HTC One - 2 mai 2013
- Tech City : la Silicon Valley londonienne ? - 22 avril 2013
- LinkedIn fête ses 5 millions d’utilisateurs en France (+ comptes Premium à gagner) - 10 avril 2013
- Test du LG Optimus G - 9 avril 2013


















16 commentaires pour "[LeWeb'11] Créer une application en HTML 5"
1
Nico Prat le 9 décembre 2011 à 12:17
Bon article !
Pour les devs sur Mac, je vous conseille de jeter un oeil à http://incident57.com/codekit/ pour gagner beaucoup, beaucoup de temps
A noter aussi une version mobile du HTML5 boilerplate : http://html5boilerplate.com/mobile
Sinon, si vous avez des invit’ pour LeWeb 2012 je suis preneur
(à moins que je gagne au loto d’ici là…) !
2
Sébastien | WordpressDesigner le 9 décembre 2011 à 12:46
C’est intéressant.
Pour ma part, j’aimerais bien qu’on fasse un petit point sur les fonctionnalités propres au smartphone tactile et leur utilisation (possible ?) sur les sites internet (et non les applis)
Ce serait possible ?
par-exemple, est-il possible, sur un site mobile, de déplacer un élément avec le doigt ? Si oui comment ?
Si quelqu’un a de bonnes sorces d’infos ça m’interesse !
3
Rencontrer une africaine le 9 décembre 2011 à 13:31
Merci pour cet article, ça donne envie de s’y pencher encore plus !
Dommage que je ne suis pas à LeWeb cette année…:(
4
Nico Prat le 9 décembre 2011 à 13:59
Le web tactile vient en effet avec de nouveaux évènement, comme touchstart, touchmove, touchend (si je ne m’abuse).
HTML5 fournit aussi un nouvel attribut aux balises HTML : draggable= »true » — ainsi que de nouveaux évènements tels que ondragstart et ondragend. Jamais testé pour l’instant.
Sinon j’ai justement bossé ce matin avec ce plugin jQuery pour créer une galerie photo, si bien gérée qu’on dirait du natif : http://www.photoswipe.com/
5
Sébastien | WordpressDesigner le 9 décembre 2011 à 14:13
Merci Nico Prat pour ces infos. Je vais faire quelques recherches là dessus.
Si quelqu’un d’autre a des infos, ou un lien vers une bonne doc, je prends
6
Recette de Sushi le 9 décembre 2011 à 14:42
Il existe déjà des applications qui ont été développé en html5 ?
7
Creation site web Paris le 10 décembre 2011 à 12:27
Merci pour l’article! Le flash est-il définitivement mort?
8
Création site internet le 10 décembre 2011 à 15:27
En terme de grid css, il y a aussi les grids qui intègrent directement un système de responsive design : http://getskeleton.com/ , http://www.columnal.com/ , http://cssgrid.net/
9
T0R1N0T3 le 10 décembre 2011 à 19:45
Oui, il existe de nombreuses applications en HTML5, la plus connu étant :
Quake II
=> Une vidéo de démo
=> Page présentant le projet
10
john le 10 décembre 2011 à 21:49
En gros c’est une présentation dans laquelle on vous a déballé ce que tous les développeurs web/HTML5 savent déjà depuis plus d’un an.
11
Antoine@PC sur mesure le 11 décembre 2011 à 22:09
Vivement une compatibilité sur tous les navigateurs « récents » ! Le HTML5 c’est vraiment pas mal ! Et Forebug c’est la référence en effet
12
Marmits.com le 13 janvier 2012 à 22:02
De la fantaisie, du rétro, du moderne, du kitch, de la curiosité.
C’est plutôt cool …
un site en html5:
http://ala.ch/