Dans HTML5, il manque quand même la balise panier pour aller avec article. Ce début de réflexion que je partageais sur Twitter m’est venu en lisant les tables de la loi spécifications de HTML5, notamment la partie semantics. Là, j’ai eu comme une révélation : Les balises HTML et surtout HTML5 sont orientées vers les contenus littéraires (dialog), le monde de la presse (article) et les publications à caractère scientifique (section).

C’est normal si on considère que le web est issu du monde de la recherche universitaire mais ça l’est moins au regard des autres pratiques du web en général et du commerce en ligne en particulier. Du coup, mon côté réactionnaire a pris le dessus et je me suis mis à regarder HTML5 comme un sous-produit de XHTML réservé aux contenus dits de « qualité » vs le commerce qui ferait partie du côté « obscur » de la force.

Pour prendre le contre-pied de ce que j’écrivais dans Favoriser les sites de contenus, n’est-ce pas exclure de fait les sites d’entreprises ? je pense qu’il est peut-être temps de se pencher sur la structure sémantique des sites de vente en ligne.

Les balises qui manquent à HTML5

Et là, je ne parle pas que de e-commerce. Quelqu’un pourra-t-il m’expliquer la présence d’une balise dialog alors qu’il manque la balise logo, élément bien plus largement utilisé sur le web ? Idem pour une éventuelle balise motto ou baseline ? Je veux bien y mettre de la bonne volonté, mais HTML5 est quand même un truc bancal quand on regarde de près la structuration des contenus présents sur le web.

Et le e-commerce, ça pue ?

Et oui, à côté des blogs, des articles d’information et des sites corporate (qui partagent la même structure), le gros du web est composé de sites de vente en ligne. Quand on y regarde de plus près, les éléments composant la notice d’un article (produit) sont autrement plus complexes que ceux d’un article (billet) : on retrouve les mêmes éléments (titre, sous-titre, résumé, etc.) en plus des éléments spécifiques au commerce comme le prix (price ?), le nombre d’éléments en stock (item ?), etc. Sans compter tous les éléments qui caractérisent un produit comme la taille, la couleur, etc.

Vous vous doutez bien qu’il ne serait pas très pratique d’avoir autant de balises dites « sémantiques » pour caractériser chaque élément de personnalisation possible pour un article donné. C’est pourquoi, je propose d’inventer un mécanisme permettant de spécifier un élément sous forme ce classe CSS histoire de s’en sortir avec tous les micro-contenus… Mais attendez, on me souffle dans l’oreillette que les microformats existent déjà…

En (très) bref

HTML5 sera parfait pour structurer l’exemplaire papier de Roméo et Juliette qui se trouve dans ma bibliothèque. En ce qui concerne les contenus disponibles sur le web le travail ne fait que commencer.

Articles sur le même sujet

• Quelques notes — Programme de formation HTML & CSS
• Quelques notes sur les fonctions de l’intégrateur web et de l’intégratrice web
• The HTML Framework Project | Phase 1.1 — définir
• Le petit journal du web — Les fruits de la veille ont gardé toute leur fraicheur
• 390 ressources Javascript & jQuery

Dans la série des problèmes existentiels qui ponctuent la journée de l’intégrateur web, la question du marquage HTML des petites portions de texte est souvent de la partie. Pour la baseline par exemple, on peut justifier l’utilisation de la balise blockquote : c’est une « citation » de la marque, elle est souvent mise en italique ou entre guillemets.

Ca donne :

<blockquote id="baseline"><p>Ma baseline est plus belle que la tienne</p></blockquote>

Or, en l’absence de CSS — notamment sur les périphériques mobiles — les micro-contenus enveloppés avec div ne possèdent pas de marges, et visuellement, au mieux, c’est balot, au pire, c’est illisible (cf. le visionnage du flux friendfeed, par ex.) !

Dans ce contexte, vous privilégiez quoi entre :

<p id="copyright">copyright, copyleft ou copycenter ?</p>

<div id="copyright">copyright, copyleft ou copycenter ?</div>

Articles sur le même sujet

• Rétablir le flux après des éléments flottants en CSS sans balise HTML supplémentaire
• Pour rétablir le flux après un float, vous êtes plutôt HR, BR ou DIV ?
• Le petit journal du web — Les fruits de la veille ont gardé toute leur fraicheur
• Quelques notes — Programme de formation HTML & CSS
• Interviews Bruno Bichet, intégration web et css 4 design de 2007 à nos jours