molily: Semantisches Markup: <main>...<header> oder <header>...<main> ?

Beitrag lesen

Hallo,

eigentlich ist es doch egal, welche der beiden folgenden Alternativen ich verwende, oder?

Ich halte beide für verbesserungsfähig.

<?php include “navigation.php”; ?>

<header>Seitenüberschrift</header>
<main>
        <article>
        <header>Abschnittsüberschrift</header>
        Text eines Abschnitts
        </article>
</main>
<footer>Text Footer</footer>

  
Wenn der footer ein Kind von body ist und nicht Teil von main, sollte das auch für header gelten.  
  
Üblicherweise bringt man die Hauptnavigation ausgezeichnet mit nav im dokumentweiten header unter. Das ist nicht zwingend nötig, erscheint mir aber logisch. Ich würde vorschlagen:  
  
header  
  h1  
  nav  
    h1|h2  
    ul  
main  
  (Content|section|article|aside)+  
footer  
  h1|h2  
  
Der erste header, der nicht in einem Sectioning-Element verschaltet ist, ist der dokumentweite Header. Die Bäume  
  
nav  
header  
main  
  
und  
  
nav  
main  
  header  
  
erzeugen denselben Outline. Der dokumentweite header steht logisch gesehen ÜBER dem nav. Daher würde ich die Reihenfolge entsprechend anpassen. Und für mich gehört das oberste nav in den obersten header, wenn es nicht aus besonderen Gründen Teil von main ist. (Die meisten Hauptnavigationen sind nicht der Hauptinhalt, auf Portal- und Übersichtsseiten kann das natürlich der Fall sein.)  
  

> Beim ersten Beispiel definiere ich die Seitenüberschrift als zugehörig zum main-Bereich  
  
Das main-Element [erzeugt keine Section](http://www.w3.org/TR/html5/grouping-content.html#the-main-element). Der Outline ist also derselbe. Diese Zugehörigkeit gibt es natürlich im entstehenden DOM, aber nicht aus Sicht der HTML5-Sectioning-Logik.  
  
Mathias

-- 
[Chaplin.js - JavaScript application architecture on top of Backbone.js](http://chaplinjs.org/)