用語集 › 🕸️ Web › hreflang
【エイチレフラング】

hreflang とは？

💡 「この日本語ページと英語ページは同じ内容ですよ」と検索エンジンに通訳するタグ
📌 このページのポイント
hreflang — 多言語ページの対応関係 🇯🇵 日本語版 example.com/ja/ hreflang="ja" 日本のユーザーに表示 🇺🇸 英語版 example.com/en/ hreflang="en" 米国のユーザーに表示 🇨🇳 中国語版 example.com/zh/ hreflang="zh" 中国のユーザーに表示 🔍 Google 検索エンジン ユーザーの言語・地域に合わせて 適切な言語バージョンを検索結果に表示
hreflangによる多言語ページの対応関係
ひよこ ひよこ

hreflangって何のために使うの？

ペンギン先生 ペンギン先生

たとえば日本語版と英語版の両方があるサイトで、日本にいる人がGoogleで検索したら日本語版が表示されて、アメリカにいる人には英語版が表示される、という振り分けをするためのタグだよ。hreflangがないと、検索エンジンは重複コンテンツと判断してしまうこともあるんだ

ひよこ ひよこ

どうやって書くの？

ペンギン先生 ペンギン先生

HTMLのhead内に `URL">` `URL">` のように書くよ。言語コード（ja、en）やリージョンコード（en-US、en-GB）を使って、どの言語・地域向けかを指定するんだ

ひよこ ひよこ

canonicalタグとは何が違うの？

ペンギン先生 ペンギン先生

canonicalは「同じ言語の重複ページのうち正規はどれか」を示すもので、hreflangは「異なる言語の対応ページ」を示すものだよ。多言語サイトでは両方を組み合わせて使うことが多いね。各言語版のcanonicalは自分自身を指し、hreflangで他の言語版との対応関係を示すのが正しい設定だよ

ひよこ ひよこ

設定で失敗しやすいポイントってあるの？

ペンギン先生 ペンギン先生

一番多いのが「片方向のみの指定」だね。日本語ページから英語ページへのhreflangを書いたら、英語ページからも日本語ページへのhreflangを書かないとGoogleは無視するんだ。あとは `x-default` という「デフォルト版」の指定を忘れるケースも多いよ。ページ数が多いサイトではサイトマップで管理するのがおすすめだね

ペンギン
まとめ：ざっくりこれだけ覚えればOK！
「hreflang」って出てきたら「多言語サイトで正しい言語のページを検索結果に出すための指定」と思えればだいたいOK！
📖 おまけ：英語の意味
「hreflang attribute」 ＝ リンク先の言語属性
💬 「href（ハイパーリファレンス＝リンク先）」+「lang（language＝言語）」の組み合わせだよ。リンク先がどの言語なのかを示す属性という意味だね
🔗 あわせて読みたい
← 用語集にもどる