hreflang属性の読み方・書き方とは？設定方法や注意点まで解説

近年、海外から日本を訪れる人も再び増加しています。そのため、海外ユーザーも閲覧できるサイトを作りたいと考えている方は多いのではないでしょうか。

そのような場合、おすすめなのはhreflang属性を使う方法です。

そこで、本記事ではhreflangの特徴や設定方法を解説します。多言語に対応したサイトを作成してさまざまな国のユーザーを集客したい方は、ぜひ参考にしてみてください。

SEO対策とは？具体的な施策手順や注意点を解説

hreflangの特徴

hreflangの読み方は「エイチレフラング」といい、地域や言語が異なるユーザーにそれぞれに適したページを表示する目的で使用します。

例えば、メインの日本語サイトの他に英語とドイツ語対応のサイトを作ったとします。

このような場合にhreflangを設定すると、英語圏とドイツ語ユーザーをそれぞれの言語サイトに誘導できるのです。

hreflangのSEO効果

hreflangを設定しなくても、Googleはユーザーによって別言語のページを表示できることがあります。

しかし、多言語対応サイトにおいてhreflangの設定は、SEO対策として重要です。

なぜなら、GoogleはHTMLタグや属性の内容でWebサイトのコンテンツ内容を把握するため、hreflang属性があることで多言語対応ページだと認識します。

どの国のどの言語のユーザーに向けたページなのか正しく伝えることで、その国での検索結果の表示順位も上がるのです。

hreflang設定の種類

Googleが推奨するhreflangの設定方法は3種類あるので、状況に合わせて使い分けましょう。

• HTMLタグ
• HTTPヘッダー
• サイトマップ

それぞれの方法を、基本構文と一緒に解説します。

HTMLタグ

よく使用されるのが、多言語対応したいページのヘッダー部分にHTMLで記述する方法です。

• 言語・地域コード：表示したいユーザーの言語・地域
• 表示するページURL：指定した言語・地域ユーザーに表示したいページのURL

<link rel=”alternate”>は、代替ページを表示したいときに使用するタグです。hrefはリンク先のファイルを指定したいときに使用します。

例えば、以下のようなWebサイトがあるとします。

英語圏ユーザー向けに英語のサイトを表示したい場合、以下のような記述をします。

HTTPヘッダー

HTTPヘッダーは、PDFなどHTML形式以外のファイルを表示したいときに使用します。

例えば日本語・英語・ドイツ語の3つの言語のPDFファイルを表示したい場合は以下のようになります。

サイトマップ

XMLサイトマップを作成すると、多言語対応の全てのページ情報をまとめてGoogleに伝えることができます。

例えば日本語・英語・ドイツ語に対応したページがある場合は以下のように記載します。

サイトマップ形式の記述ポイントは以下の2つです。

• 全ての多言語対応ページのURLを<loc>内に記載する
• <xhtml:link>内には<loc>に記載したページも含め、全ての言語情報とURLを記載する

<xhtml:link>内に記載する順番は任意です。

しかし、<loc>内の内容に関係なく全ての多言語対応ページを記載しなければならないため、統一した方がわかりやすいでしょう。作成後にGoogleサーチコンソールで送信すれば、必要な作業は完了です。

hreflangに必要な要素

ここでは、hreflangを設定する際に必ず入れるべき要素を3つ解説します。記載しなかった場合、多言語対応ページが機能しない可能性があります。

• 言語・地域コード
• x-default
• canonicalタグ

それぞれ詳しく見ていきましょう。

言語・地域コード

多言語対応ページの言語はISO639-1形式、地域はISO3166-1alpha-2形式で指定します。

言語コードは必須ですが、地域コードは指定したい場合のみ記載します。地域コードは、言語コードの後ろに付ける場合のみ使用可能なので注意しましょう。

中国語など、1つの言語で繁体字、簡体字の複数の文字体系がある場合は、地域コードから自動で文字体系が取得されます。

しかし、複数の中国語圏に対応したページを作る場合、2パターンの文字体系に対して言語・地域コードを地域の数だけ記載するのは手間がかかります。

そのような場合は、以下のようにISO15924を使用して文字体系で指定しましょう。

• zh-Hant：中国語（繁体字）
• zh-Hans：中国語（簡体字）

x-default

x-defaultは予約値と呼ばれ、指定している言語と地域がいずれも一致しない場合に使用します。言語コードを指定する必要はありません。

例えば、日本語圏・ドイツ語圏以外のユーザーが閲覧した場合は以下のx-defaultで指定したサイトが表示されます。

canonicalタグ

canonical（カノニカル）タグは、正規のURLを指定する場合に使用します。

例えば、メインサイトの他に英語圏ユーザーと、オーストラリア在住の英語ユーザーを対象としたサイトがある場合、HTMLは以下のように記述します。

この記述では、オーストラリア以外の英語圏ユーザーから見ると英語のサイトが重複しています。Googleからも重複コンテンツだと認識され、被リンクが分散したり検索結果に表示されにくくなるかもしれません。

しかし、canonicalタグでメインのサイトを指定することで、検索結果に優先して表示したいURLを伝えることができます。

hreflangの注意点

ここでは、hreflangを使用する際の注意すべきルールを3つ解説します。正しく設定し、必要なユーザーにコンテンツを届けられるようにしましょう。

• href属性は絶対URLで記載する
• 全てのページに全ての対応言語を設定する
• 同じ階層のページ同士を紐付ける

それぞれ詳しく見ていきましょう。

href属性は絶対URLで記載する

hre属性で指定するURLは、「https://」から始まる絶対URLを記載しましょう。

//以降のURL（相対URL）で記載しないよう、注意が必要です。

全てのページに全ての対応言語を設定する

日本語・英語・ドイツ語に対応するサイトを作成する場合、全てのサイトで3カ国語のhreflang設定が必要です。

例えば、日本語サイトのhreflang設定では、日本語サイトの指定は不要のように思うかもしれません。日本語サイトの設定上も、英語、ドイツ語だけでなく日本語サイトも全て記載しましょう。

同じ階層のページ同士を紐付ける

hreflang設定の際は、多言語対応のページごとに同じ階層のページURLを記載する必要があります。

トップページ以外にも多言語対応ページがある場合は、そのページごとに設定しなければなりません。下層ページの設定でトップページのURLを指定しないよう注意しましょう。

WordPressで多言語に対応する方法

多言語対応サイトを作りたくてもHTMLの記述に自信がない場合、WordPressでサイトを立ち上げてプラグインを使うのがおすすめです。

代表的なプラグインには以下の種類があります。

• Bogo
• Multilingual Press
• Easy hreflang　など

hreflangタグを自動生成する機能、対応可能な言語の種類など、プラグインによってさまざまな特徴があります。

特にBogoは、管理者が日本人で説明も日本語で読めるため、プラグインに慣れていない方にもおすすめです。自分でコードを書いてhreflangを設定する場合は、WordPressでも手順は同じです。

まとめ：hreflangを活用して多言語に対応したサイトを作ろう

近頃、訪日する外国人が再び増加する中、日本のサイトへの海外ユーザーからのアクセスもますます増えることが予想されます。

多言語に対応可能なサイトを作成するには、hreflangの特徴や注意点を理解して設定する必要があります。

ぜひ、世界中のユーザーに対応できる利便性の高いサイトを作成して、集客に役立ててください。

弊社のSEOサービス「ランクエスト」では、お客様ごとに専任のコンサルタントがつき、戦略立案からコンテンツ制作、効果測定まで、すべて対応いたします。SEO対策にお悩みの方は、お気軽にご相談ください。