web-dev-qa-db-ja.com

hreflangをHTMLの本文に配置できますか？

hreflangをHTMLのbodyに配置できますか？それともheadにあるべきですか？

これに関する明確な情報が見つかりません。

html5hreflang
3
Adrian Godoy

Googleがサポートするもの：

<link rel="alternate" href="#" hreflang="en-ie" />ではなく<body>内で<head>を使用すると、W3Cバリデーターでのテストが失敗し、以下が報告されます。

W3C

リンク要素にitemprop属性があるか、値にdns-prefetch、pingback、preconnect、prefetch、preload、prerender、またはstylesheetが含まれるrel属性がない限り、link要素はbody要素の子孫として表示してはいけません

Rob と Boldewyn で、hreflangは<a>内で使用できることが、これらのタグは本文内で許可されているため、言及されています。しかし、これは事実であり、両方のユーザーが良い点を指摘しています...

<a>内でhreflangを使用すると非常に複雑になる可能性があり、Googleでサポートされているかどうか不明です：

  1. ページへのすべてのリンクでマークアップを使用する必要があるため、相互にリンクする多数の記事がある場合、2つ以上の言語オプションがあると、複雑になり、非常に複雑になる可能性があります。リンクではなくマークアップをページに追加するのは、GET URLを実行し、その変数を標準的なリンク、リンクhreflang、Facebookオープングラフ、Twitterカードなどに埋め込むだけなので、それほど複雑ではありません。
  2. ただし、主な問題は、GoogleのSearch Consoleヘルプが複数の言語に<a>を使用することについて何も言及していないことです。これは、サポートされていないとは言えません。

Google特有のサポートによると：

ヘッダーのHTMLリンク要素。 http://www.example.com/のHTMLセクションで、次のようにhttp://es.example.com/にあるそのWebページのスペイン語版を指すリンク要素を追加します。

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

HTTPヘッダー。非HTMLファイル（PDFなど）を公開する場合、HTTPヘッダーを使用して、URLの異なる言語バージョンを示すことができます。

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

Link HTTPヘッダーに複数のhreflang値を指定するには、次のように値をコンマで区切ります。

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

サイトマップ。マークアップを使用する代わりに、サイトマップで言語バージョン情報を送信できます。

W3Cバリデータ を使用して、進行中のMARKUPを確認することをお勧めします。たとえば、この直接入力コードを使用します：

<!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

いいえ

<body>セクションで許可されるLink要素は、「body-ok」リストで指定されている要素のみです。この表のコピーはこちらで見つけることができます： https://www.w3.org/TR/html5/links.html#body-ok

2
L Martin

<link> 要素と <a> 要素の両方の属性としてhreflangを排他的に使用できます。簡単に言えば、いいえ、hreflangを<body>に置くことで短絡することはできません（たとえば、相対URLに<base>を使用する場合と同様）。

検索エンジンの代替言語バージョンを参照するページヘッダーの例：

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

ユーザーがクリックできるページ本文の例：

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