日本語や英語、中国語など多言語で書かれたウェブサイトには、hreflangという設定が必要です。hreflangはウェブサイトのソースコードに記述する要素で、さまざまな言語で検索するユーザーに適切なページを表示するために使用されます。
当記事では、hreflangが多言語サイトに必要な理由や、具体的な書き方、設定を確認する方法について解説します。さらに、hreflangを使用するときによくある設定ミスや注意点も紹介するため、多言語サイトを適切に運用したい方はぜひ参考にしてください。
1.hreflangとは
「hreflang」はhtmlタグに含まれる属性の1つで、ウェブサイトの内容がどの国の言語で書かれているかを表します。Googleはhreflangを参照してウェブサイトの言語を判断するため、多言語サイトを運用する場合はhreflangの記述が必要です。
たとえば、同じコンテンツを日本語とスペイン語で記載した多言語サイトがあると仮定しましょう。ウェブサイトのコードにhreflangが記述されていない場合、Googleはいずれかの言語で書かれたページを見落とす危険性があります。
Googleに検出されなかったページは、検索結果に表示されません。スペイン語圏で検索したユーザーに対してスペイン語で書かれたページが表示されず、日本語で書かれたページが表示される可能性があります。
言語の種類を表すhreflang以外の属性としてlangもありますが、Googleはlang属性を無視していることが公式に発表されました。lang属性が無視されるようになった理由は、lang属性の表記と実際に使用されている言語が異なるケースが多かったためです。
検索結果に多言語サイトを適切に表示させたいときは、langではなくhreflangによって使用言語を表記しましょう。
2.hreflangの書き方
hreflang属性を記述できる場所には、次の3つがあります。
- headタグ内のlink要素
- HTTPヘッダー
- XMLサイトマップ
上記3つの中では、
headタグ内のlink要素にhreflang属性を記述する方法が一般的です。
たとえば、日本語・英語・韓国語に対応する多言語サイトの場合、各言語のトップページに下記のようなコードを記述します。
【記述例】
<link rel=”alternate” hreflang=”ja” href=”https://○○.com/”>
<link rel=”alternate” hreflang=”en” href=”https://○○.com/en/”>
<link rel=”alternate” hreflang=”ko” href=”https://○○.com/kr/”>
link要素のhreflang属性には言語コードを記述し、href属性には各言語に対応するページのURLを記述してください。
ウェブサイトが複数の言語に対応していれば、すべてのページで同様にhreflang属性を記述する必要があります。
また、
多言語サイトに下層ページが存在する場合は、href属性を各ページのURLに変更したコードを記述してください。
たとえば、「https://○○.com/contents/」という下層ページに日本語・英語・韓国語に対応したコンテンツがあれば、下記のようなコードを記述します。
【記述例】
| 日本語ページ |
<link rel=”alternate” hreflang=”ja” href=”https://○○.com/contents/”>
|
| 英語ページ |
<link rel=”alternate” hreflang=”en” href=”https://○○.com/en/contents/”>
|
| 韓国語ページ |
<link rel=”alternate” hreflang=”ko” href=”https://○○.com/kr/contents/”>
|
hreflang属性で指定する言語コードには、ISO639-1形式と呼ばれる文字列が使用されます。主な言語コードは下記の通りです。
| 言語 |
言語コード |
| 日本語 |
ja |
| 英語 |
en |
| 中国語簡体字 |
zh-Hans |
| 中国語繁体字 |
zh-Hant |
| 韓国語 |
ko |
| フランス語 |
fr |
| スペイン語 |
es |
| ドイツ語 |
de |
| イタリア語 |
it |
| ロシア語 |
ru |
| アラビア語 |
ar |
| ベトナム語 |
vi |
| タイ語 |
th |
同じ言語で書かれていても地域によってページが異なる場合は、国コードと呼ばれる文字列を使用します。
たとえば、日本語ページに加えて、英語で書かれたアメリカ合衆国用・イギリス用・カナダ用の3ページがある場合の記述方法は、下記の通りです。
【記述例】
| 日本語ページ |
<link rel=”alternate” hreflang=”ja” href=”https://○○.com/”>
|
| 英語のアメリカ合衆国用ページ |
<link rel=”alternate” hreflang=”en-US” href=”https://○○.com/en-us/”>
|
| 英語のイギリス用ページ |
<link rel=”alternate” hreflang=”en-GB” href=”https://○○.com/en-gb/”>
|
| 英語のカナダ用ページ |
<link rel=”alternate” hreflang=”en-CA” href=”https://○○.com/en-ca/”>
|
このように、言語コードの後ろにハイフンと国コードを追加すれば、地域に合わせて最適なページを表示させることが可能です。
国コードには、ISO3166-1形式と呼ばれる文字列が使用されます。
主な国コードは下記の通りです。
| 国 |
国コード |
| 日本 |
JP |
| アメリカ合衆国 |
US |
| イギリス |
GB |
| カナダ |
CA |
| 中国 |
CN |
| 韓国 |
KR |
| スペイン |
ES |
| ドイツ |
DE |
| フランス |
FR |
| イタリア |
IT |
| ロシア連邦 |
RU |
| ベトナム |
VN |
| タイ |
TH |
2-1.canonicalタグの併用
異なる地域をターゲットにしたページが同じ言語で書かれている場合、検索エンジンから重複コンテンツと見なされる危険性があります。
重複コンテンツと判断されることによる影響は次の通りです。
- 検索結果に表示されにくくなる
- 被リンクの評価が分散し検索順位が下がる
- ペナルティの対象となる
上記のリスクを避けるため、
複数の地域を対象とする多言語サイトではcanonicalタグを使用しましょう。
canonicalタグを使用すると、内容が似ている複数ページのURLを正規化できます。
つまり、
検索エンジンから優先的に評価されたいページを指定し、検索結果に表示させることが可能です。
たとえば、日本語ページに加えて、英語で書かれた汎用ページとイギリス用ページがあるとします。この場合、イギリス以外の地域で検索した英語ユーザーから見て、2つのページが重複した状態となります。
重複を避けるために、下記のような形式でcanonicalタグを併記してください。
【記述例】
<link rel=”canonical” href=”https://○○.com/”>
<link rel=”alternate” hreflang=”ja” href=”https://○○.com/”>
<link rel=”alternate” hreflang=”en” href=”https://○○.com/en/”>
<link rel=”alternate” hreflang=”en-GB” href=”https://○○.com/en-gb/”>
上記のように、canonicalタグによって正規URLを指定すれば、重複コンテンツと見なされるリスクを避けることが可能です。
3.サーチコンソールを使ったhreflangの確認方法
Googleが提供するサーチコンソールというツールを使えば、多言語サイトにおけるhreflangの設定をチェックできます。
サーチコンソール以外のサードパーティ製ツールでもhreflangの確認は可能です。
サーチコンソールを使ってhreflangを確認する場合は、管理画面からインターナショナルターゲティングを選択してください。hreflangが設定されている多言語サイトに関する、エラーの有無や原因が表示されます。
ウェブサイトにhreflangを設定したときは、サーチコンソールなどの検証用ツールを用いて、正しく設定ができたかを確認しましょう。
4.hreflangを使用するときの5つの注意点
多言語サイトでhreflangを使用するときは、よくある間違いに注意して設定を行うことが重要です。ここでは、特に間違いやすいポイントを紹介します。
○言語コードや国コードを誤って記載する
hreflangで言語コードや国コードを指定する場合、正しいコードを使用しましょう。言語コードや国コードの
文字列や形式に誤りがあると、hreflangが正常に機能しません。
また、国コードは単独で用いることができず、言語コードの後ろに付加する場合のみ利用可能です。
○言語コードとページの組み合わせを誤って記載する
hreflangを使用するときは、言語コードとページの組み合わせを一致させてください。
使用されている
言語とhreflangの指定が異なれば、外国語で検索したユーザーに誤ったページが表示されます。
○href属性を誤って相対パスで記載する
hreflangの設定では、href属性を「https://」から始まる絶対パスで記載してください。
相対パスで記載した場合、hreflangによる言語の指定が無効となります。
○対応ページの双方向にhreflangを設置することを忘れる
多言語サイトでは、hreflangを対応ページの双方向に設置しましょう。
たとえば、
日本語版と英語版のページがあれば、両方のページで同一のhreflangを設置してください。
○下層ページとトップページのURLを誤って記載する
hreflangの設定では、ウェブサイトにある各ページで対応するリンク先URLを記載する必要があります。
下層ページに記述するhreflangのhref属性には、対応する言語の下層ページURLを記載しましょう。
まとめ
複数の言語で書かれたページを持つウェブサイトでは、hreflangによる言語設定が必要です。多言語ページでhreflangを正しく設定すれば、各言語で検索したユーザーに適切なページを表示できます。
同じ言語で異なる地域をターゲットにしたページがあれば、国コードを使用して地域ごとにhreflangを設定しましょう。また、コンテンツの重複を避けるためのcanonicalタグも重要です。
hreflangの設定が正しいかは、サーチコンソールなどのツールで確認できます。
多言語サイトを運営している方は、この記事で紹介した設定方法を参考に、hreflangを正しく実装してください。
