多言語サイトでhreflangを正しく使う方法：頭を悩ませずに実装するコツ
webceke
多言語サイトを構築したとしましょう。おそらく、webcekeのようなAIウェブサイトビルダーを使って、フランス語、スペイン語、ドイツ語のページを作ったことでしょう。しかし、そのとき何かおかしなことに気づきます。Googleが検索結果で間違った言語バージョンを表示していたり、さらに悪いことに、翻訳したページを重複コンテンツとして扱っていたりするのです。そこで登場するのがhreflangタグです。これは、検索エンジンに対して、どの言語・地域バージョンのページをどのユーザーに表示すべきかを伝える小さなコードです。このガイドでは、hreflangをわかりやすく説明し、コードに触れたことがない人でも正しく設定できるように解説します。
hreflangとは正確には何か？
hreflangは、Webページの<head>セクションに追加するHTML属性です。次のような形をしています。
``html <link rel="alternate" hreflang="en" href="https://example.com/" /> <link rel="alternate" hreflang="fr" href="https://example.com/fr/" /> ``
簡単に言うと、「ねえGoogle、このページは英語版で、こちらのURLは同じコンテンツのフランス語版だよ」と伝えているのです。hreflangがないと、検索エンジンはどのバージョンを表示すべきか推測しなければなりません。フランスのユーザーに英語のページを表示したり、すべてのバージョンを重複としてインデックスしてどれも上位表示しなかったりする可能性があります。hreflangは明確なシグナルを与えることで、この問題を解決します。
なぜ中小企業にhreflangが必要なのか（AIビルダーを使っている場合でも）
AIウェブサイトビルダーを使って多言語サイトを作成している場合、ツールがすべてを処理してくれると思うかもしれません。しかし、多くのビルダーはテキストを翻訳するだけで、hreflangタグを自動的に追加してくれるわけではありません。つまり、次のようなメリットを逃していることになります。
- ターゲット各国での検索順位向上 – Googleは、検索者の位置情報と言語設定に基づいて、適切な言語バージョンをマッチングできます。
- 重複コンテンツのペナルティ回避 – 同じコンテンツを複数の言語で持っていると、検索エンジンはそれを重複と見なす可能性があります。hreflangは、意図的なものであり、各バージョンが異なるオーディエンス向けであることを伝えます。
- ユーザーエクスペリエンスの向上 – 訪問者は読めるページにたどり着くため、直帰率が下がり、コンバージョンが向上します。
国際展開を目指す中小企業にとって、hreflangは必須であり、あれば便利というレベルのものではありません。
hreflangを正しく実装する方法（ステップバイステップ）
実際の例を見ていきましょう。あなたが手作りの陶器を販売していて、英語サイトがhttps://example.com/、スペイン語版がhttps://example.com/es/にあるとします。必要な手順は次のとおりです。
- すべてのバージョンのページにhreflangタグを追加する。 英語ページにはスペイン語版へのリンクを、スペイン語ページには英語版へのリンクを含めます。また、自分自身のURLを指す自己参照タグも忘れずに追加しましょう。
- 正しい言語コードと国コードを使用する。 米国英語には
en-us、英国英語にはen-gbを使用します。すべての英語話者を対象とする場合は、単にenを使用します。スペイン語も同様で、一般的なスペイン語にはes、メキシコにはes-mx、スペインにはes-esです。
x-defaultでフォールバックを追加する。 このタグは、他の言語が一致しない場合にどのページを表示するかをGoogleに伝えます。通常はメインページ（多くの場合英語）です。例：<link rel="alternate" hreflang="x-default" href="https://example.com/" />
- URLを一貫させる。 英語ページが
/にあり、スペイン語ページが/es/にある場合、後でタグを更新せずにURL構造を変更しないでください。
- 実装をテストする。 GoogleサーチコンソールのURL検査ツールやhreflangバリデータを使用して、エラーをチェックしましょう。
避けるべき一般的なhreflangの間違い
経験豊富なマーケターでもhreflangで失敗することがあります。主な落とし穴は次のとおりです。
- 戻りタグの欠落。 英語からスペイン語へのタグを設定した場合、スペイン語から英語へのタグも設定する必要があります。そうしないと、Googleはタグを無視します。
- 言語コードの誤使用。
en-ukは間違いです。正しくはen-gbです。ブラジルポルトガル語はpt-br、ヨーロッパポルトガル語はpt-ptです。 - すべてのバージョンでhreflangを更新し忘れる。 新しい言語を追加した場合、既存のすべての言語ページにタグを追加する必要があります。
- hreflangとcanonicalタグを誤って混在させる。 CanonicalはGoogleに「このページがメイン」と伝え、hreflangは「これらはすべてバージョンです」と伝えます。両方を使用しますが、競合しないようにしてください。たとえば、スペイン語ページのcanonicalを英語ページに設定しないでください。それはGoogleにスペイン語ページが重複であると伝えることになります。
webcekeのようなAIウェブサイトビルダーがどのように役立つか
AIウェブサイトビルダーを使用している場合、ページの<head>セクションに直接アクセスできないかもしれません。しかし、それでも大丈夫です。たとえばwebcekeでは、サイトのheadにカスタムコードを追加できるので、hreflangタグをそこに貼り付けることができます。あるいは、WordPressのようなCMSを使用している場合は、Yoast SEOやRank Mathなどのプラグインを使って、コードに触れずにhreflangタグを管理できます。重要なのはロジックを理解し、それを実装するために利用可能なツールを使うことです。
多言語サイトのための簡単チェックリスト
- [ ] すべての言語バージョンが固有のURLを持っている（例：
/es/、/fr/）。 - [ ] 各ページに、自分自身を含むすべてのバージョンのhreflangタグが含まれている。
- [ ]
x-defaultタグを追加した。 - [ ] 正しい言語コードと地域コードを使用している。
- [ ] Googleサーチコンソールでテストした。
グローバル展開の準備はできましたか？
hreflangは技術的に聞こえるかもしれませんが、実際には「このページはこれらの人々向けです」と伝えるだけのものです。正しく実装すれば、多言語サイトの検索順位が向上し、重複コンテンツの問題を回避し、訪問者にぴったりのコンテンツを提供できます。webcekeでサイトを構築しているなら、タグを簡単に追加して、世界中から顧客を引き寄せることができます。試してみませんか？未来の国際的な顧客が待っています。
