Analyser en profondeur la sémantique de HTML et de ses cadres frontaux connexes

Cet article présente principalement l'analyse approfondie de la sémantique de HTML et du cadre frontal qui lui est lié. Simple HTML a également une grande connaissance! Les amis qui en ont besoin peuvent se référer aux questions suivantes sur la sémantique

La sémantique étudie la relation entre les signes et les symboles et la signification qu'ils représentent. En linguistique, il étudie principalement le sens de ces marqueurs (tels que des mots, des phrases ou des sons) dans le langage. Dans le domaine du développement frontal, la sémantique implique principalement le sens convenu par les éléments HTML, les attributs et les valeurs d'attribut (y compris des extensions comme les microdata). Ces sémantiques de congrès formelles couramment utilisées dans les spécifications peuvent aider les programmes (et ceux qui participent plus tard au développement) mieux comprendre les informations sur tous les aspects d'un site Web. Cependant, même si la sémantique de ces éléments, les attributs et les valeurs d'attribut sont formalisés, ils doivent toujours être soumis à l'adaptabilité du développeur et aux résultats de leur choix conjoint. Cela permet à la sémantique de convention formelle d'être modifiée à l'avenir (et c'est l'un des principes de la conception HTML).

Le respect du principe de l'écriture de HTML sémantique est l'une des fondements du développement frontal professionnel moderne. La plupart des sémantiques sont liées aux propriétés de contenu actuelles ou attendues (telles que: élément H1, attribut Lang, valeur e-mail de l'attribut de type, microdate).

Cependant, toutes les sémantiques ne doivent pas être axées sur le contenu. Les noms de classe ne peuvent pas être sémantiques. Quel que soit le nom, ils doivent avoir un sens et un but. La sémantique des noms de classe peut être différente de ces éléments HTML. Nous pouvons utiliser la sémantique globale des éléments HTML, certains attributs HTML, microdata, etc., puis utiliser la sémantique spécifique locale du site Web ou de l'application pour les distinguer. Ces sémantiques spécifiques sont généralement contenues dans la valeur d'attribut, comme l'attribut de classe.

Bien que cette meilleure pratique supposée soit réitérée dans le chapitre sur les propriétés de classe de la spécification HTML5 ...

… Les développeurs sont encouragés à utiliser des valeurs d'attribut de classe pour décrire le contenu réel, plutôt que de décrire ce qu'ils s'attendent à présenter.

... Il n'y a aucune raison inhérente à le faire. En fait, lorsque cette méthode est appliquée dans de grands sites Web ou applications, il devient souvent une barrière.

Les éléments HTML et autres attributs fournissent déjà la sémantique de couche de contenu

Pour les machines ou les visiteurs, il y a très peu d'informations sémantiques utiles que le nom de la classe peut révéler, ou même non. Sauf si c'est la petite partie du nom déjà convenu (également lisible par la machine) - les mirco-verme

Le but principal des noms de classe est d'être un crochet pour CSS et JavaScript. Si vous n'avez pas besoin d'ajouter des performances et du comportement à votre page, vous n'aurez peut-être pas à ajouter de noms de classe à votre HTML

Les noms de classe doivent transmettre des informations utiles aux développeurs. Lorsque vous lisez un extrait DOM, cela aidera à comprendre le rôle spécifique d'un certain nom de classe. En particulier dans les équipes de développement de collaboration multi-personnes, les développeurs front-end non seulement traitent des composants HTML.

Donnons un exemple très simple: