<section>

La balise <section> est utilisée en HTML pour définir une section autonome dans un document.

Elle permet de regrouper des contenus ayant un thème commun, facilitant ainsi la structuration de la page pour les moteurs de recherche. 😉

Structure et syntaxe de la balise <section>

Structure et syntaxe de base

Voici la syntaxe de base d’une balise <section> :

<section>
  Contenu de la section ici
</section>

Exemple d’utilisation

Voici un exemple typique d'utilisation de la balise <section> :

<section>
  <h2>Les avantages de l'apprentissage en ligne</h2>
  <p>L'apprentissage en ligne offre une grande flexibilité pour les étudiants.</p>
</section>

Dans cet exemple, la balise <section> est utilisée pour regrouper un titre et un paragraphe ayant pour thème l'apprentissage en ligne.

Attributs

La balise <section> accepte les attributs HTML classiques comme :

• class : pour appliquer des styles CSS.
• id : pour identifier un conteneur unique.
• style : pour appliquer des styles inline.

Bonnes pratiques

Utilisez la balise <section> pour structurer des parties du contenu ayant un thème ou un sujet particulier. Cela permet de rendre le contenu plus compréhensible, tant pour les utilisateurs que pour les moteurs de recherche.

Évitez également d'utiliser <section> pour des éléments qui ne sont pas des sections indépendantes, tels que des éléments de navigation ou des en-têtes de page. Dans ces cas, il est préférable d'utiliser des balises comme <header> ou <nav>.

Différence avec d’autres balises similaires

• <article> : La balise <article> est utilisée pour marquer un contenu autonome, mais contrairement à <section>, elle représente un élément indépendant qui pourrait être redistribué, comme une publication ou bien un article de blog.
• <aside> : La balise <aside> est utilisée pour marquer un contenu secondaire, souvent en relation avec le contenu principal, mais sans en être une partie intégrante. Contrairement à <section>, <aside> n’est pas conçu pour regrouper des contenus ayant un thème spécifique.

Compatibilité des navigateurs

La balise <section> est prise en charge par tous les navigateurs modernes.