La balise <section>

La balise <section> est utilisée pour délimiter une section thématique dans une page Web.

• Lorsque le navigateur rencontre une balise <section> il identifie cette partie du document comme un regroupement de contenu portant sur un même sujet.

• Une section contient généralement un titre ainsi qu'un ensemble d'éléments liés à ce titre.

• La balise <section> permet de mieux organiser le contenu d'une page en plusieurs parties logiques.

• La balise <section> est une balise sémantique de type block par défaut.

• Parce qu'il s'agit d'un élément conteneur, une balise de fermeture </section> est nécessaire pour indiquer où la section se termine.

Bonnes pratiques

Il est recommandé :

• d'utiliser <section> pour regrouper du contenu relié à un même thème;
• d'ajouter un titre à l'intérieur de chaque section;
• d'utiliser plusieurs sections pour organiser les différentes parties d'une page;
• d'utiliser le CSS pour personnaliser l'apparence des sections;
• d'éviter d'utiliser <section> uniquement comme conteneur visuel lorsque d'autres balises sont plus appropriées comme la <div>;
• de conserver une structure logique et cohérente.

SEO

La balise <section> aide les moteurs de recherche à comprendre l'organisation du contenu.

Lorsqu'elle est accompagnée de titres pertinents, elle contribue à rendre la structure du document plus claire et plus facile à analyser.

Exemple

Sections dans le contenu principal

<main>
    <section>
        <h2>À propos</h2>
        <p>Présentation de l'entreprise.</p>
    </section>

    <section>
        <h2>Services</h2>
        <p>Description des services offerts.</p>
    </section>
</main>