web-dev-qa-db-fra.com

Quand utiliser l'élément SECTION?

Je suis un peu dérouté par le nouvel élément HTML5, <section>. Quelle est la bonne façon de l'utiliser?
Considérez ce schéma:

<article>
  <header>
    <h2>Title</h2>
    <p>Spiffy tagline</p>
  </header>
  <section>
    <p>My content! BLA BLA BLA YADDA YADDA</p>
    <p>Some more content!</b>
  </section>
</article>

Est-ce que ça fait du sens?
Et si j’avais des articles plus petits, avec juste un titre et un texte bref? Serait-il (sémantique, spécifique, etc.) d'omettre le section?

8
Agos

Si vous n'avez pas besoin de sections (petits articles), vous pouvez simplement utiliser une entité nue <article> autour de votre contenu. Et si vous ne le faites pas, la section peut envelopper les sous-titres et les paragraphes dans ces sections.

Découvrez le specs de section html5 .

Exemple:

<header>
  <h1>Blog Posts</h1>
</header>
<article>
  <header>
    <h1>Article Header</h1>
    <h2>My Awesome Stuff!</h2>
  </header>
  <p>My content! BLA BLA BLA YADDA YADDA</p>
  <p>Some more content!</b>
</article>
<article>
  <header>
    <h1>Article 2 Header</h1>
    <h2>More of My Awesome Stuff!</h2>
  </header>
  <section>
    <header>
      <h1>Getting started</h1>
    </header>
    <p>Getting started text</p>
  </section>
  <section>
    <header>
      <h1>Now you're underway</h1>
    </header>
    <p>Underway text</p>
  </section>
  <section>
    <header>
      <h1>Wrapping up</h1>
    </header>
    <p>Wrapping up text</p>
  </section>
</article>
2
JasonBirch

Je pense que vous trouverez Dive Into HTML5 , un livre en cours de développement, une ressource précieuse. Voici une section pertinente sur quand et comment utiliser de nouveaux éléments sémantiques . Pour votre exemple, je pense que vous pouvez peut-être omettre la balise <section>.

4
Virtuosi Media