Quando usar o elemento SECTION?

8

Estou um pouco confuso com o novo elemento HTML5 <section>,. Qual é a maneira correta de usá-lo?
Considere este esboço:

<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>

Isso faz sentido?
E se eu tivesse artigos menores, com apenas um título e um texto breve? Seria (semanticamente, em termos específicos, etc.) omitir o section?

Agos
fonte

Respostas:

2

Se você não precisa de seções (tem artigos pequenos), basta usar uma <article>entidade simples em torno do seu conteúdo. E quando não o fizer, a seção poderá agrupar subtítulos e parágrafos nessas seções.

Confira as especificações da seção html5 .

Exemplo:

<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>
JasonBirch
fonte
4

Acho que você encontrará o Dive Into HTML5 , um livro em andamento, um ótimo recurso. Aqui está uma seção relevante sobre quando e como usar novos elementos semânticos . Para o seu exemplo, acho que você pode omitir a <section>tag.

Virtuosi Media
fonte
+1 obrigado pelo artigo sobre os elementos semânticos. Fácil de ler.
Saif Bechan