web-dev-qa-db-fra.com

Hreflang peut-il être placé sur le corps du code HTML?

Est-ce que hreflang peut être placé sur le body du code HTML? Ou doit-il être dans la head?

Je ne trouve pas d'informations claires à ce sujet.

html5hreflang
3
Adrian Godoy

Google prend en charge:

Utiliser <link rel="alternate" href="#" hreflang="en-ie" /> dans <body> et non pas <head>, le tester dans le validateur W3C échoue et indique les éléments suivants:

W3C

Un élément de lien ne doit pas apparaître en tant que descendant d'un élément de corps, sauf si l'élément de lien a un attribut itemprop ou un attribut rel dont la valeur contient dns-prefetch, pingback, preconnect, prefetch, préchargement, prérender ou feuille de style.

Il a été mentionné par Rob et Boldewyn , tant dans les réponses que dans les commentaires, que hreflang peut être utilisé dans un <a>, car ces balises sont autorisées dans le corps. Cela est vrai et les deux utilisateurs font de bons points, cependant ...

Il peut être très complexe d'utiliser hreflang dans <a> et il est difficile de savoir s'il est pris en charge par Google:

  1. Vous devez faire en sorte que tous les liens vers la page utilisent le balisage. Ainsi, si vous avez plusieurs articles qui s'interconnectent, cela peut devenir complexe, voire très complexe, si vous avez plus de 2 options de langue. L'ajout de balises à la page plutôt que de liens est moins complexe car vous devez simplement créer une URL GET et insérer cette variable dans un lien canonique, un lien hreflang, un graphique Facebook, des cartes Twitter, etc.
  2. Le problème principal est toutefois que l’aide de la console de recherche de Google ne mentionne rien d’utiliser <a> pour plusieurs langues, cela ne veut pas dire que ce n’est pas pris en charge, c’est juste que je peux le dire avec certitude.

Google précise qu'il prend en charge:

Élément de lien HTML dans l'en-tête. Dans la section HTML de http://www.example.com/, ajoutez un élément de lien pointant vers la version espagnole de cette page Web sous http://es.example.com/, comme ceci:

<link rel="alternate" hreflang="es" href="http://es.example.com/" />

En-tête HTTP. Si vous publiez des fichiers non HTML (tels que des PDF), vous pouvez utiliser un en-tête HTTP pour indiquer une version linguistique différente d'une URL:

<http://es.example.com/>; rel="alternate"; hreflang="es"

Pour spécifier plusieurs valeurs hreflang dans un en-tête HTTP Link, séparez les valeurs par des virgules comme suit:

<http://es.example.com/>; rel="alternate"; hreflang="es">, <http://de.example.com/>; rel="alternate"; hreflang="de">

Plan du site. Au lieu d'utiliser du balisage, vous pouvez soumettre des informations sur la version linguistique dans un sitemap.

Je vous recommande de vérifier que votre MARKUP est en cours d'utilisation à l'aide de validateur W3C , par exemple à l'aide de ce code de saisie directe: 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Simon Hayter Rocks!</title>
    <link rel="stylesheet" href="example.css">
    <script src="example.js"></script>
  </head>
  <body>
    <link rel="alternate" href="http://example.com/en-ie" hreflang="en-ie" />
  </body>
</html>
4
Simon Hayter

Non.

Les seuls éléments de lien autorisés dans la section <body> sont ceux qui sont spécifiés dans la liste 'body-ok'. Vous pouvez trouver une copie du tableau ici: https://www.w3.org/TR/html5/links.html#body-ok

2
L Martin

Vous pouvez utiliser hreflang comme attribut sur les deux éléments <link> et <a> exclusivement. Donc, en un mot, non, vous ne pouvez pas court-circuiter en plaçant hreflang sur le _<body>_ (comme vous pourriez, par exemple, avec _<base>_ pour les URL relatives).

Exemple dans l’en-tête de la page, faisant référence à une autre version linguistique pour les moteurs de recherche:

_<head>
  <link rel="alternate" href="?lang=en" hreflang="en">
</head>
_

Exemple dans le corps de la page, sur lequel les utilisateurs peuvent cliquer:

_<body>
  <a rel="alternate" href="?lang=en" hreflang="en">View this information in English</a>
</body>
_
1
Boldewyn