hreflang とは
- ここで説明する hreflang とは次の語句からなる HTML 要素の属性です。
- hypertext
- 読み: ハイパーテキスト
意味: コンピューターを利用した文書作成、及び閲覧システムの 1 つで、複数の文書を相互に関連付け、結び付ける仕組み。 - reference
- 読み: リファレンス
意味: 参考、参照、照合 - language
- 読み: ランゲージ
意味: 言語、言葉
hreflang 属性の概要
この属性は、リンク先ページの言語を表します。
例えば、同じサイト内に多言語に翻訳されたページがあるとします。 英語版、中国語版、韓国語版など複数の言語に翻訳されているページがあることは利用者にとって有益です。
上記ように多言語のページがある場合、おそらく検索エンジンは利用者にとって適した言語のページに導くようにするでしょう。 検索エンジンの利便性の助けとなりうる情報の 1つが、この hreflang だと言えます。
もしも、この属性の情報が不足していたとしたら、 検索エンジンはこのページのリンク先には同じ言語で書かれた情報しかないと判断するかも知れません。
しかし、この属性の情報を含めておけば、利用者にマッチした言語のページに導く精度が上がる可能性もあるでしょう。
この属性はグローバル属性の lang 属性と仕様は変わりませんが、 主に a 要素や link 要素の 属性として使用することで、リンク先のファイルやディレクトリの言語を明示することができます。
サンプルコード
サンプルコード: HTML
<head>
<link rel="alternate" hreflang="ja" href="https://example.com/ja/">
<link rel="alternate" hreflang="en" href="https://example.com/en/">
</head>
<body>
<a hreflang="ja" href="https://example.com/ja/index.php">日本語トップページ</a>
<a hreflang="en" href="https://example.com/en/index.php">英語トップページ</a>
</body>