Web プログラミング

【もりけん塾25日目】複数言語サイトの切り替え方法

初めてのLP制作依頼の作業をしている、ねこらのん(@nekoranon256)です。

 

今作成しているもの、

  • 外国人向けのサイト
  • 日本語も含む
  • ドメインは1つが希望
  • LPでサイトは1つが良い

という条件もと、多言語で見やすいサイトを作成するための方法を探しました。

多言語サイトにするために知っておきたい5つのこと

多言語サイトについて調べていると多言語サイト構築時に知っておきたい【5つのポイント】という記事を見つけたのでこちらを一読!

 

まとめると、

  • 文字量に注意
  • 自由にユーザーに言語を変換してもらう
  • 隅々まで多言語対応
  • URLでも言語変更に
  • 国旗アイコンの使用は注意

でした。

 

 

それぞれみていきます!

文字量に注意

言語によって文字量が異なります。

 

日本語、英語、中国語だったら長い順に

  1. 英語
  2. 日本語
  3. 中国語

となります。

 

例えば以下の場合。

  • 日本語は12文字
    今日は天気が良いですね。
  • 英語は22文字
    The weather is nice today.
  • 中国語は7文字
    今天天气很好。

英語が文字量が多く、中国語がもっとも少ないですね。

 

つまり言語によって文字量が変化するのでレイアウトなどに注意する必要があるようです。

 

自由にユーザーに言語を変換してもらう

言語の変換方法は2つあるようです。

 

  1. ユーザーが言語を選択
  2. 地域で開くことで言語が勝手に設定される

 

地域で開くことで言語が勝手に設定されることは非常にありがたいですよね。

 

例えば日本にいるから日本語に勝手に設定するなどが該当します。

しかしもし、日本に来た日本語を話すことも読むこともできないアメリカから来た人が勝手に言語が表示されるサイトを見たらどうでしょう…?

 

自分で言語を選択できる方がユーザーにあった言語表示ができますよね。

 

隅々まで多言語対応

サイトに表示されている内容はもちろん、メールの返信などにも言語対応をすることを忘れてはいけません。

 

英語圏の方がメールを送るとお礼メールが日本語だったケースは多いよう…

 

これは忘れそうなので注意したい…!

URLでも言語変更に

URLの言語部分を直接変更するユーザーもいるようです。

 

example.com/jp/products/detail ←日本語版
example.com/en/products/detail ←英語版
example.com/cn/products/detail ←中国語版

引用:多言語サイト構築時に知っておきたい【5つのポイント】

 

上記のように

  • jp
  • en
  • cn

の部分を変更するだけで対応言語ページに飛びます。

 

国旗アイコンの使用は注意

国旗アイコンを使うことで見やすいですが、英語を話す国はいくつもあります。

 

引用:多言語サイト構築時に知っておきたい【5つのポイント】

 

英語はアメリカもイギリス、オーストラリアだけでなく上記の国が使うので国旗アイコンで示すことは難しいかもしれません。

言語サイトの切り替え方法

言語サイトの切替方法を調べると、またサルワカさんの記事を見つけたので参考にさせていただきました!

 

サルワカさんの記事▶多言語サイトの作り方とグローバルSEOの要点10(WordPress)

 

結論は『英語専用のページを作成する』でした。

 

1つのページに複数の言語を入れるのは見にくい

同記事内で複数の言語を入れることはおすすめされていない。

 

例えばこのページで、

  • 日本語
  • 英語
  • 中国語

の言語を使った場合、読みにくいですよね?

 

そのためGoogleが推奨している方法は、

  1. 国別ドメイン(ccTLD)の使用
  2. サブドメインの使用
  3. サブディレクトリの使用

の3つあります。

 

サルワカさんの記事ではサブディレクトリを使用することがおすすめされていますね。

 

サブディレクトリはドメインの後に『/en』というサブディレクトリを作成し記事を公開していく方法です。

LP制作の場合

LPの場合、英語で統一した方が良いと感じました。

 

依頼者は、

  • 1ページもの
  • 外国人に向けたサイト

だったので、日本語を入れいてる意図などヒアリングする必要があるなと思いました。

 

もし日本語も必要な場合はどうしていくかを探ってみます。

 

おわりに

変更が多いのでウェブ制作の方々がブログで記載されているとおり、変更は3回までなどルールを決めておくことの大切さを実感しました。

 

しかし今回は初めてで顔見知りなので、依頼者がどこの部分に対して変更依頼を要請するのかが知りたかったので目的は達成しています…!

 

ヒアリングの大切さを学びました…

もりけん塾(@terrace_tech

Thanks:もりけんさん

 

もりけんさんの『武骨日記』へ

 

-Web, プログラミング

© 2020 Mayu_Yamada