HTML5-Semantik - H1 oder H2 für ARTIKEL-Titel in einem ABSCHNITT

Nach meinem Verständnis (basierend auf diesem Kapitel von Dive in HTML5: http://goo.gl/9zliD ) kann es als semantisch angemessen angesehen werden, H1-Tags in mehreren Bereichen der Seite als Methode zum Festlegen des wichtigsten Titels zu verwenden für diesen bestimmten Inhalt.

Wenn ich diese Methode verwende und einen ABSCHNITT habe, dem ich ein H1 von 'Artikeln' zugewiesen habe, sollte ich H1 oder H2 verwenden, um die Titel für ARTIKEL in diesem ABSCHNITT zu definieren? Dies ist für mich etwas verwirrend, da die Titel der Artikel die wichtigste Überschrift für ihren ARTIKEL sind, aber auch "Kinder" des Titels des ABSCHNITTS.

Beispielcode:

<section class="article-list">
  <header>
    <h1>Articles</h1>
  </header>

  <article>
    <header>
      <h2>Article Title</h2>
      <time datetime="201-02-01">Today</time>
    </header>
    <p>Article text...</p>
  </article>

  <article>
    <header>
      <h2>Article Title</h2>
      <time datetime="2011-01-31">Yesterday</time>
    </header>
    <p>Article text...</p>
  </article>

  <article>
    <header>
      <h2>Article Title</h2>
      <time datetime="2011-01-30">The Day Before Yesterday</time>
    </header>
    <p>Article text...</p>
  </article>
</section>

Der Pilger ist damit nicht allein.

Laut Jeremy Keiths HTML5 für Webdesigner können Sie mehrere <h1>s in einem Dokument verwenden, ohne die Dokumentzusammenfassung zu ruinieren, solange sie in diskreten semantischen Abschnitts-Tags verschachtelt sind.

Zitieren direkt aus dem eBook (das ich bei iBooks gekauft habe)

Bisher bietet uns der neue Abschnittinhalt nicht viel mehr als das, was wir mit früheren HTML-Versionen tun könnten. Hier ist der Kicker: In HTML5 hat jeder Teil des Abschnittsinhalts einen eigenen Umriss. Das bedeutet, dass Sie nicht verfolgen müssen, welche Überschriftenebene Sie verwenden sollten - Sie können jedes Mal einfach von h1 aus starten:

<h1>An Event Apart</h1> 
    <section>
        <header>
            <h1>Cities</h1>
        </header>
         <p>Join us in these cities in 2010.</p> 
        <section>
            <header>
                <h1>Seattle</h1>
            </header>
            <p>Follow the yellow brick road.</p> 
       </section>
        <section>
            <header>
                <h1>Boston</h1>
            </header>
            <p>That’s Beantown to its friends.</p> 
        </section> 
        <section>
             <header>
                   <h1>Minneapolis</h1>
             </header>
             <p>It's so <em>nice</em>.</p> 
         </section>
     </section> 
     <small>Accommodation not provided.</small>

(Beispielcode auch aus dem Buch, Seite 73)

Ich würde eher der Interpretation von Mark Pilgrim zustimmen . Wenn Sie Ihren Artikel in ein articleElement einschließen , können Sie erneut mit einer h1Überschrift für den Artikel beginnen.

In der HTML5-Spezifikation sollen articles als unabhängiger, in sich geschlossener Teil der Seite behandelt werden. Sie sollten in der Lage sein, das articleElement unverändert auf eine andere Seite zu übertragen, ohne die Überschriften neu zu formatieren.

Wenn Artikelüberschriften eine Fortsetzung der Dokumentüberschriftenhierarchie sein müssten, müssten Sie, wenn Sie das articledirekt unter einem bodyTag ablegen, zu gehen h1, aber wenn Sie es unter verschachtelten Abschnitten ablegen, müssten Sie es in h3/ ändern h4// h5usw., je nachdem, wo Sie es platzieren.

Tatsächlich sollten Sie jedes Mal, wenn Sie ein neues sectionoder erstellen article, zurückkehren h1, da Folgendes identisch ist:

<article>
  <h1>Meta Data</h1>
    <h2>Data Warehousing</h2>
    <h2>On the Web</h2>
      <h3>Dublin Core</h3>
      <h3>XFN</h3>
      <h3>Microformats</h3>
      <h3>RDFa</h3>
</article>

und:

<article>
  <h1>Meta Data</h1>
  <section>
    <h1>Data Warehousing</h1>
  </section>
  <section>
    <h1>On the Web</h1>
    <section>
      <h1>Dublin Core</h1>
    </section>
    <section>
      <h1>XFN</h1>
    </section>
    <section>
      <h1>Microformats</h1>
    </section>
    <section>
      <h1>RDFa</h1>
    </section>
  </section>
</article>

Nebenbei bemerkt, wenn Ihre Kopfzeile nur ein Überschriftenelement ist (z. B. h1) und nichts anderes, müssen Sie sie nicht in ein headerElement einschließen.

Während die Artikeltitel Ihrer Seite wichtig sind, definiert im Allgemeinen die Überschrift der obersten Ebene der Seite den Inhalt der Seite. Manchmal ist es der Name des Artikels und manchmal, wie Sie zeigen, der Titel einer Auflistung von Artikeln.

<h1>My Very Interesting Articles</h1>

Diese Überschrift definiert die gesamte Seite als "interessante Artikel". Dann wird jeder Artikel aufgelistet, hat aber eine geringere Überschriftenebene.

Die offizielle Antwort von w3schools auf die Verwendung von Überschriften-Tags auf einer Seite lautet wie folgt: H1-Überschriften sollten als Hauptüberschriften verwendet werden, gefolgt von H2-Überschriften, dann den weniger wichtigen H3-Überschriften und so weiter.