ちょっとWeb制作の内輪な話で、しかもプロの方々からしたら基礎的な話ですみません。

先日多言語の静的なサイトを作ったとき、言語の切り替えはトップページにて、ブラウザのデフォルト言語によって切り替えるindex.phpを置き、未対応の外国語はすべて英語に振り分けることをしました。

ほか、各ページのヘッダーに言語選択のドロップダウンをつけることにしました。

下記は他のサイトのものですが、ヘッダーによくあるドロップダウンです。

これをすべてのページに置き、他の言語の同じディレクトリのページに移動させるのですが、ヘッダー自体はSSIとして共通ファイルの読み込みであったため、静的にページごとにURLを書くわけにもいかず、結局jQueryで動的に言語ごとのディレクトリ部分の切り替えをすることにしました。

例えば、URLの途中にある

example.jp/ja/xxxx/yyyy/
example.jp/en/xxxx/yyyy/
example.jp/cn/xxxx/yyyy/
example.jp/tw/xxxx/yyyy/
example.jp/ko/xxxx/yyyy/

の「ja」「en」「cn」「tw」「ko」の言語ディレクトリをjQueryで切り替えるものです。

ここではScriptは書きませんが、それほど珍しいものではないのでググるといくつかヒットします。

下記のブログ記事なども参考になるかと思います。

言語のリンクをクリックすると対応する言語のページに移動させる（Web 制作における個人的メモさん）

ただ、各言語によって構成が少し異なるというか、日本語にはあるけれど外国語にはないとか、英語ページはあるけれど他の外国語にはないペといった差分が数ページありました。

例えばサービス案内の１つに日本人を対象とした英語の家庭教師とか、日本人を対象としたサービスの説明ページはあるけれど、英語版にはないとか、日本語版と英語版には問い合わせフォームはあるけれど、中国語や韓国語で対応できる人が社内にいないので問い合わせフォームがないとか。

そこで、Javascriptはそのまま横移動でリンク遷移させ、なければ.htaccessで１つ上位のページにリンクさせることにしました。

そうすることで、共通ヘッダーのJavascriptの言語切り替えは使えますし、「.htaccess」の設定が少し面倒なだけで済みます。

下記は、日本語のサービスの１つである「日本人向け家庭教師」のページから言語を切り替えた場合、「ページがありません」を避けて各言語のサービストップにリダイレクトさせる記述です。

RewriteEngine on
# 日本語しかないページ（全外国語）
RewriteRule ^en/service/tutor/(.*) /en/service/ [R=301,L]
RewriteRule ^cn/service/tutor/(.*) /cn/service/ [R=301,L]
RewriteRule ^tw/service/tutor/(.*) /tw/service/ [R=301,L]
RewriteRule ^ko/service/tutor/(.*) /ko/service/ [R=301,L]

文字通り、日本語の「tutor」で他の言語を選んで遷移したら、その言語のサービスのトップページにリダイレクトする、というものです。

実際に手掛けたサイトは上記のような「.htaccess」の記述をもう５セットほど書きましたが、単純なのでラクでした。

まあWeb制作者なら、こんな案件を扱ったら誰しも導き出される結果ではありますが、一応備忘録として書いておきます。