In­tro­duc­tion à HTML5

Con­trai­re­ment à son pré­dé­ces­seur, la cinquième version du langage de balisage hy­per­texte est un produit réalisé par deux groupes de dé­ve­lop­peurs pa­ral­lèles. Alors que W3C a mis le projet HTML en pause après la sortie de la version 4.01 pour se con­cen­trer sur le dé­ve­lop­pe­ment de XHTML, de nom­breuses or­ga­ni­sa­tions ont manifesté leur mé­con­ten­te­ment sur le nouveau cours du comité de nor­ma­li­sa­tion. Ce lent dé­ve­lop­pe­ment du standard du Web fut inad­mis­sible pour beaucoup d’en­tre­prises spé­cia­li­sées dans le dé­ve­lop­pe­ment de logiciels et de moteurs de recherche. En réaction à la réor­ga­ni­sa­tion du W3C, le groupe de travail Web Hypertext Ap­pli­ca­tion Tech­no­logy Working Group ou WHATWG a été créé pour tra­vail­ler sur le dé­ve­lop­pe­ment du standard de HTML et se con­cen­trer sur l’en­ca­dre­ment des ap­pli­ca­tions. Le WHATWG a déjà présenté en 2004 une première pro­po­si­tion de HTML5 : celle-ci a convaincu le W3C qui a, deux ans plus tard, demandé à un nouveau groupe de travail de dé­ve­lop­per le langage HTML5 sur la base de la version de WHATWG.  En 2009, le W3C a annoncé la fin de XHTML. Au lieu de cela, ils se sont con­cen­trés sur la mise au point de la spé­ci­fi­ca­tion de HTML5.

Alors que les sites internet ne servaient, au début de l’ère du Web, qu’à la pré­sen­ta­tion de contenus, l’in­te­rac­tion entre les in­ter­nautes et la Toile est aujourd’hui mise en avant. Les visiteurs sont passés du statut de passif à celui d’actif. Les éditeurs de sites Web répondent à ce phénomène avec des for­mu­laires in­te­rac­tifs, en intégrant des champs de com­men­taires ou des boutons pour les réseaux sociaux. A cela s’ajoutent les jeux en ligne qui reposent di­rec­te­ment sur les na­vi­ga­teurs. Avec HTML 4.01, une telle palette de fonc­tion­na­li­tés n’était alors ac­ces­sible que grâce à des plugins externes. Le nouveau standard du Web HTML5 fait état de ces nouvelles forces. En plus des balises HTML entre crochets, la base de HTML5 comprend des balises spé­ci­fiques (voir ci-dessous), des éléments mul­ti­mé­dia ainsi que de nom­breuses in­ter­faces de pro­gram­ma­tion (Ap­pli­ca­tion Pro­gram­ming In­ter­faces soit APIs ou interface de programme ap­pli­ca­tive) à dis­po­si­tion en com­bi­nai­son avec Ja­vaS­cript. Les plugins pro­prié­taires de four­nis­seurs privés tels que Adobe Flash sont devenus des figures du passé. Les pro­gram­meurs peuvent main­te­nant tra­vail­ler avec HTML5 in­dé­pen­dam­ment des sociétés dé­ve­lop­pant des logiciels et créer ainsi des sites Internet sans barrière. Le tableau suivant présente les in­no­va­tions de HTML5 ainsi qu’une sélection d’éléments clés.

Les nouveaux éléments HTML

Un des points les plus novateurs dans le monde du Web est l’in­tro­duc­tion de nouveaux éléments HTML5 dans les balises sé­man­tiques. Alors que HTML5 ne prévoyait qu’une struc­tu­ra­tion simpliste à travers différent éléments <div>, certaines balises spé­ci­fiques telles que <section>, <nav>, <article>, <aside>, <header>, <footer> voire <main> per­met­tent de définir dans le langage HTML5 quel est le genre de contenu présent dans chaque élément. 

La balise sé­man­tique d’une section de page Web présente un grand avantage : elle facilite le travail des moteurs de recherche sur un document HTML5. Ceux-ci pri­vi­lé­gient les contenus dont la structure est claire et concise. Par con­sé­quent, les éditeurs de sites Internet qui fa­ci­li­tent l’in­ter­pré­ta­tion d’un document HTML en utilisant des balises adaptées ont de grandes chances d’être bien ré­fé­ren­cés par les moteurs de recherche.

L’in­té­gra­tion d’éléments mul­ti­mé­dia

Grâce à HTML, l’in­té­gra­tion de vidéos et de fichiers sonores est aussi facile que d’insérer une image. En plus de cela, les éléments HTML <audio> et <video> rendent l’uti­li­sa­tion de plugins superflue.

In­ter­faces de pro­gram­ma­tion

HTML5 met à la dis­po­si­tion des pro­gram­meurs un bon nombre d’objets JavaScrit intégrés en tant que APIs dans des documents HTML5. Le tableau suivant indique une sélection d’éléments HTML5 qui fa­ci­li­tent le travail des pro­gram­meurs en matière de mo­der­ni­sa­tion de leurs sites internet. 

API	Fonctions
Canvas	Le pro­gram­meur peut, grâce à l’élément <canvas>, définir un champ de document HTML5 afin d’intégrer des rendus dy­na­miques d’images bitmap via Ja­vaS­cript. A côté des lignes, des rec­tangles et des arcs, l’élément prend en charge des courbes de Bézier, des dégradés de couleurs, des il­lus­tra­tions dans le format PBG, GIF et JEPEG ainsi que com­po­sants trans­pa­rents et des textes. Une uti­li­sa­tion classique de <canvas> est l’in­té­gra­tion de dia­grammes. Il est très utile pour la pro­gram­ma­tion de jeux en ligne.
Drag-and-Drop	Le glisser-déposer (Drag-and-Drop) permet le dé­pla­ce­ment d’objets à l’intérieur d’un document HTML5 ou entre deux sites Web.
Offline-Ap­pli­ca­tions	Grâce aux ap­pli­ca­tions offline, les pages HTML5 disposent aussi d’ap­pli­ca­tions Web même sans connexion Internet. Ceci est avant tout utile dans le cadre d’une uti­li­sa­tion Internet sur smart­phone. A cela se rajoute le té­lé­char­ge­ment de tous les contenus né­ces­saires dans l’ap­pli­ca­tion cache.
Géo­lo­ca­tion	Avec l’outil géo­lo­ca­li­sa­tion, HTML5 prend en charge une interface de pro­gram­ma­tion API, ce qui permet d’iden­ti­fier l’em­pla­ce­ment d’un in­ter­naute. En règle générale, un in­ter­naute a le choix d’informer ou non où il se trouve lors du char­ge­ment d’une page fonc­tion­nant avec HTML5.

Plusieurs tutoriels sur HTML5 vous per­met­tront de vous faire la main sur le nouveau standard du Web. Le premier que nous con­seil­lons est le site www.selfhtml5.org. Une sélection de res­sources pratiques pour les dé­ve­lop­peurs de sites est également dis­po­nible sur le site de Mozilla. En règle générale, le langage de balises est pris en charge par tous les éditeurs Web actuels. Il est conseillé de ne pas vous procurer d’éditeur HTML5 au préalable. Pour chaque standard du Web, le W3C met à dis­po­si­tion le Validator pour HTML5. Vous pourrez, grâce à lui, vérifier gra­tui­te­ment la con­for­mité de documents HTML5. La va­li­da­tion du code HTML Markup d’un site Web est une étape im­por­tante pour assurer la qualité d’un site.