En HTML5, devrait être la navigation principale à l’intérieur ou l’extérieur le <header>élément ?</header>

Question

En HTML5, je sais qu' <nav> peut être utilisé soit à l'intérieur ou à l'extérieur de la page de tête de mât <header> élément. Pour les sites web ayant à la fois secondaire et principale de navigation, il semble de bon d'inclure la barre de navigation secondaire en tant que <nav> élément à l'intérieur de la tête de mât <header> élément principal de la navigation, en <nav> élément à l'extérieur de la tête de mât <header> élément. Cependant, si le site manque une barre de navigation secondaire, il semble commune à inclure la barre de navigation principale en <nav> élément à l'intérieur de la tête de mât <header> élément.

Si je suivre ces exemples, mon contenu, la structure sera basée sur l'inclusion ou l'exclusion de la navigation secondaire. Cela introduit un couplage entre le contenu et le style qui se sent inutile et contre-nature.

Est-il une meilleure façon de sorte que je ne suis pas le déplacement de la barre de navigation principale de l'intérieur vers l'extérieur de la tête de mât <header> élément basée sur l'inclusion ou l'exclusion de la navigation secondaire?

Principale et Secondaire de Navigation Exemple

<header>
    <nav>
        <!-- Secondary Navigation inside <header> -->
        <ul>
            <li></li>
        </ul>
    </nav>
    <hgroup>
        <h1>Website Title</h1>
    </hgroup>
</header>
<nav>
    <!-- Main Navigation outside <header> -->
    <ul>
        <li></li>
    </ul>
</nav>

OnlineDegrees.org est un exemple de site qui suit le schéma ci-dessus.

Principal Navigation Uniquement Exemple

<header>
    <hgroup>
        <h1>Website Title</h1>
    </hgroup>
    <nav>
        <!-- Main Navigation inside <header> -->
        <ul>
            <li></li>
        </ul>
    </nav>
</header>

Keyzo.co.royaume-uni est un exemple de site qui suit le schéma ci-dessus.

Extraits de l'Introduction à HTML5 - Ajouté le 02-Févr-11, 7:38 AM

L'introduction de HTML5 par Bruce Lawson et Remy Sharp a ceci à dire sur le sujet:

L'en-tête peut également contenir de navigation. Cela peut être très utile pour la navigation dans le site, en particulier sur le modèle axé sur les sites où l'ensemble de l' <header> élément pourrait venir à partir d'un fichier de modèle.

Bien sûr, il n'est pas nécessaire que l' <nav> être dans l' <header>.

Si dépend en grande partie sur si vous croyez que la navigation dans le site appartient à l'échelle du site d'en-tête et aussi des considérations pragmatiques de la facilité de coiffage.

Basé sur cette dernière phrase, il semble que Bruce Lawson-auteur du chapitre, ces extraits sont tirés de-admet que "des considérations pragmatiques sur la facilité du style" le rendement d'un couplage entre le contenu et le style.

Answer 1

C’est complètement à vous. Vous pouvez soit les mettre dans l’en-tête ou non, tant que les éléments en leur sein sont seulement des éléments de navigation interne (c'est-à-dire ne lien vers des sites externes tel qu’un compte twitter ou facebook) alors c’est bien.

Ils ont tendance à obtenir placée dans un en-tête simplement car qui est où va de navigation souvent, mais c’est pas défini dans la pierre.

Vous pouvez en savoir plus à ce sujet à HTML5 médecin.

Answer 2

C'est un peu difficile de savoir si vous allez avoir un avis, par exemple. "il est commun de faire xxx" ou une règle, je vais donc me pencher dans la direction de règles.

Les exemples que vous citez semblent sur la base des exemples dans la spec pour l'élément nav. Rappelez-vous que les spécifications ne cesse modifié et les règles sont parfois complexes, donc je me risquerais de nombreuses personnes ont tendance à simplement faire ce qui est donné, plutôt que de les interpréter. Vous êtes montrant deux distincts des exemples avec différents comportements, il ya seulement tellement que vous pouvez lire en elle. Ne soit de ces sites ont également de la partie adverse sous/nav situation, et si oui, comment font-ils face?

Plus important encore, cependant, il n'y a rien dans la spec de dire l'un est la façon de le faire. L'un des buts avec HTML5 a été d'être très clair[ce à des fins de comparaison] à propos de la sémantique, les exigences, etc. si l'omission est intéressant de noter. Aussi loin que je peux voir, les exemples sont indépendants les uns des autres et tout aussi valable à l'intérieur de leur propre contexte de travail de mise en page, etc.

Ayant de la valeur liquidative de la position de la source conditionnelles est un peu idiot(un autre drapeau rouge). Il suffit de choisir une méthode et aller avec elle.