hreflang:言語別・国別ページを正しく設定する方法

要点: hreflangは、検索ユーザーごとにどの言語・国向けのページを表示するかをGoogleに伝えるものです。各バージョンは、自分自身を含むすべてのバージョンを、ISO 639-1の言語コードと、任意のISO 3166-1 alpha-2の地域コード(en、de、en-GB、pt-BR)で列挙し、任意でx-defaultのフォールバックも指定します。リンクは絶対URLで、かつ双方向に張る必要があり、そうでなければGoogleは無視します。各バージョンには自己参照のcanonicalが必要で、別言語を指すcanonicalは設定を無効にしてしまいます。Googleはページの言語をコンテンツから判断するため、翻訳そのものも本物でなければなりません。

多言語・多国展開のサイトは、気づかないうちにトラフィックを失います。ドイツで英語ページが上位表示される、メキシコ向けページを作ったのにスペイン向けページが表示される、米国のユーザーにポンド表記の英国ストアが表示される、といった具合です。サイトに不具合はなく、Googleがどのバージョンを表示するかを推測しただけです。その推測をやめさせるのがhreflangです。

このガイドでは、Googleのドキュメントに基づくhreflangの仕組み、多くのサイトがつまずくコードのルール、canonicalとの関係、無料のhreflangチェッカーが検査する内容、各問題の修正方法を説明します。

hreflangができること・できないこと

hreflangのアノテーションは、互いに別バージョンであるページの集合(同じコンテンツの別言語版、または同じ言語を別の国向けに調整したもの)を示します。Googleはこれを使って、検索結果で適切なバージョンを表示します。

できないこと:

• 言語を判定するものではありません。 Googleは「hreflangやHTMLのlang属性はページの言語の検出には使用しない」とし、表示されているコンテンツを使うと説明しています(多地域サイト)。deとタグ付けされていても本文が英語なら、英語のページです。
• 質の低い翻訳を重複や正規ページに変えるものではありません。 Googleは、ローカライズされたバージョンは「ページのメインコンテンツが翻訳されていない場合にのみ重複とみなされる」としています。メニューだけ翻訳され、本文が英語のページは重複です。
• リダイレクトは行いません。 検索結果に表示されるURLが変わるだけで、ユーザーはどのバージョンも開けます。

hreflangを追加する3つの方法

Googleは、3つの方法は「Googleの観点では同等」としています。ページごとに1つの方法を使いましょう。混在させるとエラーの温床になるだけです。

1. HTMLのlink要素(<head>内)。最も一般的な方法です。https://example.com/en/pricingの例:

<link rel="alternate" hreflang="en" href="https://example.com/en/pricing" />
<link rel="alternate" hreflang="de" href="https://example.com/de/preise" />
<link rel="alternate" hreflang="fr" href="https://example.com/fr/tarifs" />
<link rel="alternate" hreflang="x-default" href="https://example.com/en/pricing" />

ドイツ語ページとフランス語ページにも、まったく同じ4行を記述します。Googleはタグが「整形式の<head>セクション内」にあることを求めています。画像やリンクより前にある閉じられていないタグなど、ブラウザーがbodyへ移動させる要素があると、headが途中で終わってしまうことがあります。

2. HTTPのLinkヘッダー。PDFなど非HTMLファイルでは唯一の選択肢です。

Link: <https://example.com/en/guide.pdf>; rel="alternate"; hreflang="en",
      <https://example.com/de/guide.pdf>; rel="alternate"; hreflang="de"

Googleによれば、ヘッダーはすべてのバージョンで同一である必要があります。

3. XMLサイトマップ。テンプレートの変更が不要なので、大規模サイトに便利です。

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
        xmlns:xhtml="http://www.w3.org/1999/xhtml">
  <url>
    <loc>https://example.com/en/pricing</loc>
    <xhtml:link rel="alternate" hreflang="en" href="https://example.com/en/pricing"/>
    <xhtml:link rel="alternate" hreflang="de" href="https://example.com/de/preise"/>
  </url>
  <url>
    <loc>https://example.com/de/preise</loc>
    <xhtml:link rel="alternate" hreflang="en" href="https://example.com/en/pricing"/>
    <xhtml:link rel="alternate" hreflang="de" href="https://example.com/de/preise"/>
  </url>
</urlset>

各<url>には、自分自身を含むすべてのバージョンを列挙します。

Googleが適用するルール

相互リンクと自己参照

「2つのページが互いを指していない場合、タグは無視されます」。壊れた設定の大半はこのルールが原因です。英語ページがドイツ語ページを列挙していても、ドイツ語ページが英語ページを列挙していなければ、Googleはそのペアを破棄します。また、Googleは「各言語バージョンは自分自身も列挙しなければならない」としています。

言語コードと地域コード

「ISO 639-1の言語コードとISO 3166-1 Alpha 2の地域コードのみがサポートされています」。言語が先で、地域は任意です。Googleは、zh-Hantとzh-Hansのように複数の文字体系で書かれる言語向けのスクリプトサブタグや、zh-Hans-USのような組み合わせにも対応しています。

ラテンアメリカ全域のスペイン語には、共通のスペイン語版としてesを使うか、対象国(es-MX、es-AR、es-CO)を個別に列挙して同じURLを指定します。

x-default

「予約値のx-defaultは、ユーザーのブラウザー設定に一致する言語・地域が他にない場合に使用されます」。言語選択ページやメインの国際版を指定しましょう。任意ですが有用です。指定しないと、提供していない言語の検索ユーザーには、Googleが選んだバージョンが表示されます。

絶対URL

「代替URLは、通信方式を含む完全修飾URLでなければなりません」。https://example.com/de/は有効ですが、/de/や//example.com/de/は無効です。

hreflangとcanonicalタグ

両者は一致していなければなりません。各バージョンのcanonicalは、英語版やメイン版ではなく自分自身を指すようにします。Googleのcanonical化ガイドは、「同じ言語のcanonicalページを指定する」こと、同じ言語のcanonicalページがない場合は「可能な限り最適な代替言語」を指定することを求めており、hreflangのクラスターが、相互にリンクし合うURLを優先する形でcanonicalの選択に影響すると述べています。

よくある間違いは、すべての言語バージョンに<link rel="canonical" href="https://example.com/en/...">を入れてしまうことです。これは他のバージョンが英語ページの重複だとGoogleに伝えることになり、hreflangのアノテーションごとインデックスから外れます。

ほかに避けるべき矛盾が2つあります。リダイレクトされるhreflang URL(最終的なURLを記載する)と、noindexが付いたhreflang URL(Googleがインデックスできないバージョンは表示できない)です。

サイト構造と自動リダイレクト

Googleの多地域ガイドは、URL構造を次のように比較しています。

どの構造を選ぶにせよ、IPやブラウザーの言語で訪問者を自動的にリダイレクトしてはいけません。Googleは、これが「ユーザー(と検索エンジン)がサイトのすべてのバージョンを見ることを妨げる可能性がある」こと、またGooglebotは「通常、米国から接続する」ことを指摘しています。代わりに案内バナーを表示し、検索結果についてはhreflangに任せましょう。

Searviaのhreflangチェッカーの仕組み

hreflangチェッカーは、ウェブサイトSEOチェッカーと同じエンジンで動作します。ドメインまたはページのアドレスを入力すると、そのページ(ドメインのみの場合はホームページ)と周辺のサイトファイルを約20秒で38項目にわたって監査し、このツールの主題である3項目を先頭に表示します。以下が検査内容です。

言語バージョン、hreflang(優先度:低)。 リダイレクトを追跡して最終アドレスに到達したうえで、そのページのHTMLにあるすべての<link rel="alternate" hreflang="..." href="...">要素を読み取ります。

• 1つもない場合、結果は情報扱いです:「言語バージョンは宣言されていません(単一言語のサイトであれば問題ありません)」。評価には影響しません。
• 各コードをGoogleがサポートするコードと照合します。x-default、または2文字のISO 639-1言語コードに、任意で4文字のスクリプト(zh-Hant)と2文字のISO 3166-1 alpha-2の国コード(pt-BR、en-GB)を続けた形式です。en-UKのようなよくある間違いには修正案(→ en-GB)が付きます。es-419、3文字の言語コードなどGoogleが受け付けないコードは無効と表示されます。レポートの各行には、コード、URL、チェックまたはバツ印、そのメモが表示されます。表示は最大20行です。
• 自己参照を確認します。列挙されたURLのいずれかがそのページ自身でなければなりません。比較では、httpとhttpsの違い、先頭のwww.、クエリ文字列、末尾のスラッシュは無視されます。
• すべてのコードが有効でページが自分自身を列挙していれば合格です。x-defaultがない場合は、この任意のフォールバックがないというメッセージが加わります。そうでなければ、「言語バージョンにこのページ自身が含まれていません」または「無効な言語コードがあります」という警告になります。

ページの言語(優先度:低)。 <html>要素にlang属性があれば合格で、その言語を表示します。ない場合は警告です。

canonical URL(優先度:中)。 canonicalタグがページ自身を指していれば合格です。ない場合、または別のアドレスを指している場合は、そのアドレスを表示して警告します。

検査しないもの

• 相互リンク。 チェッカーは1ページだけを読み込み、他のバージョンは取得しないため、相互にリンクしているかは確認できません。各バージョンのソースを開くか、サイトクローラーで相互性を確認してください。
• HTTPヘッダーとサイトマップ。 読み取るのはHTMLの<link>要素のみです。サイトマップでhreflangを宣言している場合、チェッカーはバージョンなしと報告します。
• 絶対URLと重複。 相対URLは警告ではなく解決して扱われ、同じコードが2回出てくる場合は1つだけが保持されます。
• 他のページ。 1回の実行で検査するのは1ページです。確認したい各バージョンのアドレス(example.com/de/pricing、de.example.com)を入力するか、サイト全体にはクローラーを使ってください。

結果の読み方

A+からFまでの総合評価は38項目すべてを対象とし、優先度で重み付けされます(高10、中5、低2。警告は半分の得点)。「まず修正すべき項目」リストと共有可能なレポートも付属します。

hreflangの問題の修正方法

1. 言語バージョンが宣言されていないが、実際には存在する

1. ページのすべてのバージョンとそのURL全体(例:/en/、/de/、/fr/)を一覧にします。
2. 方法を選びます。多くのサイトではHTMLタグ、テンプレートの変更が難しい場合はサイトマップです。
3. コードやCMSの1つの情報源からタグを生成し、すべてのバージョンが同じ完全なセットを出力するようにします。手書きのタグはずれていきます。
4. 多言語プラグインやプラットフォーム標準のマーケット機能を使っている場合、通常はhreflangが自動出力されます。すべての翻訳が元ページにリンクされ、公開されているかを確認してください。リンクされていない翻訳にはタグが付きません。
5. hreflangチェッカーを再実行します。

2. 言語バージョンにこのページ自身が含まれていない

現在のページ自身の行を、そのページのコードで追加します。テンプレートでは、言語をループ処理する際に現在の言語をスキップしていることが多いので、その条件を外してください。自己参照のURLは、プロトコル、ホスト、末尾スラッシュの規則を含めてcanonical URLと同一にします。

3. 無効な言語コードがある

1. レポートでバツ印の付いた行を探します。
2. 形式を直します。アンダースコアではなくハイフン、言語が先で地域が後(GB-enではなくen-GB)。
3. 非対応のコードを置き換えます。en-UKはen-GBに(レポートが提案します)、es-419はesまたは国コードの一覧に、3文字のコードは2文字のコードにします。
4. 意図した言語のコードかを確認します。beはベラルーシ語、czは言語コードではなく(チェコ語はcs)、jpも言語コードではなく(日本語はja)、dkも違います(デンマーク語はda)。

4. ページの言語が宣言されていない

ルート要素に言語を追加します(例:<html lang="en">、<html lang="pt-BR">)。Googleは言語の検出にこれを使いませんが、MDNが説明するように、ブラウザー、翻訳ツール、スクリーンリーダーは使用します。

5. canonicalが別のアドレスを指している

多言語サイトでは、これは言語をまたぐcanonicalの問題であることが多いです。各バージョンのcanonicalを、それぞれ自身のURLに変更します。canonicalが同じページの別形式(httpsではなくhttp、またはwwwなし)を指している場合は、最終的なアドレスと完全に一致させます。

6. 相互リンクがない(チェッカーでは検査されません)

2つのバージョンを並べて開き、hreflangの一覧を比べます。まったく同じセットでなければなりません。違いがある場合、原因はほぼ必ずそれらを生成するテンプレートやプラグインなので、生成元を一度直せばすべてのページが直ります。

実例(仮想)

以下は仮想の例であり、実データではありません。架空のアウトドアブランドKestrel Gearは、英語のexample.comに/de/、/fr/、/es/のバージョンを持っています。ドイツの検索ユーザーが英語ページにばかり到達します。hreflangチェッカーの報告は次のとおりです。

canonical:「canonical URLはページ自身を指しています」。ページの言語:en。

es_ESのバツ印は形式エラーです。en-UKのバツ印には「→ en-GB」というメモが付いています。GoogleはUKを地域として受け付けないため、英語ページには使えるアノテーションがありませんでした。ドイツ語ページのソースを見ると3つ目の問題が見つかりました。canonicalが英語のホームページを指しており、Googleは/de/を重複として扱っていたのです。修正内容は次のとおりです。

1. コードをen、de、fr、esに変更し(言語ごとに1バージョンのため地域は不要)、英語のホームページを指すx-defaultを追加しました。
2. hreflangの出力を共通のテンプレートに移し、すべてのバージョンが自分自身を含む同じセットを出力するようにしました。
3. 各バージョンに自己参照のcanonicalを設定しました。
4. ドイツからの訪問者を自動で/de/に送っていたIPベースのリダイレクトを廃止し、案内バナーに置き換えました。

20分でできるhreflangチェックリスト

1. ホームページと各言語バージョンで、無料のhreflangチェッカーを実行する。
2. すべてのコードをISO 639-1とISO 3166-1 alpha-2と照合する。
3. 各バージョンが自分自身と他のすべてのバージョンを列挙していることを確認する。
4. 2つのバージョンを開き、セットが同一であることを確認する。
5. 各バージョンのcanonicalが自分自身を指していることを確認する。
6. x-defaultを追加する(任意だが有用)。
7. 自動リダイレクトがGooglebotからバージョンを隠していないことを確認する。

Searviaでできること

無料のhreflangチェッカーは、入力したページのhreflangリンク、ページの言語、canonicalを、ウェブサイトSEOチェッカーの他の項目とともに、共有可能な1つのレポートで検証します。Searviaのアカウントでは、Search Consoleを接続して言語バージョンごとの国別クリック数と掲載順位を確認でき、毎週サイト監査を実行して、別ページを指すcanonical、言語バージョン間で重複するタイトル、壊れたページを検出できます。ウェブサイトだけでなくアプリも公開している場合は、ストア側の同じ課題を扱うApp Storeローカライズガイドをご覧ください。技術的なチェックリスト全体については、テクニカルSEO監査ガイドを参照してください。