5568 sujets

Sémantique web et HTML

<section> et <h1> systématique

Salut.

Je suis de retour avec mes questions métaphysiques sur la sémantique HTML5

Si j’ai bien compris, une <section> ou <article> de page doit remettre les compteurs à zéro pour les <hn>. Je trouve cela assez logique dans le cadre d’un blog ou d’une page regroupant une suite d’articles ou de sections indépendants (chaque section étant indépendante [et potentiellement extractible] elle doit comporter son titre de 1er niveau). Par contre, pour une page web plus "oldschool" ne contenant qu’un article complet avec des niveaux et des sous niveaux cela m’emmer… heu m’embête. En effet, je ne vois que 2 options qui ne me convainquent ni l’une ni l’autre :
1. rester à l’ancienne à l’intérieur de l’<article> : pas de section, que des niveaux en <hn>, style :

<article>
     <h1>…
     <p id="intro">…
     <h2>…
     <h3>…
     <p>…
     <h2>…
     <h3>…
     <p>…
</article>

-> la balise <section> qui me plait bien sémantiquement pour segmenter le contenu ne peut pas servir.
2. on se sert de <section> mais les niveaux de titre deviennent n’importe quoi, remis à zéro à tout-bout-de-champ !

<article>
     <h1>…
     <p id="intro">…
     <section>
          <h1>…
          <h2>…
          <p>…
     </section>
     <section>
          <h1>…
          <h2>…
          <p>…
     </section>
</article>


Quel est votre avis sur la question ?
Bonjour,

Derwoed a écrit :
Quel est votre avis sur la question ?

Que tu peux faire l'un ou l'autre ou même un troisième:
<article>
    <h1>…
    <p id="intro">…
    <section>
        <h1>…
        <section>
            <h1>…
            <p>…
        </section>
    </section>
    <section>
        <h1>…
        <section>
            <h1>…
            <p>…
        </section>
    </section>
</article>


... et que comme par ailleurs les moteurs de recherche et lecteurs d'écran n'exploitent pas forcément bien les H1 partout, et que c'est un peu prise de tête à faire juste pour structurer le contenu d'un article, j'éviterais et je resterais à la première solution.
fvsch a écrit :
Bonjour,

... et que comme par ailleurs les moteurs de recherche et lecteurs d'écran n'exploitent pas forcément bien les H1 partout, et que c'est un peu prise de tête à faire juste pour structurer le contenu d'un article, j'éviterais et je resterais à la première solution.


C’est ce que j’avais commencer à faire au final. Par contre, confirmes-tu que :

<article>
    <h1>…
    <p id="intro">…
    <section>
        <h2>…
        <section>
            <h3>…
            <p>…
        </section>
    </section>
    <section>
        <h2>…
        <section>
            <h3>…
            <p>…
        </section>
    </section>
</article>


n’est pas valide ?
Derwoed a écrit :
Par contre, confirmes-tu que [...] n’est pas valide ?

Si, d'une part c'est valide, et d'autre part ça donnera exactement le même plan de document (pour un User Agent HTML5) que la même chose avec des H1 à la place des H2 et H3.

Sur le sujet: http://html5doctor.com/outlines/
Bonjour,
Je passe ici bien après la bataille, mais je cherchais une réponse à un problème un peu similaire, sur l' utilisation de ces nouvelles balises introduites depuis html5.
Néanmoins, la question relative au sujet est : il m'a semblé lire (je ne retrouve plus mes sources, sorry) qu'il était souhaitable de ne pas avoir de "section" à l'interieur de balises "article", mais plutôt l'inverse. En tout cas en terme de SEO.
Confirmez-vous ?

(Je vais ouvrir un nouveau sujet sur une petite question sur les titres h1 dans ces balises section, ou article)

Merci pour vos réponses.
Cdlt. Smiley smile
Je sais que ce n'est pas la question, mais j'aimerais tout de même récapituler l'impact global des balises HTML5 en production :

- SEO : nul
- Accessibilité : négatif
- Performances : négatif (besoin d'un shim sous IE<9)

Donc à part dans des cas spécifiques comme une web app pour smartphones par exemple, je ne suis pas sûr qu'il soit bénéfique de s'arracher les cheveux à essayer d'être sémantique "html5".

a écrit :
Dans le doute, mets une div.

Modifié par Kaelig (26 Jan 2013 - 22:37)
Kaelig a écrit :
Je sais que ce n'est pas la question, mais j'aimerais tout de même récapituler l'impact global des balises HTML5 en production :

- SEO : nul
- Accessibilité : négatif
- Performances : négatif (besoin d'un shim sous IE<9)

Donc à part dans des cas spécifiques comme une web app pour smartphones par exemple, je ne suis pas sûr qu'il soit bénéfique de s'arracher les cheveux à essayer d'être sémantique "html5".


Si j'ai bien compris vous conseillez de limiter le html5 pour les smartphones.
Pouvez-vous détailler?

Votre avis m'intéresse car je n'ai pas envie de me décarcasser inutilement.
Kaelig a écrit :
- Accessibilité : négatif


Je dirais plutôt neutre. Je ne crois pas avoir lu quelque part qu'elles bloquaient l'accès au site à certaines personnes. Smiley smile

De plus, on peut ajouter des landmarks aria pour définir les zones de la page : contenu principal, banner, contentinfo, etc.

Conclusion : la sémantique html5, c'est bon mangez-en.
Sujet clos
Aller à