Fonctionnalité gratuite
Utiliser correctement <label>
s signifie que vous pouvez cliquer sur l'étiquette pour entrer dans le champ de texte. Selon les spécifications officielles, de nombreux navigateurs ajoutent des fonctionnalités logiques par défaut à de nombreuses balises, ce qui signifie que vous pouvez utiliser moins de plugins JavaScript et écrire moins de code qu'un site entièrement constitué de <div>
s et <span>
s.
Accessibilité
En ce qui concerne la fonctionnalité gratuite, la sémantique compte beaucoup pour les logiciels de lecture d'écran. Le texte devant un champ de saisie ne sera pas lu de la même manière qu'un <label>
testament. Les lecteurs d'écran vont ignorer la plupart de vos CSS, donc cela dépend principalement de la structure de votre HTML.
CSS logique
Pourquoi utiliser un div #header
quand vous pouvez utiliser un <header>
style et directement? Les étiquettes sémantiques facilitent le marquage et rendent votre style beaucoup plus portable. Si vous avez un certain style à rayer et que vous utilisez toujours des <del>
éléments, le style est beaucoup plus portable. <del>
signifie la même chose pour tout le monde, mais chacun nommera sa .deletedText
classe différemment.
Cela aide également à garder tout le monde sur la même page dans les grands projets; personne n'aime apprendre les conventions de nommage des classes ésotériques des autres.
SEO
Les moteurs de recherche tels que Google ont eu de plus en plus recours au HTML sémantique et aux métadonnées . Les extraits enrichis de Google utilisent également des métadonnées spéciales destinées à véhiculer un contenu sémantique.
Pourquoi ce n'est pas si commun
Cela prend du travail, et les gens sont habitués à juger un site Web en fonction de son apparence et de son fonctionnement . Souvent, la sémantique n’est pas prise en compte, car les personnes qui rédigent le dossier d’affaires pour les applications ne le comprennent pas ou pourquoi il est important.
Il est très difficile aux personnes non techniques de comprendre ou d’évaluer la sémantique HTML.
Si un site Web a l'air bien et qu'il semble fonctionner, pourquoi s'inquiéter? Beaucoup de gens ne savent peut-être même pas qu'il n'y a rien de plus. Semblable à l'accessibilité, cela a tendance à être ignoré jusqu'à ce que quelqu'un de votre équipe comprenne vraiment cela.
Si vous voulez que le HTML sémantique soit une priorité pour votre projet, vous devez en présenter le cas. Il est également utile de montrer à votre équipe / responsable le fonctionnement de votre site Web à l'aide d'un lecteur d'écran.