Comment HTML 5 va changer la donne

Arnaud de la Grandière |
Une lente évolution

Depuis l'avènement du Web, il n'y a eu que peu de changements radicaux. Nous sommes partis de simples pages HTML codées en "dur", puis nous avons eu les contenus dynamiques grâce au cumul de PHP et MySQL, et plus d'interactivité avec Javascript. Le mélange des trois technologies a abouti à Ajax, pour des pages plus réactives encore. Les feuilles de style permettent de faire évoluer le design d'un site plus simplement, et les flux RSS nous gardent informés des nouveaux contenus.

Au regard des ans, le Web avance à un train de sénateur, comparé aux autres branches de l'informatique. L'organisme qui régule les standards du web, le consortium W3C, s'est d'ailleurs vu remis en question précisément pour son inertie, poussant les développeurs de navigateurs à s'allier pour créer le WHATWG, dont les travaux ont d'ailleurs servi de base de travail pour HTML 5, en chantier depuis maintenant plus de cinq ans. Il faut dire qu'il n'est pas aisé d'effectuer une transition technologique dans le domaine des standards du web : la multitude de machines susceptibles de consulter une page web, mais également les capacités des systèmes d'exploitation ou encore la mise à jour des divers navigateurs n'y aident certainement pas.

Des contraintes gênantes

Et il faut bien dire que ça s'en ressent : aujourd'hui encore les sites internet les plus avancés sont toujours faits de bric et de broc… de faux éléments d'interface bâtis à l'aide de tableaux qui sont susceptibles à la fois d'être interactifs et d'être sélectionnés comme le serait du texte. Les sites qui permettent de faire du traitement de données ne collaborent pas entre eux, un simple copier-coller de texte enrichi peut virer au casse-tête. Des problématiques qui semblent dater de la préhistoire de l'informatique, mais qui font pourtant encore notre quotidien.

À chaque instant, les concepteurs doivent faire preuve d'ingéniosité pour se libérer des contraintes hiératiques du format HTML. Certes, il a vite été possible d'ajouter des contenus différents aux pages web à l'aide des plug-ins, mais ceux-ci ont apporté leur lot de problématiques : formats propriétaires, téléchargement et installation parfois compliqués, incompatibilité avec certaines configurations, etc. Moralité, toutes ces embuches ajoutent une nouvelle fracture numérique : pour ne pas être un internaute de seconde zone, il faut maîtriser nombre de techniques qui devraient pourtant nous être inconnues, ne serait-ce que pour ajouter une simple image sur une réaction dans un forum. Bref, autant de contradictions avec la vocation universaliste du Web. Alors qu'on parle de plus en plus d'applications web, celles-ci souffrent mal la comparaison avec de véritables applications offline, incommensurablement plus souples et d'accès plus aisé.

Une évolution plus qu'une révolution

Le HTML 5 a pour vocation de répondre à un certain nombre de ces problématiques, tout en maintenant une compatibilité ascendante avec les précédents standards. Concernant la mise en page en elle-même, le nouveau standard permet de simplifier les choses avec de nouvelles balises de type <header>, <article>,<aside>,<footer>,<nav>, etc, qui officialisent la structure de nombre de sites web, en lieu et place des multiples balises <div> qui servaient jusqu'ici à délimiter les zones de contenus. De même, une nouvelle technologie nommée Canvas se charge d'afficher des images composées dynamiquement, ce qui permettra la création d'interfaces d'utilisation plus puissantes et mieux intégrées, ainsi que des applications plus dynamiques (voir démo ci-dessous).


Cliquez sur l'image


D'autres technologies comme la sauvegarde locale des données permettra d'assurer la confidentialité de vos données (sans nécessité de les envoyer sur le serveur pour les traiter), comme d'éviter de perdre votre travail en cas d'interruption de la connection. On peut en voir un exemple ici, poussant un peu plus les applications web vers leurs équivalents hors-ligne (voir aussi l'article Google Calendar active son mode hors ligne). De même, le stockage de données sur la durée d'une session d'utilisation permettra de faire passer des données d'une page à l'autre.

Toujours dans la même optique, les Web Workers, quant à eux, permettent de lancer des opérations en tâche de fond, ce qui rendra les pages web encore un peu plus réactives. Le glisser-déposer devient enfin officiellement supporté en lieu et place des astuces utilisées jusqu'ici. De nouveaux "widgets" sont disponibles, permettant de contrôler dynamiquement le contenu d'une page web. Enfin, la vidéo et l'audio font leur entrée officielle sur le Web : jusqu'alors dévolus aux plug-ins comme QuickTime, Windows Media Player, Real Player, ou encore Flash, ils seront désormais intégrés aux pages HTML de la même manière que les images, et il est également possible de les piloter par JavaScript à l'aide de controleurs personnalisés.

Vers la fin des plugins?

Au regard de ces nouveautés, les plug-ins utilisés jusqu'ici pour les applications en ligne, tels que Flash, Silverlight ou encore JavaFX, pourraient voir leur hégémonie remise en question : pourquoi s'encombrer de plug-ins quand le navigateur pourrait gérer tout ça nativement, sur toutes les plate-formes? D'autant que l'avenir d'un format propriétaire ne dépend justement… que de son propriétaire. Rien ne les empêchera demain de vous faire payer pour utiliser leurs technologies, ou encore d'y mettre fin si ça leur chante. L'intérêt d'un standard ouvert, c'est qu'il n'appartient à personne. Ce constat posé, quelles sont les chances de voir les plug-ins perdre du terrain?

Le problème du HTML 5, c'est qu'il lui faudra encore 5 à 10 ans pour être terminé. Il reste de nombreuses batailles à livrer, ne serait-ce que sur l'officialisation d'un codec pour la vidéo et l'audio, qui risque de freiner encore longtemps ces avancées. Cependant les navigateurs récents ont commencé à implémenter les spécifications qui ont d'ores et déjà été rédigées. Mais encore faut-il que non seulement chaque navigateur en fasse autant, mais en plus que les utilisateurs finaux se mettent à jour pour en profiter. Ce qui représente une base d'utilisateurs potentiels somme toute encore limitée. Ce qui entraîne un cercle vicieux : sans utilisateurs, les sites n'utiliseront pas cette technologie, et sans contenus, les utilisateurs n'ont pas d'incitation à se mettre à jour, voire à changer de navigateur. Microsoft l'a bien compris, et on n'a pas fini de déplorer sa vieille habitude à détourner les standards pour les proposer à sa propre sauce, forte de la majorité encore écrasante d'Internet Explorer.

Un autre aspect de cette problématique se ressent face à Flash : pourquoi proposer un contenu qui ne sera accessible qu'à une portion limitée de visiteurs, quand le plug-in d'Adobe permet d'afficher du contenu sur 99% des machines connectées à Internet ?. Adobe elle-même avait fait face à cette problématique avant sa fusion avec Macromedia : elle avait promu le standard ouvert SVG pour contrer Flash, avec le peu de résultat que l'on sait. Adobe a fini par se résoudre au dicton américain : if you can't beat them, join them (si vous ne pouvez les vaincre, joignez-vous à eux).

Si les navigateurs modernes permettent d'ores et déjà d'exploiter certaines de ces fonctions avec plus ou moins de bonheur, les sites ne feront la bascule qu'une fois qu'une majorité significative de visiteurs sera à même de les utiliser. Et c'est là où on en revient à la problématique de départ, à savoir l'inertie de la propagation des nouveaux standards du web. Cependant la donne a quelque peu changé avec une concurrence plus accrue face à Internet Explorer, et des internautes plus ouverts à la nouveauté. Ils mettent à jour leurs navigateurs plus volontiers, maintenant qu'ils sont plus sensibilisés aux bénéfices qu'ils peuvent en tirer. Espérons que ces mentalités moins conservatrices permettront un déploiement plus rapide du HTML 5, au plus grand bénéfice de tous.
Tags
avatar afievet | 
Un implémentation utile serait la possibilité d'écrire avec un angle, sans passer par des graphiques ou flash. Un tableau tout simple dont le nom des colonnes prendrait moins de place. Même Excel sait le faire.... :-)
avatar thil | 
Les "fonctions hiératiques du HTML"... Elles sont donc sacrées ? :-)
avatar WebOliver | 
Article très intéressant, merci. Au passage, connexion s'écrit avec un x en français...
avatar françois bayrou | 
En attendant on a enfin la vidéo. Et nous sommes en 2009... Dans 15 ans ca sera peut être possible :)
avatar studdywax | 
moi qui suis un néophyte total en Web (coté développement), rien que les deux premières phrases et j'ai déja compris plein de chose flou dans ma tête...
avatar rez6581 | 
Avec Canvas on peut des trucs bien sympathiques, je vous montre quelques trucs que j'ai fait: [url]http://www.chiptune.com/landscape.html[/url] [url]http://www.chiptune.com/starfield/starfield.html[/url] [url]http://www.chiptune.com/kaleidoscope/[/url] Ces trois exemples sont uniquement fait en javascript+canvas. Sinon avec javascript sans canvas on peut faire des trucs marrant, mon petit site perso 100% en javascript: [url]http://www.chiptune.com[/url], un genre de WebOS "retro" en javascript (le Workbench 1.3 de l'Amiga pour les connaisseurs). Merci à Apple de nous faire des browsers qui permettent de faire tourner ce genre de chose sans plugins moches :)
avatar etudiant69 | 
Google Wave pourrait être cette locomotive dont le HTML5 pourrait avoir besoin. Ce projet est réellement enthousiasmant. A titre d'exemple, alors que je regardais depuis même pas 10min la vidéo de présentation de Google (qui dure une heure et demie), ma femme m'a demandé comment faire pour l'avoir, où il faut s'inscrire alors qu'elle est loin (très loin) d'être une "early adopter". Ce type de service innovant pourrait rendre rapidement l'HTML5 indispensable. Le support du streaming HTTP par SnowLeopard semble aussi aller dans la même direction...
avatar gloup gloup | 
On peut déjà voir ce qu'il est possible de faire sur [url=http://hacks.mozilla.org/]le site "hacks" de mozilla[/url].
avatar oomu | 
très bon article. - je ne suis pas très pessimiste. Dailymotion et Youtube ont fait très vite des démonstrations techniques. Google _veut_ ces nouveautés et est allé jusqu'à faire google gears et chromium pour forcer les choses Les fondements (mpeg4 etc) sont désirés un peu partout. Khronos s'est réveillé pour travailler à intégrer opengl dans javascript, et google propose sa propre idée Apple s'est impliqué dedans et a besoin des évolutions du web pour ses propres services et on sent bien que tous les créatifs web travaillent sur tout ça d'une manière ou d'une autre. - 5 ans me parait raisonnable. - 10 ans, c'est le planning pour obtenir une norme parfaitement décrite, documentée, avec ses outils de vérification. C'est un travail ambitieux, qui dépasse même ce qui fut fait pour Html 4. Disons que les gens sont bien plus ambitieux avec le w3c qu'auparavant. Mais au rythme actuel, html 5 sera mis dans les mains des gens bien avant que le travail sur html 5 soit considéré fini. et on aura certainement les bases de nouvelles versions de javascript et html avant cela. - Le travail en cours fait plaisir à voir en tout cas. Le web est devenu franchement passionnant. - @afievet ce travail est en cours, il s'agit de CSS Transform, dans le cadre de CSS 3 http://www.w3.org/Style/CSS/current-work#transform2d
avatar françois bayrou | 
@rez6581 Excellent chiptunes ! Je le connaissais, j'aime beaucoup, encore bravo :)
avatar oomu | 
http://developer.apple.com/documentation/appleapplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html voici où en est webkit officiellement sur CSS. les propriétés préfixés -webkit- sont non encore normalisés dans le brouillon CSS 3 mais proposées.
avatar gloup gloup | 
[quote="Redac"]Un autre aspect de cette problématique se ressent face à Flash : pourquoi proposer un contenu qui ne sera accessible qu'à une portion limitée de visiteurs, quand le plug-in d'Adobe permet d'afficher du contenu sur 99% des machines connectées à Internet ?[/quote] HTML, css et javascript sont bien plus universel que le flash. Amha flash va perdre des plumes à moyen terme pour peut-être finir par disparaître. Le problème, pour l'instant, c'est IE qui est en retard, mais il a fait d'énormes progrès dans sa version 8. On peut supposer qu'il offrira dans sa version 9 ou 8.5 plus de support de css3 ou des nouveaux éléments de html5.
avatar oomu | 
"Google Wave pourrait être cette locomotive dont le HTML5 pourrait avoir besoin." oui. j'en suis convaincu. Surtout, il faut bien le savoir : Wave est opensource : protocole, serveur de référence et client de référence. Ce n'est PAS un projet google-centrique. Google proposera sa super interface "google wave", mais d'autres pourront créer leur wave. le client web "google wave" utilise beaucoup de html 5 et même un ajout non encore ajouté (mais proposé) dans html5, que google gears met en oeuvre. - "Le support du streaming HTTP par SnowLeopard semble aussi aller dans la même direction..." idem, j'ai trouvé cette annonce très pertinente.
avatar Un Vrai Type | 
Mode troll ON HTML 5 ou XHTML 2.0 ? :D
avatar Matcor | 
Perso, avant même de considérer de nouveau format web avec plein de possibilités dynamiques, je serai déjà content si les concepteurs de sites web se mettaient à produire visuellement des sites adaptés aux ordinateurs modernes.. La plupart des écrans d'ordi sont larges maintenant, sans parler de la résolution qui augmente... Or presque tous les sites internet présentent encore une mise en page 4:3... Je trouve ça assez ringard au final.. A l'heure des TV HD 16:9 et des écrans d'ordi 16:10 dans de nombreux foyers, aller sur internet en ce moment, c'est comme regarder un film 4:3 sur un écran 16:9... dans le fond, le film peut être génial mais il a quand même un air un peu veillot... A quand des sites dont le format s'adapte à la fenêtre et l'écran et non 4:3 par défaut ? Après, on pourra me parler de nouveautés web...
avatar oomu | 
pour les concepteurs de sites : http://hacks.mozilla.org/2009/06/3d-transforms-isocube/ un exemple du travail sur CSS Transform 3D. cette fois avec Firefox 3.5 (c'est donc des propriétés css préfixées -moz- parce que css 3 n'est pas encore finalisé) - Chic! enfin un vrai sujet à bataille ! Encore plus fort que le "Os X + gimp VS linux + gimp !" à Chatelet :) XHTML 2 était une vision idéologique, un monde xml pure, lavée de la corruption de la Forme dans le Fond (suppression du tag img par exemple pour un concept générique de lien vers document multiforme) mais l'erreur de xhtml 2, c'est qu'elle ne répond pas aux attentes des créatifs : "Faire de ZOLI caractéres SANS utiliser FLASH !!! raAAaAH" par exemple ni aux attentes des ingénieurs : "faire un site qui gère des documents sur le serveur sans GELER l'interface de mon utilisateur, rAAAAH !!!" bref, HTML 5 est arrivé, tel un sauver, un peu plus sale, un peu plus sauvage, mais il répond à la Vraie demande des créateurs de site : Améliorer le web, pas la seule sémantique ! Html 5 aura sa déclinaison xml propre. html 5 ne jette pas aux orties les réflexions sémantiques, mais c'est un projet pragmatique, initié par des gens confrontés à la réalité (ie 6 tout pourri, Flash , youtuberies) qui ont visé ce qui était le plus urgent. bref Html 5 ! et je suis prêt à jeter des chopes de bières.
avatar oomu | 
" A quand des sites dont le format s'adapte à la fenêtre et l'écran et non 4:3 par défaut ? Après, on pourra me parler de nouveautés web..." y a toutes les technos qu'il faut pour cela. mais principalement, le web est avant tout de la lecture. le confort de lecture passe par des lignes courtes en largeur. Mais il y a juste l'imagination du créateur qui le bride. - un autre point, il y a beaucoup moins d'écrans "large" en activité qu"on ne le croit et beaucoup (beaucoup) plus de moniteurs 1024x768 en activité.
avatar etlomb77 | 
@rez6581: Fais un clic droit, une fois que tu es sur [url]http://www.chiptune.com/[/url], tu vas voir !
avatar Un Vrai Type | 
@ oomu : Si tu suis le débat xhtml 2.0 contre html 5.0, tu sais qu'il s'agit aussi d'erreurs assez importantes (des balises qui changent de fonction par exemple, la balise font... heu sans commentaire :) ) sur le fond. Apporter de nouveau piège (comme le français simplifié) n'a jamais été porteur de bonne nouvelle... Les sites qui devront être bidouillé, les sections qui dépendent du contexte etc... seront autant d'obstacles au net accessible et interopérable. C'est compliqué de s'inspirer pour les sections par exemple de tex ? Enfin, y'a ceux qui font els choix et ceux qui se démerderont "pour que ça marche", mais en aucun cas HTML 5 est synonyme de la mort des bidouilles... :)
avatar bluheim | 
@etlomb77 : Yep, plus encore que HTML5, qui est quand même foutrement intéressant, je crois aussi que ce sont les évolutions apportés aux moteur javascript qui vont changer le web. Aujourd'hui, on peut faire un nombre de trucs tout bonnement ahurissant en JS, comme le montre le site que tu...cites. Mais jusque là, les moteurs JS des navigateurs étaient trop lents. On verra si la nouvelle génération permet enfin de profiter pleinement de JavaScript et ses frameworks célèbres tel jQuery.
avatar oomu | 
@un vrai type je suis d'accord, html5 ne signifie pas la mort des bidouilles. html 5 ne changera pas que l'ordre des (ou sections) dans le fichier html a un impact sur leurs positions dans le rendu css. etc. mais html5 est un choix pragmatique pour enrichir le web en fonctionnalités. mais c'est pas encore le graal
avatar oomu | 
essayez cette démonstration javascript avec safari 4 et firefox 3 , vous allez voir l'impact des progrès de javascript http://nerget.com/fluidSim/ et ce n'est qu'un début
avatar Anonyme (non vérifié) | 
oomu > on voit aussi que Safari affiche deux fois plus d'images par seconde, et qu'on a l'élément de formulaire input type=range alors que Firefox 3.5 ne le propose pas.
avatar thierry93 | 
Tres bon article ainsi que les réactions des lecteurs. ce qui est assez rare pour le souligner (pas la qualité des articles que trouve le plus souvent excellent) mais l'ensemble des réactions est également excellent. Est il possible que je reprenne cet article pour l'entreprise où je travaille?
avatar Kounkountchek | 
@oomu [i]essayez cette démonstration javascript avec safari 4 et firefox 3 , vous allez voir l'impact des progrès de javascript http://nerget.com/fluidSim/ et ce n'est qu'un début[/i] Eh ben, ça promet, mon MacBook fait tourner le ventilo à fond. Comme avec Flash tiens. Oui mais là ça n'utilise pas de plugin propriétaire ! Ah, me voilà rassuré.

Pages

CONNEXION UTILISATEUR