This page has been robot translated, sorry for typos if any. Original content here.

Nouveaux en-têtes HTML5, pied de page, nav, à part, section, article, hgroup

HTML5 новые тэги header, footer, nav, aside, section, article, hgroup

Parlons de nouvelles balises en HTML5.

Et pour commencer, examinons les plus globaux: section, article, en-tête, pied de page, navigation, apartement et hgroup .

HTML5 est à bien des égards un standard plus sémantiquement correct.

Les parties caractéristiques du site Web sont finalement nommées par leurs noms unifiés, ce qui évite toute confusion: l'en-tête est la partie supérieure du site, le pied de page est inférieur, la navigation est un bloc de navigation, etc. En fait, cela élimine le besoin d'utiliser une balise DIV neutre pour désigner ces parties du site.

Vous pouvez, par exemple, une entrée typique:

 <div id = "header">
 <h1> <a href="http://www.examplesite.com/"> site Web </a> </ h1>
 </ div>

réécrivez-le comme ceci:

 <en-tête>
 <h1> <a href="http://www.examplesite.com/"> site Web </a> </ h1>
 </ header>

Et dans le fichier de style CSS, respectivement, enregistrez l'ensemble de règles directement pour la balise d'en-tête.

Cependant, il y a une capture dans ceci. Le fait est que la plupart des navigateurs ne savent pas encore que ces nouvelles balises sont des éléments de bloc et les considèrent comme une chaîne, comme les mêmes balises de lien <a> ou <img>, par exemple. Par conséquent, il est nécessaire de forcer leur caractère de bloc dans le fichier de style CSS pour de telles balises:

 en-tête, pied de page, navigation, article {display: block;}

Si la sémantique des en-têtes de balises, le pied de page est plus ou moins claire, les autres balises doivent être considérées de plus près.

nav - utilisé pour créer une barre de navigation. Sur la page de ces éléments peuvent être plusieurs. Par exemple, un bloc de liens vers les pages principales du site et un bloc de navigation sur les en-têtes.

side - est une balise unificatrice, idéale pour mettre en évidence la barre latérale. Il peut inclure des blocs de navigation et d'autres éléments qui ne sont pas essentiellement de la navigation (bannières publicitaires, une photo de l'auteur et des informations sur lui, boutons sociaux et puzomerki, etc.).

section est aussi une balise unificatrice. En outre, il peut jouer différents rôles: diviser la page en plusieurs domaines (par exemple, isoler la partie centrale avec le contenu et la barre latérale de l'en-tête et du sous-sol) ou diviser l'article de la page en sections distinctes (lire les paragraphes) .

article - sert à diviser la page en articles séparés.

Les balises section et article ont un certain nombre de fonctionnalités intéressantes. Par exemple, vous pouvez maintenant utiliser le titre de premier niveau H1 sur la même page plusieurs fois en toute sécurité, ce qui était auparavant inacceptable. De plus, la balise de section peut être l'élément parent d'un article ou diviser l'article lui-même en plusieurs sections. C'est à dire Il est fort possible que ce design

 <section>
 <article>
 <section> </ section>
 <section> </ section>
 </ article>
 <article>
 <section> </ section>
 <section> </ section>
 </ article>
 </ section>

hgroup - la balise est conçue pour regrouper les en-têtes de page dans une unité logique. Par exemple, le titre principal de l’ensemble de la page H1 et sa description, orné de la balise H3. Sur la page, d’autres balises H3 peuvent être utilisées plusieurs fois à d’autres fins. Pour séparer logiquement la description de la page des autres balises H3, nous la fusionnons avec la balise H1 principale dans un groupe, désigné par la balise hgroup:

 <hgroup>
 <h1> La plupart des sites Web </ h1>
 <h3> Voici la description du site lui-même </ h3>
 </ hgroup>