Wann soll das SECTION-Element verwendet werden?

8

Ich bin etwas verwirrt von dem neuen HTML5-Element <section>. Was ist der richtige Weg, um es zu verwenden?
Betrachten Sie diese Gliederung:

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

Macht das Sinn?
Was wäre, wenn ich kleinere Artikel mit nur einem Titel und einem kurzen Text hätte? Wäre es (semantisch, spezifikationsmäßig usw.), das wegzulassen section?

Agos
quelle

Antworten:

2

Wenn Sie keine Abschnitte benötigen (kleine Artikel haben), können Sie einfach eine bloße <article>Entität um Ihren Inhalt verwenden. Wenn Sie dies nicht tun, kann der Abschnitt Untertitel und Absätze in diese Abschnitte einschließen.

Schauen Sie sich die HTML5-Abschnittsspezifikationen an .

Beispiel:

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

Ich denke, Sie werden Dive Into HTML5 , ein laufendes Buch, als großartige Ressource finden. Hier ist ein relevanter Abschnitt darüber, wann und wie neue semantische Elemente verwendet werden . Für Ihr Beispiel denke ich, dass Sie das <section>Tag möglicherweise weglassen können .

Virtuosi Media
quelle
+1 danke für den Artikel über die semantischen Elemente. Leicht lesbar.
Saif Bechan