web-dev-qa-db-fra.com

Peut-on utiliser plusieurs balises h1 sur la même page, mais leur donner un style différent?

J'ai une page Web que j'utilise plusieurs fois les balises h1 au sein de divers DIV et le style h1 pour chaque div est de la taille appropriée.

Par exemple...

#content h1 {
  font-size:22px;
}

#left-nav h1 {
  font-size:14px;
}

#content .recent-news h1 {
  font-size:16px;
}

Est-ce que ça va? Je suis inquiet pour le référencement.

Quelle est la meilleure manière de s'occuper de ça? Ou suis-je inquiet pour rien?

43
Brad

À mon avis, vous n'avez pas à vous inquiéter, vous pouvez le faire comme ça.

H1 désigne une partie de votre contenu comme étant un en-tête de premier niveau. Donc, si vous avez un titre de premier niveau dans votre div de navigation (par exemple, <H1>Navigation Menu</H1>), cela devrait bien sûr être #nav h1.

Si vous devez avoir plusieurs H1 dans votre contenu, cela dépend: Si vous avez un blog et que chaque entrée a son propre en-tête, il s'agira de H1. Toutefois, si votre blog comporte lui-même un en-tête (par exemple, <H1>My Blog!</H1>), l'en-tête de l'entrée de blog doit être un H2. 

Mais ce n'est que de la théorie. Optez pour ce qui est lisible, le balisage sémantique. Vous pouvez le décider en regardant votre code HTML et en vous demandant: «Est-ce lisible? La lisibilité serait-elle améliorée si je le faisais dans l'autre sens? La réponse variera d'un projet à l'autre.

10
Treb

Matt Cutts de Google a répondu à Plus d'un H1 sur une page: bon ou mauvais? (5 mars 2009) avec:

Eh bien, s’il existe une raison logique d’avoir plusieurs sections, ce n’est pas trop , Vous connaissez plusieurs h1s. Je ferais attention à En faire trop. Si votre page entière est h1, cela a l'air joli Creti, Non? Donc, ne faites pas tous les h1 et ensuite, CSS pour faire en sorte que le texte ressemble à Car nous voyons des gens, qui sont des concurrents, se plaindre de Que si les utilisateurs désactivent CSS ou le CSS ne le fait t charge, il semble vraiment mauvais. Donc, vous savez, il est correct d'avoir un peu de h1 ici Et ensuite peut-être qu'il y a deux sections sur une page, et donc peut-être d'avoir un Peu de h1 ici.

Mais vous devriez vraiment l’utiliser pour les en-têtes ou les en-têtes, ce qui est l’intention de . Ne pas simplement jeter h1 partout où vous le pouvez sur une page. Parce que je peux vous le dire, si vous mettez simplement h1 sur une page, Des gens ont essayé d'abuser de cela et nos algorithmes essaient de tenez compte de cela afin que cela ne vous fasse pas vraiment du bien. Je voudrais donc L’utiliser là où cela a du sens et avec plus de parcimonie, mais vous pouvez l’utiliser plusieurs fois.

27
Joel

Rappelez-vous simplement que vos h1 sont utilisés pour indiquer le contexte, pas la mise en page. Il n'y a donc rien de mal à en avoir plusieurs sur une page.

Dans cet exemple spécifique, vous devez décider si vos h1 de navigation de gauche ont la même importance contextuelle que vos h1 de contenu et vos h1 de nouvelles récentes. Si une hiérarchie claire existe dans votre esprit, utilisez vos balises d’entête pour la démontrer.

14
Yes - that Jake.

En général, vous ne devriez avoir qu'un h1 par page, et ce h1 devrait représenter succinctement le contenu de cette page. Tant que vous souhaitez styler avec CSS, recherchez le niveau de titre (h2, h3, h4, etc.) qui représente correctement les titres que vous souhaitez utiliser, puis modifiez-les à la place.

10
sykora

Sémantiquement, je préfère utiliser un h1 sur la page, principalement pour le titre de la page. Cela n'a probablement pas beaucoup d'importance avec le référencement, et avec la manière dont le HTML fonctionne avec HTML5, la balise générique header le rendra beaucoup plus simple et cet argument obsolète.

3
ern

Je n'aime pas l'idée de plusieurs H1s. H1 est l’en-tête le plus important et la page traitera essentiellement de ce sujet. Si vous avez un deuxième sujet tout aussi important, ne le mettez pas dans une autre balise H1, mais simplement dans une autre page. Cela mérite ça, non?

1
aalaap

J'essaie d'avoir un seul H1 sur la page et de l'avoir presque mais légèrement réorganisé à partir du contenu de la balise de titre/H1 est l'idée principale d'une page individuelle; tout le reste devrait être une balise h2 et Lower ... . 

0
Tab Petree

Si c’est en ce qui concerne le référencement, il est préférable d’utiliser les balises h1. Si vous souhaitez l’utiliser uniquement dans un but précis, utilisez les feuilles de style CSS. 

Le plus important est que: Si plus d'une balise h1 est utilisée dans une page Web, Google peut considérer cette page comme un spam. utilisation peut utiliser d’autres balises de titre que h1 comme h2 h3 h4 h5 h6 n’importe quel nombre de fois.

0
seo header tags

En essayant de répondre à la même question, j'ai posté cette question qui peut contenir des informations utiles. Mon souci avec l’utilisation des mêmes H1, H2, H3 dans différents endroits est que, sauf si vous spécifiez TOUJOURS un style 'parent' comme dans votre exemple *, vous pouvez alors rencontrer des problèmes.

Dilemme pour décider de la création de CSS Pour H1, H2, H3, etc.

* C’est pour dire que vous ne définissez jamais «h1» par lui-même

0
Simon_Weaver

Tout dépend un peu de ce que votre doctype est. Avec html5, vous pouvez utiliser plusieurs tags h1 par section. (ne pas lire, par <section></section>!) Lors de l'utilisation de l'exemple XHTML 1.0 Transitionaldoctype, il serait préférable d'éviter d'utiliser plusieurs balises h1 sur une seule page.

Lors de l'utilisation de l'exemple XHTML 1.0 Transitionaldoctype, je choisirais souvent quelque chose comme ceci:

  • h1: max. une fois par page
  • h2: max. deux fois par page
  • etc.

Aussi @joel, même si votre réponse est OK, n'essayez pas de confondre qui que ce soit ... Je peux dire que je suis un ingénieur logiciel Google, car je travaille tout simplement avec Google (pas avec la société, mais avec le produit). ET je suis un ingénieur ... Veuillez indiquer le nom de votre entreprise ET toutes les certifications lorsque vous déclarez des choses.

0
user1139291

Je pense que sa bonne pratique en matière de référencement consiste à placer une balise H1 en haut de chaque élément de bloc sur ma page, mais c’est juste pour moi. Bien entendu, cette balise H1 doit contenir des informations relatives aux mots-clés/sujets que vous ciblez.

C’est une méthode de référencement très efficace que j’ai trouvée. Les personnes qui vous disent de ne pas le faire essaient de vous empêcher de participer à nos gains.

0
Charles Addis