HTML est du marquage, pas un langage de programmation — utilisez-le comme tel.
Traitez le HTML comme une structure pour la navigation, l’SEO, l’accessibilité et les performances de rendu, et remplacez la soupe de div par des éléments sémantiques que le navigateur et les robots de recherche peuvent comprendre.
Sources: HTML Is Not What You Think
L’attrait d’HTML
HTML est toujours considéré comme la compétence de base facile à maîtriser — des balises, des formulaires, quelques layouts — tandis que les pages réelles sont devenues extrêmement complexes. Les documents typiques contiennent désormais des milliers de nœuds DOM, pourtant de nombreux sites sont encore créés selon les habitudes d’un web plus ancien et plus restreint. Ce fossé se manifeste à quatre niveaux : la manière dont les utilisateurs naviguent, la façon dont les moteurs de recherche interprètent la structure, l’efficacité avec laquelle les navigateurs affichent le contenu, et la manière dont les outils de balayage et les systèmes d’intelligence artificielle extraient du sens des marquesurs.
HTML n’est pas un langage de programmation
Les marquesurs structurent le contenu ; les langages de programmation expriment des comportements. La différence est évidente :
- Logique : Les langages utilisent des conditions pour prendre des décisions. HTML ne prend pas de décisions.
- État : Les langages conservent des variables. HTML n’en a pas.
- Résultat : Les langages calculent des valeurs. HTML décrit ce qui doit apparaître.
Appeler HTML un langage de programmation mélange les catégories. Il s’agit d’un langage de balisage permettant de structurer et de décrire le contenu que le navigateur affichera.
Internet a un problème avec DIV
Les boîtes anonymes imbriquées restent courantes :
<div><div><div>
<div>Text</div>
</div></div></div>
Une alternative sémantique désigne des rôles plutôt que d’empiler des enveloppes :
<article>
<header><h1>Title</h1></header>
<main><p>Text</p></main>
</article>
Un fort niveau d’imbrication de div nuit aux arbres d’accessibilité, ralentit la maintenance et fournit au navigateur une structure sans signification à parcourir. Préférez des éléments qui déclarent leur fonction.
HTML est en crise d’identité
HTML a commencé comme un format de document pour la publication. Il sert aujourd’hui à créer des expériences similaires à du logiciel : tableaux de bord, PWA, jeux. Un bref aperçu chronologique :
- 1991 : Documents académiques
- 1996 : Mise en page basée sur des tableaux
- 2004 : Applications web à l’époque d’AJAX
Cette langue n’a jamais été conçue comme un environnement d’exécution complet pour des applications, mais le DOM moderne offre une vaste surface API sur laquelle s’appuient les frameworks d’application.
Ce que le navigateur voit réellement
Le rendu est un processus en plusieurs étapes, et non une seule opération :
- Arbre DOM — l’HTML est analysé pour former des éléments et une structure
- CSSOM — les styles sont appliqués
- Arbre de rendu — le DOM et les styles sont combinés
- Mise en page — la géométrie est calculée
- Dessin — les pixels sont affichés
Un marquage insuffisant peut nuire aux performances avant même que le CSS ou le JavaScript ne deviennent un goulot d’étranglement. Des arbres profonds et anonymes entraînent des difficultés de mise en page et d’accessibilité, même lorsque les styles semblent corrects.
L’HTML sémantique sauve le Web
Les balises sémantiques fournissent aux navigateurs, aux moteurs de recherche et aux technologies d’assistance une structure plus claire :
<article>indique du contenu indépendant pour les lecteurs et les indexateurs<nav>identifie les points de navigation<main>met en évidence la région de contenu principale que les robots d’indexation privilégient<figure>associe les médias à des légendes de manière reconnaissable par les analyseurs
Le coût caché d’un HTML de mauvaise qualité
- Prestations : Des DOM trop volumineux ralentissent l’affichage sur des appareils modestes
- Accessibilité : Une structure faible dérange les lecteurs d’écran et les utilisateurs de clavier
- SEO : Les systèmes de recherche continuent de s’appuyer sur la structure HTML avant que la plupart des scripts JavaScript côté client ne s’exécutent
HTML5 a tout changé
Au préalable à HTML5, les médias riches dépendaient souvent de Flash ou d’applets Java. Les éléments natifs et les API ont remplacé une grande partie de cette technologie :
- Multimédia :
<video>et<audio>ont remplacé les lecteurs de plugins - Grafxiques :
<canvas>et<svg>permettent de dessiner sans applets - Stockage :
localStoragea réduit la persistance côté client basée uniquement sur les cookies
Aujourd’hui, HTML est un standard en évolution constante géré par WHATWG et continue de se développer plutôt que de rester figé sous la forme d’une version numérotée « HTML6 ».
L’avenir d’HTML
Les frameworks modifient les workflows de création ; les navigateurs continuent cependant d’utiliser HTML en fin de chaîne. Les tendances qui maintiennent le markup au centre sont les suivantes :
- Composants web natifs pour des éléments réutilisables sans impératif de framework
La structure, l’accessibilité et la clarté sémantique seront d’autant plus importantes, et non moins, à mesure que les machines rejoignent les humains en tant que principaux consommateurs de pages.
Conséquences — Le défi
L’HTML a survécu à toutes les tendances du web — des sites de présentation aux applications assistées par l’IA — en restant le substrat fondamental. Apprendre les balises n’est plus la partie difficile. La véritable difficulté réside à faire face aux coûts à long terme liés à leur utilisation négligente : des structures div inaccessibles, des DOM lents, et un marquage en cui les humains comme les robots de recherche ne peuvent pas faire confiance.
Les références principales incluent la norme HTML WHATWG à http://html.spec.whatwg.org/, MDN à http://developer.mozilla.org/, des exemples d’antipatterns pratiques à https://htmhell.dev/, ainsi que des mesures du Web Almanac à http://almanac.httparchive.org/.