Conception de site web

Quelques notes, beaucoup de liens (et un peu de mauvaise foi) sur HTML5

Comme ça va finir par se savoir un jour, autant que se soit moi qui vous l’apprenne : HTML 5.0, c’est pas pour aujourd’hui ni pour demain. A force de claironner à qui veut l’entendre que le groupe de travail sur HTML5 paufine sa copie et que Firefox 3.5 (comme Safari, etc.) prend en charge une partie des spécifications du successeur de HTML 4.0.1 et de XHTML 1.0, les oracles zélés de la modernité sémantique oublient que la feuille de route vers HTML 5 courre jusqu’en 2022… Oui, vous avez bien lu, HTML 5 ne sera pas prêt avant 2022 !

Putain, 13 ans…

Je vous vois venir : quoi, 2022 ! Oui, plus que 13 ans à attendre. En attendant, j’ai voulu fait un petit tour de web pour voir ce que HTML5 nous prépare. Ce billet est donc vaguement exploratoire et les quelques allégations sur la supériorité de XHTML sur HTML que le lecteur pourrait déceler ça et là ne sont que le fruit d’une déception légitime car je trouve que XHTML remplit parfaitement son office.

MàJ du 08/07/2009 : D’après le commentaire de Florent V. nous devrions pouvoir commencer à utiliser HTML5 comme on utilise aujourd’hui CSS 2.1 en 2012, et non pas en 2022.

XHTML2 ferme les portes au profit de HTML5

Cela dit, la nouvelle vient de tomber dans mon aggrégateur : les membres du XHTML2 vont grossir les rangs du groupe de travail sur  HTML5. Peut-être que la dead line sera-t-elle raccourcie. Ou pas, car c’est bien connu, au bout d’un moment, plus on met de ressources humaines sur un projet et moins le projet avance…

Enfin, je suis content de savoir que d’après Ian Jacobs le marché disponible pour XHTML 2 était trop faible comparé à celui de HTML 5. Comme si l’intégrateur de sites de cul (qui représentent en volume la majeure partie du web avec les intranets visibles uniquement avec IE6) attendait avec impatience des balises plus sémantiques, m’enfin… A cet égard, je comprends mieux maintenant la possible introduction d’une balise <nsfw> dans HTML5 ^^

Pour les curieux, voici les réponses à toutes les questions auxquelles vous n’osiez pas penser dans cette FAQ sur le devenir de XHTML. En ce qui me concerne, j’attends avec impatience une version stable de HTML 5.0.1 implémentée dans les principaux navigateurs du marché, en croisant les doigts pour qu’un avatar du mode quirk ne soit pas prévu ou décidé au dernier moment…

Nouvelles balises sémantiques (article, section, nav, etc.)

Comme 99,99% des sites web sont constitués des mêmes ingrédients (titres, paragraphes, micro-contenus, images, vidéos), le groupe de travail WHATWG — qui planche sur HTML5 — propose des balises permettant de découper le contenu des sites web en tranches plus fines. Peut-être pour faciliter la digestion de l’ogre Google ?

Evidemment, cette granularisation de l’information va dans le bon sens et l’implication forte de Google pourrait accélérer le processus : qui prendrait le risque de ne pas mettre son site à jour si Google menaçait gentiment les retardataires de ne plus indexer leurs sites aussi efficacement qu’avant ?

L’autre bon côté, c’est que l’intégrateur web pourrait en profiter pour ajouter une flèche éditoriale à son arc : elle viendra garnir le carquois déjà bien rempli du travailleur du web : HTML, CSS, Javascript (jQuery), graphisme, rédaction web, et plus à venir. A moins que l’intégrateur du futur ne soit qu’un presse-bouton sur DreamWeaver CS10 où toutes les balises auront leur petite icône : et hop ! une `section` par ici, et hop ! une `nav` par là… Et j’entends déjà les dialogues :

— ‘tain, fait chier, Pirefox 12 a encore planté…

— pfff, te plains pas, moi j’arrive pas à aligner mes sections pareilles sur Sexplorer 50 et Safairien 5 (en 2020, Mapple s’est fait racheté par Grozilla et Safairien n’a pas dépassé la version 5, mais des hordes de mapplemaniacs continuent d’utiliser Safairien 5 pour embêter le monde).

— Rhôoo, l’autre, il utilise même pas le reset HTML de B. Bichet (oui, en 2020, j’ai inventé un truc bien).

— Ouais, mais c’est un truc de vieux ce truc… moi j’utilise le script html4isback.js.

— Ralala, vous êtes dans les choux (oui, en 2022 on utilise encore cette expression désuette) : moi j’enlève le doctype html5 pour activer le mode Capitaine Quirk et à moi les joies du HTML 4 !

— N’empêche que je comprendrais jamais comment les mecs de XHTML 2 se sont fait bouffer par les petits jeunôts de HTML 5 à l’époque…

En tout cas, si vous voulez prendre de l’avance, vous pouvez commencer par jeter un oeil sur cette Cheat Sheet pour HTML 5 (PDF) concoctée par Veign en exclusivité mondiale sur Smashing Magazine.

Les codecs intégrés (audio, vidéo)

A côté des balises servant à baliser les contenus texte et image, HTML 5 prendrait en charge la gestion de l’affichage des données audio et vidéo par le biais de codecs intégrés dans les navigateurs. C’est à dire qu’une balise rendrait caduque tous les plugins Flash, Java ou Silverlight… Ben voyons, tu veux un Mars ou bien ? A moins que Google ne vienne au secours de HTML 5 en imposant un codec audio et video pour mettre tout le monde d’accord.

A ce sujet, Adrien Leygues signale dans l’excellent groupes de discussion webdevfr dédié aux professionnels francophones du développement web que le W3C renonce à spécifier les balises audio et video dans HTML 5 :

Face à l’impossible entente entre les éditeurs de navigateurs, l’organisme en charge de la normalisation du Web renonce à détailler les spécifications entourant les instructions relatives à la lecture de vidéos et de fichiers audio. Plutôt que de déplaire à quelques-uns en imposant un format, le W3C a donc choisi de en rien choisir, et donc de déplaire à tout le monde.

C’est balot : cette histoire d’intégrer les codecs audio/vidéo dans le navigateur était plutôt une bonne idée. Tant pis… le confort des utilisateurs est sacrifié sur l’autel des intérêts privés. J’avais malheureusement bien tapé dans l’Emile avec mon histoire de Mars (c’est marrant d’écrire un billet en direct live avec les informations qui arrivent au fur et à mesure).

Quelques liens pour aller plus loin

Pour finir (enfin, vous en aurez quand même pendant 13 ans des billets sur HTML5) voilà une petite lampée de liens gravitant de près ou de loin autour de HTML 5. Merci à tous les twittos y twittas qui m’ont aidé à un moment crucial de ma recherche sur HTML 5. Mention spéciale à webatou, justepourdire, PostMasterVeed, thierryB, Pathien : <3 <3

  • http://www.w3.org/TR/html5 — Vocabulaire et API’s associées pour HTML et XHTML
  • http://whatwg.org/html5 — Brouillon du standard HTML5, en évolution constante
  • http://forums.whatwg.org — Forum de discussion pour la communauté bâtie autour de HTML5
  • http://html5doctor.com/ — Envie d’implémenter HTML5 dès aujourd’hui ? Faites appel au docteur ! Vous trouverez tout ce qu’il faut savoir pour utiliser `<header>`, `<nav>`, `<section>`, `<article>`, etc. à bon escient.
  • http://www.w3.org/News/2009#item119 — Annonce de l’arrêt programmé de XHTML 2 au profit de HTML 5
  • http://www.sitepoint.com/article/html-5-snapshot-2009/ — depuis l’annonce de l’application Google Wave architecturée autour de HTML5, ce dernier est devenu un sujet chaud dans la blogosphère. Exemples de marquage HTML sur le passage de HTML4 vers HTML5
  • http://www.alistapart.com/articles/previewofhtml5 — Avec l’amélioration des contrôles de formulaire, des API’s, le support du multimédia, HTML 5 promet aux auteurs de sites web plus de flexibilité et une plus grande interopérabilité. Beaucoup d’exemples concrets et pratiques.
  • http://www.ibm.com/developerworks/library/x-html5 — Exemples de mise en page avant et après HTML5
  • http://www.miximum.fr/actus/238-html5-quelles-nouveautes — Présentation en français des nouveautés apportées par HTML 5 et leur implémentation dans Firefox 3.5
  • http://t37.net/une-balise-nsfw-dans-html5-mais-wtf.html — Critique de Frédéric de Villamil sur l’introduction d’une balise `<nsfw>` (No Safe For Work) utilisés généralement sur IRC, Twitter, forums, etc. pour prévenir les lecteur que le liens contient du « matériel » pour adultes.
  • http://a.deveria.com/caniuse — Table de compatibilité pour les fonctionnalités présentes dans HTML5, CSS3, SVG et autres technologies web à venir. Voir aussi le wiki ou cette page sur l’introduction des fonctions dans les principaux navigateurs web.
  • http://www.sfgate.com — Il est devenu clair pour le W3c que le marché disponible pour XHTML 2 était trop petit comparé à HTML 5.
  • http://forabeautifulweb.com — Réflexions autour des microformats et de HTML5 sous l’angle de la « sémantique ».
  • http://www.modernizr.com —  Modernizr est une petite bibliothèque Javascript qui peut vous aider à utiliser les nouvelles technologies (CSS3, HTML 5) dès maintenant grâce à une détection des navigateurs supportant telle ou telle fonctionnalité.
  • http://stoneship.org/ — Quelques questions intéressantes à propos de l’abandon de XHTML2 d’après les commentaires du billet de JeffreyZeldman intitulé XHTML DOA WTF.
  • HTML 5 and CSS 3: The Techniques You’ll Soon Be Using — Tutoriel très instructif et très clair sur le balisage d’un blog à l’aide de HTML5 et de CSS3. Utilisation un peu étrange de la balise `<header>` que l’auteur met plusieurs fois dans le document pour regrouper le titre des articles et les meta-informations sur le billet.
  • HTML5 se dévoile — L’article francophone qui manquait pour avoir une vision claire de HTML5. Merci julixyde !
Publié le par Bruno Bichet