投稿日:2018年4月13日

多言語対応・ブラウザ言語設定での切り替え・ローカライズについて

ブラウザの言語設定で訪問時に言語を切り替えてって依頼が来たけど、これの最適解まとめたのってあんま見たことないなぁ〜

  • いろいろ手法があるけど、どれがえんやっけ
  • そもそもそれってほんとにユーザーにやさしいの?

って部分を説明する用にググってたら、グーグルさんが俺にも優しくしてくれないと検索結果にうまく出せないよって言い出した。

結論

忘れそうだからまとめておく。出し分けの手法メモったのは下の方に。

「振り分けするよりすなおにデフォルト言語で見せて選択させたげて〜。訪問時リダイレクトはグーグルさんが各言語クロールしづらくなるから、するならHTML リンク要素:hreflangとx-defaultの設定をしてかつ、クローラーがクロール可能なようにしてね。」

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

っってまとめた後になんやけど
下記SONICJAMさんの記事にわかりやすくほぼ全部書いてありました。(クローラーの事以外。おれの小一時間・・・・!)
素敵すぎますね。
みなさんこちらをご覧になればよいかと〜↓

WEBサイトの多言語化において考えるべきこと | ビジネス・戦略・サービス | BLOG | 株式会社ソニックジャム
http://www.sonicjam.co.jp/blog/strategy/001587/

以下調査内容知りたい方のみどうぞ〜

googleさんのおすすめの最適化

googleさんの推奨。
URLの発行の仕方、言語ごとのディレクトリの考え方など。
あとでユーザが選べないようなリダイレクトだけのサイトは絶対NG!

多地域、多言語のサイト – Search Console ヘルプ
https://support.google.com/webmasters/answer/182192?hl=ja

なんでそんなの調べたのって

最適解がなかなかググっても出てこなかったから気になってん。
変遷。

多言語Webサイトを制作する時に気をつけたいポイント | Webクリエイターボックス

多言語Webサイトを制作する時に気をつけたいポイント

ブラウザーの言語を日本語にしていると、多言語サイトでも日本語のホームが自動的に表示されるサイトがあります。しかし、この設定はSEOの観点で非推奨です。これはGoogleのウェブマスター向け公式ブログでも記述されています。

Google ウェブマスター向け公式ブログ: 多言語ウェブサイトの作成について
https://webmaster-ja.googleblog.com/2011/11/blog-post.html

うーん、そうなのか〜。ちょっとこれきいてみよう、とおもったら
コレ(2011年)の後に書かれた公式ブログ(2014年)ではリダイレクトNGじゃないけどhreflang書いてねって言ってるな〜
Google ウェブマスター向け公式ブログ: 海外のユーザーに適したホームページの作成
https://webmaster-ja.googleblog.com/2014/05/creating-right-homepage-for-your.html

でもって

Googlebot がアクセスしてクロールおよびインデックス登録できる: ローカライズされたページのクロールおよびインデックス登録がブロックされないようにしてください。

って。ようはhtaccessでクローラーはスルーさせないとダメってことかな?ふむー

言語や地域の URL に hreflang を使用する – Search Console ヘルプ
https://support.google.com/webmasters/answer/189077

ヘッダーの HTML リンク要素: http://www.example.com/ の HTML セクションに、このウェブページの日本語バージョン(http://ja.example.com/)を示す link 要素を次のように追加します。

<link rel="alternate" hreflang="ja" href="http://ja.example.com/" />

言語 / 国セレクタのあるページや、自動的にリダイレクトされるトップページの場合は、hreflang 値を「x-default」に設定したアノテーションを同様に追加する必要があります。

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

hreflangの書き方はここにものってる
多言語サイトの作り方とグローバルSEOの要点10(Wordpress)

多言語サイトの作り方とグローバルSEOの要点10(WordPress)

ブラウザ言語設定取得方法

もし自動で切り替えるなら。

htaccess

.htaccessで日本語とそれ以外でディレクトリを切り替える方法 – ゆめいろデザイン : フリーランス UIデザイナー Webデザイナー [東京]
https://yumeirodesign.jp/blog/201501/htaccess-lang-change.html

JS

javascriptでブラウザの言語設定を取得する – Qiita
https://qiita.com/shogo82148/items/548a6c9904eb19269f8c

JS: ブラウザの言語設定の取得方法 – Qiita
https://qiita.com/hisahayashi/items/7696e2f61b1a68f3d2bf

PHP

みんなだいすきTAMさん
ブラウザの設定言語とCookieを確認して、言語切り替えをやってみた | Tips Note by TAM

ブラウザの設定言語とCookieを確認して、言語切り替えをやってみた

その他

多言語サイトを構築する際に気をつけること | RCMSサポートサイト – CMSの構築ならRCMS
https://support.r-cms.jp/help/detail/id=1363

ブラウザ設定による言語判定ロジックに関して | RCMSサポートサイト – CMSの構築ならRCMS
https://support.r-cms.jp/help/detail/id=842

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です