web-dev-qa-db-fra.com

Balise d'ancrage à l'intérieur de <h1> ou <h1> à l'intérieur de la balise d'ancrage: quel est le meilleur?

J'essaie d'utiliser les balises <h1> sur mon blog pour le titre de l'article et j'ai rencontré un problème. Le titre est en hyperlien.

Cas 1:

<h1> <a href=""> xyz </a> </h1>

cas 2:

<a href=""> <h1> xyz</h1> </a> 

Lequel est le meilleur en termes de référencement?

52
Sangram

Si vous utilisez HTML5, choisissez-en un; ils sont équivalents.
HTML5 autorise liens de niveau bloc , mais dans votre cas, il n’ya aucune raison particulière de le faire, puisqu’il n’ya qu’un seul élément de niveau bloc. Personnellement, je ne le ferais pas ici, car avoir la balise <h1> à l'extérieur faciliterait l'analyse du code source.

Tout le reste (XHTML, HTML4, etc.) et le second est tout simplement faux. Il ne s'agirait pas d'un code valide, ni d'un point de vue défavorable pour l'optimisation de votre recherche [insérer un avis de non-responsabilité standard indiquant à quel point une infraction unique affecte réellement quoi que ce soit, etc.].

56
Su'

Ils sont les mêmes en ce qui concerne le référencement. (Généralement, les éléments de niveau bloc contiennent des éléments en ligne et non l'inverse, vous devez donc utiliser le premier exemple, mais cela n'affectera pas le référencement).

11
John Conde

Ils sont tous les deux corrects en html5 , le html permet de bloquer des éléments dans des éléments en ligne. Cela n'a pas non plus d'effet sur le référencement, dans les deux cas, le texte est placé dans l'en-tête, il doit donc avoir la même valeur.

Ce n'est pas un choix de validité, mais une préférence dans l'interface utilisateur:

  • Si vous enroulez l'en-tête autour de l'ancre, vous créez une grande ancre, seul le texte sera cliquable.
  • Lorsque vous enroulez l'ancre autour de l'en-tête, toute la ligne devient cliquable.

Je t'ai donné l'exemple sur jsFiddle.net

6
Martijn

Je trouve qu'avec le cas 2 l'insertion href est souvent en décalage par rapport au reste de ma page. Mais c’est peut-être ainsi que j’ai défini mes marges dans mon .css. Je suis donc favorable au cas 1.

4
Guy Thomas

Ce que l’on dit ici, c’est perspicace, merci à tous. Reprenons un peu plus loin: l’ajout de microdonnées et autres dans l’équation.

Disons que nous avons

<h1 itemprop="name"><a href="http://goldenage.com/maths.html"
itemprop="url">Mathematics in The Muslim Golden Age</a></h1>

en concurrence avec

<a href="http://goldenage.com/maths.html" itemprop="url"><h1
itemprop="name">Mathematics in The Muslim Golden Age</h1></a>

Pour moi, "quelle que soit la performance", l'exemple 2 a plus de sens. Parce que le lien ne fait jamais partie du nom. La différence se résume à la différence entre innerHTML et textContent, DOMwise. En le regardant à travers innerHTML, l'ancre se met en travers du chemin. Si textContent était le moyen, les balises seraient supprimées. Cela pose donc également la question: innerHTML ou textContent.

Je dirais donc, en tenant compte des microdonnées, que l’ancre à l’extérieur est plus pure.

basé sur: http://thenewcode.com/617/How-To-Add-Microdata-To-Your-Blog

1
Sjerp van Wouden

Les liens au niveau des blocs doivent être évités à des fins de référencement - de la bouche du cheval: https://www.seroundtable.com/block-level-links-google-seo-16369.html

Mise à jour: À emporter du lien ...

Avoir l’une ou l’autre construction, comme d’autres l’ont dit, est très bien pour la liaison. Toutefois, à des fins de référencement, vous devez garder le texte de l'ancre propre afin que Google puisse mieux interpréter l'ancre et lui attribuer la pertinence appropriée.

John Mueller (analyste des tendances pour les webmasters chez Google) ajoute ...

Cette utilisation nous conviendrait (Google) - nous aurions toujours le lien et pourrions associer votre texte à une ancre. Nous sommes assez flexibles avec l'analyse HTML, vous pouvez donc probablement même l'utiliser avec HTML4. Cela dit, plus votre texte d'ancrage est clair, plus il nous est facile de comprendre le contexte du lien. Par conséquent, je n'utiliserais pas toujours un paragraphe entier comme ancre pour tous vos liens internes.

TL; DR Pour le référencement, n'utilisez pas de lien de niveau bloc.

0
Adders

<h1> <a href=""> xyz </a> </h1> Cet exemple est correct.

0
rakonda