Introduction aux balises sémantiques en HTML5

Dans la norme HTML5, plusieurs nouvelles balises sont ajoutées pour ajouter la sémantique de la page. Ces balises incluent : article, section, nav et apart, etc. Contrairement à la plupart des autres balises, le navigateur les traite uniquement comme des éléments ordinaires au niveau du bloc lors de l'interprétation et du rendu de ces balises, sans ajouter de logique de présentation supplémentaire, c'est-à-dire que ces balises ne sont utilisées que pour ajouter de la sémantique. Pour les développeurs Web, l'importance réelle de l'utilisation de ces balises réside principalement dans deux points : l'optimisation des moteurs de recherche et l'augmentation de la convivialité de la page (accessibilité).

En termes de classification des éléments, l'article, la section, la navigation et l'aparté sont appelés « Contenu de sectionnement ».

article

les éléments d'article peuvent être utilisés pour représenter des pages Contenu doté d'un certain degré d'indépendance. Ce contenu peut être un article, un post/commentaire sur un forum, un blog, un champ interactif, etc. Les balises d’article peuvent être imbriquées. Ce faisant, l’élément d’article enfant doit être logiquement lié à l’élément d’article parent. Par exemple, les développeurs Web peuvent utiliser le texte et les commentaires d'un blog comme élément d'article parent et utiliser chaque commentaire comme élément d'article enfant.

L'élément principal ne peut pas apparaître à l'intérieur de l'élément article - l'élément principal signifie le contenu principal de la page. Lorsqu'il y a un élément principal, l'élément article existe en tant qu'élément enfant de l'élément principal.

section

élément de section désigne une partie d'une page ou d'une application Web. Le "thème" ou le "ton" des différentes sections doit être différent les uns des autres. ce "thème"/"ton" est généralement défini en plaçant l'élément de titre (h1-h6) à l'intérieur de l'élément de section.

C'est une erreur d'utiliser section comme p - à l'exception du contenu qui peut être affiché sur la page, les sous-éléments de section ne doivent assumer aucun autre rôle (style, comportement, balises auxiliaires, etc. ).

nav

L'élément nav est principalement utilisé pour contenir des liens de navigation sur la page, il est donc très courant d'inclure directement des éléments ul ou ol dans nav éléments. Néanmoins, le nav n'a pas besoin de contenir des éléments ul ou ol. Par exemple, l'élément nav peut contenir un paragraphe d'article (balise p) et le paragraphe d'article contient des liens (une balise).

Semblable à l'élément article, l'élément principal ne peut pas apparaître à l'intérieur de l'élément nav.

aside

l'élément aside est généralement utilisé pour représenter la barre latérale de la page, mais cet élément ne représente que sémantiquement la "barre latérale" du navigateur lors de l'analyse et du rendu de la balise. , il ne sera traité que comme un élément ordinaire de niveau bloc p. Si vous souhaitez vraiment obtenir l'effet de barre latérale, les développeurs Web doivent écrire leur propre CSS pour y parvenir.

L'introduction ci-dessus aux balises sémantiques HTML5 est tout le contenu partagé par l'éditeur. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !