こんにちは、GIGの林です。

Web制作の分野で働いている方なら、「英語対応をしたいと言われたけど、どこまで考えればいいのか分からない」「翻訳さえすれば多言語サイトになると思われがち」といった悩みを、一度は感じたことがあるのではないでしょうか。

じつは、多言語サイト制作は英語に翻訳することではなく、設計段階で押さえるべきポイントを理解するだけで、失敗や手戻りを大きく減らすことができます。

本記事では、その経験をもとに、Web制作で英語を中心とした多言語サイトを作る際の注意点をわかりやすく解説します。

林 瑞希（はやし みずき）：PM事業部ディレクター。関西外国語大学外国語学部を卒業後、新卒で株式会社GIGに入社。コーポレートサイトや採用サイトを中心に新規サイト制作の企画・設計・進行管理などのPMやディレクション業務を担当。最近は先輩の影響で登山にはまりそう。

Webサイトの多言語対応とは

Webサイトの多言語対応とは、日本語サイトを英語や中国語など、複数の言語で閲覧できるようにすることです。海外展開を検討している企業や、インバウンド需要を取り込みたい企業にとって、多言語サイトは今や欠かせない施策となっています。

初めて多言語サイトを担当する方が驚くのは、「ただ翻訳すればよいわけではない」という点です。実際に過去の事例では、日本語の現行サイトをそのまま翻訳した結果、英語版でレイアウトが大きく崩れてしまった……というケースがありました。

意外とそのまま翻訳すればいいという訳ではないというのが多言語サイトの注意点です。

多言語対応の方法は、大きく分けて次の2つです。

・機械翻訳や翻訳ツール導入による自動対応
・人手による翻訳・制作

Google翻訳やDeeplなどの機械翻訳を使用したり、shutto翻訳を使用してタグを埋め込んで多言語に対応するなどは手軽に導入できますが、ブランドイメージが重要なコーポレートサイトでは、ニュアンス的な部分を考慮するとプロの翻訳者による人手翻訳がおすすめです。

とくにBtoB企業の製品説明やサービス紹介では、専門用語の誤訳がビジネス機会の損失につながるリスクになってしまうかもしれません。

Webサイトの多言語対応は翻訳ではなく、ローカライズ

多言語サイト制作でもっとも陥りやすい失敗が、「翻訳会社に依頼すればOK」と考えてしまうことです。しかし、Webサイトの多言語対応は単なる翻訳作業ではありません。実際には、翻訳したテキストを置き換えるだけでは不十分で、対象国の文化や商習慣を踏まえた「ローカライズ」が不可欠です。

たとえば、同じ内容でも、国や文化によって適切な表現は大きく異なります。日本では前向きに受け取られる言い回しでも、海外では強すぎたり、意図と異なるニュアンスで伝わってしまうことがあります。

そのため、多言語対応では文章を単純に翻訳するのではなく、対象国の価値観やコミュニケーションスタイルに合わせて表現自体を調整するのにも気をつけた方が良いです。

また、お問い合わせフォームの設計にも注意が必要です。たとえば日本のBtoBサイトでは「会社名」「部署名」「役職」を必須にすることが一般的ですが、欧米では個人名とメールアドレスのみが標準です。日本語フォームをそのまま英語化した結果、海外のフリーランスや個人事業主が問い合わせできない状態になり、「英語サイトを作ったのに問い合わせが来ない」というケースになってしまう可能性も考えられます。

写真素材の選定も同様です。日本人モデルのみの写真では、海外ユーザーに「自分向けのサイトではないかも」と感じさせてしまう可能性があります。そのため近年は多様性を意識したビジュアル設計をデザイン時点で考慮するケースも多くあります。

ローカライズは翻訳の延長ではなく、「ターゲット市場向けにサイトを再構築すること」だと捉え、制作していくことが重要です。

多言語化する範囲と優先度を決める

多言語サイトの企画段階で最も重要なのが、「どのページを多言語化するか」という優先順位付けです。「全ページを英語化したい」とお客さまから要望されることもありますが、予算や運用体制を考えると、現実的でないケースもあります。

たとえば、50ページ以上あるサイトの全ページ英語化するとなった場合、Google Analyticsなどでアクセスを分析すると、海外ユーザーの多くはトップページ、サービス紹介、料金ページ、お問い合わせといった限られたページしか閲覧していないことが分かったりすることがあります。

優先すべきなのは、以下のようなコンバージョンに直結するページです。

・トップページ
・サービス・製品紹介
・料金・プラン
・事例紹介
・お問い合わせフォーム
など…

一方で、採用情報やIR情報、日本国内向けのプレスリリースなどは、海外ユーザーにとって優先度が低いため、翻訳しないケースも多いです。

英語対応で破綻しやすいUI・レイアウトの落とし穴

多言語サイト制作でとくにトラブルが多いのが、英語版でのUI・レイアウト崩れです。

日本語と英語では文字数や文字幅が大きく異なるため、日本語デザインをそのまま流用すると、高い確率で崩れが発生します。初めて担当する場合は、この点を必ずデザイナーと共有しておきましょう。

もっとも多いのが、ボタンテキストのはみ出しです。

日本語の「お問い合わせ」は6文字ですが、英語では「Contact Us」で10文字、「Request Information」になると21文字になります。あるプロジェクトでは、ボタン幅を固定値で指定していたため、英語版でテキストが収まらず、公開直前に全ページを修正する事態に……。ボタンは可変幅にし、長文にも対応できる設計にするなど仕様作成段階での考慮も必須です。

また、グローバルナビゲーションも注意が必要です。「会社情報」「サービス」「事例」「お問い合わせ」が英語になると「About Us」「Services」「Case Studies」「Contact」と文字数が増え、スマホ表示で2段になるなどの問題が起こりがちです。デザイン段階で実際の英語テキストを使って検証しておくべきでしょう。

見出しや商品名も盲点です。あるサイトでは、製品名が英語になったことで文字数が倍以上になり、一覧ページのグリッドが崩壊しました。

英語版では文字数制限を設けるなど、言語ごとの設計調整が必要です。

可能であれば、日本語版と英語版の両方のワイヤーフレームを作成するか、少なくとも主要パーツは英語の実テキストで検証するようデザイナーに依頼しましょう。

言語切り替え・ナビゲーションで迷わせない設計をする

多言語サイトで見落とされがちなのが、言語切り替えの導線設計です。英語ページを用意しても、ユーザーが切り替えに気づかなければ意味がありません。

よくある失敗が、言語切り替えボタンの配置忘れです。言語切り替えは、ヘッダー部分などファーストビューで視認できる位置に配置するのが鉄則です。

また、表記方法にも注意が必要です。「日本語」「English」のように、各言語をその言語名で表記するのが基本です。国旗アイコンは一見分かりやすそうですが、英語圏だけでも複数の国があるため、混乱を招く可能性があります。ただ、国によっては名前が長くなるため、JAやENと短縮して記載するのもおすすめです。

さらに重要なのが、切り替え後の遷移先です。言語を切り替えるたびにトップページに戻ってしまうと、ユーザーの離脱につながります。理想は同一ページの他言語版へ遷移する設計です。対応ページがない場合は、その旨を明示し、関連ページやサイトマップへ誘導するのが良いでしょう。エンジニアへの指示書には、「言語切り替え時は同一内容の他言語ページへ遷移。該当ページがない場合はトップページへ遷移し、注意文言を表示する」と明記しておくと安心です。

多言語サイトで押さえるべきSEOとURL設計の基本

多言語サイトのSEOで重要なのが、検索エンジンに各言語ページを正しく認識させるURL設計です。ここを誤ると、海外検索結果に表示されなかったり、重複コンテンツとして評価を落とす可能性があります。

URL設計には主に次の3つの方式があります。

1.サブディレクトリ方式（example.com/en/）
2.サブドメイン方式（en.example.com）
3.ccTLD方式（example.co.uk）

初めて多言語サイトを担当する場合は、管理しやすくSEO評価も引き継ぎやすいサブディレクトリ方式が無難です。

ある事例ではサブドメイン方式を採用した結果、日本語サイトで蓄積したSEO評価が引き継がれず、英語サイトの検索順位が伸び悩んだケースもあります。既存サイトの評価を活かしたい場合は、サブディレクトリ方式がおすすめです。

技術面で必須なのが「hreflangタグ」の実装です。これは各言語ページの対応関係を検索エンジンに伝えるためのタグで、実装漏れが起こりやすいポイントでもあります。公開前は必ずチェックをしましょう。

また、タイトルタグやメタディスクリプションは、単純な翻訳では不十分です。その言語圏で実際に検索されるキーワードを意識した最適化が必要になります。翻訳会社にSEO対応を依頼するか、別途キーワード調査を行うなど、目的に応じた対応を提案できると理想的です。

外国語対応はスタート地点。真に“機能する”多言語サイトを構築するために

日本語サイトをそのまま英訳しても、文化や情報の優先度が異なるため、ユーザーにとって使いづらいサイトになってしまうケースは少なくありません。

制作の段階で外国語を意識した情報設計、UI、SEO、運用体制までを見据えておくことで、初めて“機能する”多言語サイトになります。英語などの外国語対応はあくまでスタート地点。制作前に押さえるべきポイントを理解し、設計に落とし込むことが、成果につながる多言語サイトへの近道と言えるでしょう。

GIGではさまざまな外国語・多言語サイト制作に対応しています。気になる方はぜひ一度お問い合わせください。

■株式会社GIG
お問い合わせはこちら
採用応募はこちら（GIG採用サイト）
採用応募はこちら（Wantedly）

林 瑞希

PM事業部ディレクター。関西外国語大学外国語学部を卒業後、新卒で株式会社GIGに入社。コーポレートサイトや採用サイトを中心に新規サイト制作の企画・設計・進行管理などのPMやディレクション業務を担当。最近は先輩の影響で登山にはまりそう。