CLUSTER SEO BLOG
テクニカルSEOを中心にSEO対策をまとめています

hreflang属性の書き方と注意点

こんにちは、テクニカルSEO対策サービス「CLUSTER SEO」開発チームの江頭です。

多言語サイトのSEO対策では、各地域や国に合わせたページが正しく検索結果に表示されることが大切です。そのための重要な記述がlinkタグのhreflang属性です。

hreflang属性はページの言語や地域を指定する役割を持ちます。

この記事では、地域ターゲティングに必要な<link rel="alternate">タグやhreflang属性の書き方について詳しく説明します。

hreflang属性とは?

hreflang属性は、Webページがどの国の言語向けに作られているのかを示すために使う属性です。href属性で指定したURLについての言語情報を提供します。

hreflang属性は、a要素、area要素もしくはlink要素で使用します。主な用途は以下の通りです。

要素hreflang属性の用途
a要素アンカーのリンク先ページの言語情報を提供する。
area要素イメージマップのリンク先ページの言語情報を提供する。
link要素<link rel="alternate">タグのhref属性で指定した関連ページについての言語情報を提供する。
検索エンジンが利用するため、多言語サイトのSEOとして重要。

多言語サイトSEO対策の観点では、alternate linkタグで指定するhreflang属性が大切です。

なお、hreflang属性は、ページの言語(英語・日本語・フランス語など)を示すので、日本語ページしかない日本向けサイトでは利用する必要はありません。

hreflang属性が多言語SEOに必要な理由

Googleの検索エンジンは、Webページの内容から、自動的に言語を判断しています。

Google では、ページの表示内容からその言語を判断します。lang 属性のようなコードレベルの言語情報や、URL は使用しません。

多地域、多言語のサイトの管理 – Search Console ヘルプ

そのため、hreflang属性は多言語サイトでも不要に思えるかもしれません。

しかし、ある特定の地域に合わせたページを作成しても、「地域ターゲティング」を行わなければ、その地域におけるページランキングを向上させることはできません。検索エンジンから特定地域での評価を受けるには、hreflang属性を使い、どの地域・どの言語をターゲットとしたページなのかを明確にする必要があるのです。

hreflang属性が多言語SEO対策として重要になるのは、この「地域ターゲティング」を行うためです。

hreflang属性の書き方

地域ターゲティングを行うためのhreflang属性の書き方は以下の通りです。

<link rel="alternate" hreflang="【言語・地域コード】" href="【URL】"> 
属性説明
relalternate 固定。
hreflang「言語コード」もしくは「言語コード-国コード」がよく使われる。たとえば、英語の場合はen、アメリカ英語の場合はen-USとなる。
href各言語・地域向けページの絶対URL。

<link rel="alternate">タグは、そのページに対する代替ページを示すときに使われるタグです。rel属性の値 alternate は、英語で「別の」「代わりの」を表します。alternate linkタグは、PC用ページでスマホ用ページのURLを指定したり、多言語サイトで他の地域・言語用ページのURLを指定したりする役割があります。

ただし、<link rel="alternate">タグを1つだけ記述することは通常ありません。Googleでは、以下の3種類のURLを<link rel="alternate">タグで指定することを推奨しています。

  1. 他言語版ページのURL(1つ以上)
  2. 当該ページのURL(1つだけ)
  3. デフォルト言語ページのURL(1つだけ)

たとえば、英語と日本語の2か国語に対応したページの場合は、次のように英語ページのURL、日本語ページのURL、デフォルトのURLの3つのURLを記述します。

<link rel="alternate" hreflang="en" href="https://example.com/en/">
<link rel="alternate" hreflang="ja" href="https://example.com/ja/">
<link rel="alternate" hreflang="x-default" href="https://example.com/en/">

上記の<link rel="alternate">タグは、href属性で指定したページ全てに埋め込む必要があります。つまり、https://example.com/en/ と https://example.com/ja/ の両方に上記3つのalternateタグを設置する必要があります。

hreflang=”x-default”の役割

<link rel="alternate">タグでは、hreflang=”x-default”というリンクタグも1つ記述します。hreflang=”x-default”は、どの言語・地域にもマッチしないターゲットのことを指します。

たとえば、以下の<link rel="alternate">タグが記述されたページでは、フランス語ユーザーがGoogle検索すると、x-defaultで指定された英語ページ(https://example.com/en/)が表示されます。

<link rel="alternate" hreflang="en" href="https://example.com/en/">
<link rel="alternate" hreflang="ja" href="https://example.com/ja/">
<link rel="alternate" hreflang="x-default" href="https://example.com/en/">

hreflang属性で指定する言語コード

hreflang属性に指定する言語コードのうち、よく使用される言語をリストアップしました。

言語コード言語名称
en英語
frフランス語
esスペイン語
itイタリア語
deドイツ語
ptポルトガル語
ruロシア語
ja日本語
ko韓国語
zh中国語
arアラビア語

その他の言語コードについては、以下を参照してください。

Language subtag lookup app

hreflang属性で指定する地域コード

hreflang属性は、ハイフンに続けて地域コードを指定することができます。地域によって単語や表現が異なる言語のときには、地域コードが重宝します。

たとえば、hreflang="en-us"はアメリカ向けの英語、hreflang="en-gb"はイギリス向けの英語、hreflang="en-au"はオーストラリア向けの英語を指します。

地域コード
usアメリカ合衆国
caカナダ
mxメキシコ
brブラジル
gbイギリス
frフランス
itイタリア
deドイツ
esスペイン
chスイス
euEU
jp日本
tw台湾
kr韓国
cn中国
hk香港
sgシンガポール
ruロシア連邦
auオーストラリア
aeアラブ首長国連邦

その他の地域コードについては、以下を参照してください。

Language subtag lookup app

hreflang属性のよくある間違い

href属性ページで相対URLを指定している

hreflang属性で地域ターゲティングを行う場合、href属性は絶対URL(https://から始まるURL)で記述します。

誤
<link rel="alternate" hreflang="en" href="/en/">
<link rel="alternate" hreflang="en" href="//example.com/en/">

正
<link rel="alternate" hreflang="en" href="https://example.com/en/">

双方向にlinkタグを設置していない

<link rel="alternate">タグは、各言語ごとのページ全ての配置する必要があります。

たとえば、英語と日本語に対応したページの場合、英語ページに日本語版のURLを記載するだけでなく、日本語ページにも英語版のURLを記載します。

下層ページで各地域TOPページを指定している

<link rel="alternate">で指定するURLは、当該ページの他言語版URLです。TOPページなら他言語版のTOPページのURLを指定しますが、下層ページなら他言語版の下層ページのURLを指定します。

(例)https://example.com/en/about-us ページのalternate linkタグ

誤
<link rel="alternate" hreflang="en" href="https://example.com/en/">
<link rel="alternate" hreflang="ja" href="https://example.com/ja/">
<link rel="alternate" hreflang="x-default" href="https://example.com/en/">

正
<link rel="alternate" hreflang="en" href="https://example.com/en/about-us">
<link rel="alternate" hreflang="ja" href="https://example.com/ja/about-us">
<link rel="alternate" hreflang="x-default" href="https://example.com/en/about-us">

hreflang属性の動作確認

Googleサーチコンソールのインターナショナル ターゲティング

公開されたサイトに対して網羅的なチェックを行うには、Googleサーチコンソールが便利です。

Googleサーチコンソールで、[以前のツールとレポート]-[インターナショナルターゲティング]メニューを選択します。

Googleが検出したURL全てに対して、<link rel="alternate">タグのチェックを行った結果を確認できます。

Googleサーチコンソールのインターナショナルターゲティング

ドメインプロパティの場合、インターナショナルターゲティングの分析が使えません。Googleサーチコンソールに、URLプレフィックスタイプのプロパティを追加してください。

Browserling

Browserling

https://www.browserling.com

海外からGoogle検索したとき、適切なサイトが表示されるのかをチェックするのに利用できます。Browserlingのサーバーはカナダにあるので、hreflang="en"hreflang="en-CA" の動作がチェックできます。

各言語ページへの自動リダイレクトは非推奨

ユーザーの言語設定や地域を判断し、自動的に各言語ページにリダイレクトさせることは技術的に可能ですが、Googleは推奨していません。

各言語ページへの自動リダイレクトを非推奨としている理由には、以下の2つがあります。

  1. 検索エンジンのクローリングへの影響:自動リダイレクトにより、各国版のWebページをクローリングできない可能性がある。GoogleはAccept-Languageヘッダを送信しません。
  2. ユーザーへの影響:自動リダイレクトにより、他言語バージョンのコンテンツが表示できない可能性がある。

海外では、Googleだけでなく、YANDEXや百度などのクローラーからも正しくインデックスさせる必要があることも考えると、検索エンジンに影響が出ないよう、十分な配慮を行った方が良いでしょう。

hreflangのまとめ

以上、hreflang属性の書き方と注意点をまとめました。

地域ターゲティングは、サイトマップやHTTPヘッダでも指定することができます。大規模な多言語サイトやECサイトなどの動的サイトでは、alternate linkタグ以外の方法でも検討してみてください。

Page Top