web-dev-qa-db-fra.com

Où tracez-vous la ligne avec les nouveaux éléments html5

J'ai lu cet article http://diveintohtml5.org/semantics.html#new-elements sur les différents nouveaux éléments en html5. Maintenant, je veux créer mon nouveau portefeuille avec le nouveau balisage. Il est très important pour moi que le contenu soit indexé le mieux possible par les robots d'exploration et donne en même temps un exemple de la manière dont HTML5 devrait être écrit.

Remarque: ceci est juste un exemple, je ne le fais pas vraiment

Disons que j'ai une page pour mes compétences. Normalement j'aurais quelque chose comme ça:

<div><!-- header -->
  <ul id="menu">the menu</ul>
  <h1>My Skills</h1>
</div>

<div><!-- content 1 -->
  <h2>html</h2>
  <p>tell the people about the html skills</p>
</div>
<div><!-- content 2 -->
  <h2>css</h2>
  <p>tell the people about the css skills</p>
</div>

<div><!-- footer -->
  <p>some footer text</p>
</div>

Assez basique. Alors, jusqu'où allez-vous cela en HTML5? Je peux voir que l'en-tête, la section, le nav et le pied de page sont importants, mais que faites-vous à l'intérieur? Allez-vous tout le chemin?

<header><!-- header -->
  <nav>the menu</nav>
  <h1>My Skills</h1>
</header>

<section><!-- content 1 -->
  <header>
    <h2>css</h2>
  </header>
  <section>
    <p>tell the people about the css skills</p>
  </section>
</section>

<section><!-- content 2 -->
  <header>
    <h2>css</h2>
  </header>
  <section>
    <p>tell the people about the css skills</p>
  </section>
</section>

<footer><!-- footer -->
  <p>some footer text</p>
</footer>

Avez-vous besoin d'éléments intérieurs pour un si petit exemple? Si non, quand utilisez-vous les éléments intérieurs?

6
Saif Bechan

Je recommande de lire l'article de Smashing Magazine " HTML5 et l'algorithme de définition de document " Vous trouverez des explications détaillées sur la façon de structurer votre code HTML.

5
Osvaldo