5568 sujets

Sémantique web et HTML

Taille h1 en mode texte plus petit que h2

Bonjour,

est-ce normal qu'en désactivant le CSS sur un de mes sites en production (en html5), les titres h1 apparaissent plus petits que les h2 ? (testé sur Firefox et chrome)

Voici à quoi ressemble mon code :

<section><article>
<header><h1>Mon titre</h1></header>
<p>Un paragraphe</p>
<h2>Un sous titre</h2>
</article></section>


et voici le résultat :

upload/2750-h1.jpg
Modifié par Newzic (15 Mar 2012 - 17:18)
Modérateur
Bonjour,

Il s'agit des styles par défaut du navigateur pour les h1, h2, h3... se trouvant dans section et article. Avec Firebug, tu peux inspecter un élément et voir les règles CSS par défaut qui s'appliquent.
Modifié par Tony Monast (15 Mar 2012 - 18:46)
ok, je pensais que j'avais mal fait une imbrication ou quelque chose dans le genre.
Curieux de mettre un grand titre moins évident qu'un sous titre mais bon, j'imagine qu'il y a une explication sémantique (et scientifique !) pour le différencier d'un titre h1 qui serait en dehors d'une section/article.
Modifié par Newzic (15 Mar 2012 - 18:49)
C’est juste que dans l'absolu les navigateurs devraient avoir des styles équivalents pour les H2, H3, H4, H5 et H6. Pas juste pour les H1.

Idéalement ton H1 et ton H3 qui sont au 3e niveau de profondeur (body>section>article) devraient être deux crans plus petit qu'un H1 et un H2 au 1er niveau de profondeur (body), et donc peut-être ressembler à des H3 et H4 de 1er niveau.

Ouais c'est le bordel ce truc.
Modérateur
Ce qui veut dire que sémantiquement, on aurait 6 niveau de titrage par profondeur ???
trois niveaux de profondeur = 18 titres ??? On a déjà de la peine à comprendre visuellement une hiérarchie à partir de 3-4 niveaux de titrages.

Et si on suit ce raisonnement, on devrait donc utiliser des h1 dans chaque profondeur, et ensuite des h2 si éventuellement on a un second titrage à la même profondeur?

heureusement que je n'ai pas de latin à perdre!
Hello.

Pour styler les titres en respectant l'outline, il y a HTML5 titles inception, basé sur Sass / Less.

Il me semblait qu'il y avait une spec pour un nouveau sélecteur (:heading de tête), mais je n'arrive plus à mettre la main dessus.
Modérateur
Ok on n'a pas 35000 niveaux de titrages mais par contre:

On peut utiliser que des h1 pour les différents niveaux de titrages, si on construit bien notre bazar, j'avais deviné juste, merci. Intéressants ces implémentations js mais j'aime pas trop le js pour «aller plus vite que la musique»
Sujet clos
Aller à