多言語サイトの制作方法は?フローやポイント、おすすめツールも紹介
多言語サイトの制作方法は?フローやポイント、おすすめツールも紹介
国境を越えてビジネスを展開するにあたり、言語の壁を越える手段として多言語に対応したWebサイト制作の重要性は日々高まっています。しかし新規に多言語サイトを制作する場合や、既存のサイトを多言語化する場合、どのようにして進めていけばよいのでしょうか。
この記事では新規やリニューアル時の多言語サイト制作や既存サイトの多言語化について、方法をステップバイステップで解説します。さらに制作に役立つコツやスムーズに多言語サイト制作を進めるためのおすすめのツールも紹介するので、ぜひ最後までご覧ください。
多言語サイトを新規制作する場合の作り方7ステップ
多言語サイトを新規、もしくはリニューアル制作する場合の作成方法は以下の7ステップです。
- 対応言語設定
- ペルソナ設計
- 競合調査・キーワード設計
- デザイン
- コンテンツ制作翻訳
- 開発
- 公開・運用・改善
1. 対応言語設定
まずはどの言語に対応したWebサイトを制作していくのかを設定します。Webサービスの場合はサイトのターゲットがメインで使用する言語を対象とするのが良いでしょう。BtoB企業のコーポレートサイトの場合は日本語に区分けて英語のみ、英語と簡体字中国語など、英語を中心とした言語設定を行うケースが多いです。
またインバウンドとしては英語・韓国語・簡体字中国語・簡体字中国語が多くの場合対象となります。
2. ペルソナ設計
ペルソナ設計とはWebサイトのユーザーを具体的なひとりの人物像として描写したものです。
多言語サイトに限らずWebサイト制作では意思決定の場面が多く、ペルソナを決めておくことで決定の際の判断基準とすることができます。
またペルソナは社内で想像して作成するのもではなく、実際の顧客やユーザーなどへのアンケートなどの観察や調査から得られた情報をもとに作成しましょう。
LeadGridでは、実際にLeadGridチームがクライアント向けに開催しているワークショップの内容をベースにペルソナの設計方法を解説した「ペルソナ設計入門ガイド」を無料配布資料として公開しています。ぜひ下記より無料でダウンロードし、国内外問わないサイト訪問者の設計にお役立てください。
3. 競合調査・サイト設計
設計したペルソナをもとに、競合調査を行います。競合調査では競合サイトの中でもベンチマークとなるような利用者の多いサイトや、優れたユーザビリティをもつサイトを対象に、ディレクトリ構造やUI/UX、流入経路やコンテンツ数、情報設計などを分析します。
複数の競合調査結果をもとに、サイト設計を行いましょう。またこの時検索結果からの集客(SEO)を見越したキーワード設計を行うのがおすすめです。キーワード設計については下記の記事でまとめています。
関連記事:SEOキーワード選定の方法6ステップ|おすすめツールや注意点も
また多言語サイトのSEOは以下の記事を参考にしましょう。
関連記事:多言語サイトでのSEOのポイント5選|Google公式情報を元に解説
4. デザインコンセプト制作
ペルソナ設計やサイトの仕向地などを考慮し、デザインコンセプトを作成します。作成する多言語サイトは、異なる文化背景を持つユーザーがアクセスします。そのため色彩の感じ方や記号の解釈は地域によって異なることを踏まえてコンセプトが重要です。
5. コンテンツ制作・翻訳
ここで今までのペルソナに対し、コンテンツの作成を行います。コンテンツの完成後、対象の言語への翻訳に移ります。
ここで重要なことは、各言語に適した翻訳を行うことです。単純にコンテンツを一言語から別の言語に直訳するだけでは不十分。言語は単に言葉を交換するだけではなく、感情やニュアンス、文化的な背景を伝えるためのツールです。したがって各言語に対応した翻訳を提供するためには、自動翻訳をそのまま公開するのではなく、翻訳後の文章をプロの翻訳者によるポストエディットにより違和感の少ないものへと編集する必要があります。
6. 開発
ここでの開発はデザイン制作やシステムの開発(Webサイトのコーディングや必要なツールの導入など)、テストを指します。
デザインが完成後、翻訳後のテキストを当てはめて、言語ごとにデザインの調整が必要になる点に注意しましょう。同じ内容でも言語によって文字数が大きく異なり、デザインに収まらない可能性があります。
編集と開発ではある程度ループが発生するものと思っておきましょう。
7. 公開・運用・改善
テストで問題がなければ公開です。ただ多言語サイトはリンクの設定などが複雑になりやすく、予期せぬことも起こり得ます。サポートが充実した制作会社に依頼することで、問題が起こっても安心です。
また多言語サイトとはいえ、国内向けのWebサイト同様にリリースしただけでは十分な効果は期待できません。リリース後はオンライン・オフラインでのマーケティングを開始し、運用・改善を繰り返していきましょう。
既存Webサイトを多言語対応サイトにする方法
次にすでにあるウェブサイトを多言語対応サイトに変換する方法について紹介します。既存サイトを変換する場合は、まったく新しくサイトを作成するよりも手間が少ない場合が多いです。
翻訳する言語・ページの選定
まずは対応させる言語と既存サイトから翻訳を行うページの洗い出しを行いましょう。全ページを対応させる場合もありますが、展開するページ数が増えるとそれだけ翻訳費用や開発費用がかさむことになります。
また運用の手間も増えるので、海外展開しない製品やサービス、現地採用を行わない場合の採用情報、国内向けのニュースなどの海外をターゲットとしない情報が掲載されたページはなるべく対象としないようにしましょう。
翻訳
対象ページを対応予定の言語へ翻訳をしていきます。予算によっては自動翻訳や機械翻訳のツールを使用するケースもありますが、職種によっては実際のビジネスで利用できるような内容にはなかなかなりづらく、プロの翻訳者による編集はある程度必須だと思いましょう。
なおツールの翻訳をそのまま公開すると、誤訳の可能性や翻訳先の文化を踏まえない直訳から、意図が間違って伝わってしまうリスクがあります。
URL設定
翻訳後のページそれぞれにURL設定を行なっていきましょう。
翻訳後のページURLの設定方法は主に次の4つです。
- 国別のドメイン(例:https://sample.us)
- gTLD を使用するサブドメイン(例:https://us.sample.com)
- gTLD を使用するサブディレクトリ(例:https://sample.com/en-us)
- URLパラメータ(例:https://sample.com?en-us)
ただSEOの観点から、URLパラメータで方法は推奨されていません。Googleは各言語のページに固有のURLが割り振られることを推奨しており、パラメータで言語を分けると検索エンジンからパラメータありの翻訳後のページがオリジナルと認識されてしまう可能性があります。
また「.jp」や「co.jp」などの国別ドメインを使用している場合は、多言語展開する際は展開先の国別ドメインでの展開がおすすめです。というのも、日本の国別ドメインの直下に多言語ページを作成してしまうと、多言語対応したページが日本以外の国をターゲットにしていることを検索エンジンに伝えられなくなってしまうのです。
これらを踏まえて、URLを決定していきましょう。
多言語サイト制作の3つのコツ
ここからは多言語サイト制作のコツを以下3つ、紹介します。
- 自動翻訳コンテンツの使い所を意識する
- 自社にとって運用管理しやすいシステムとする
- 言語の切り替えボタンを設置する
自動翻訳コンテンツの使い所を意識する
自動翻訳コンテンツの使い所を意識することが重要です。
現在Google翻訳やDeepL、ChatGPTなどの機械翻訳ツールが多言語展開の選択肢となっています。これらはコスト面でメリットがあるとされる一方、翻訳精度に課題があります。たとえ「90%以上の精度」を謳う機械翻訳でも、ビジネス現場で使える部分は約40%で残りはそのまま公開するのがリスクになることも。
これに対応するため「ポストエディット」と呼ばれるプロの翻訳者による編集作業です。この方法は機械翻訳の精度を補いつつ、品質のバランスを取ることが可能で、近年需要が増えています。
しかしポストエディットのコストは機械翻訳の精度と求める訳文のレベルによるため、事前に用語や用法を登録しておく準備(プレエディット)や翻訳エンジンの特性理解が重要です。特に英語以外の言語については精度が大きく落ちる可能性があるので、編集コストが増大することもあります。
よって機械翻訳を活用する際は使いどころが重要です。メッセージの種類により、はじめからプロの翻訳者による翻訳を行うパターン、機械翻訳+ポストエディットでコストパフォーマンスのバランスをとるパターン、または誤訳が問題にならないケースでの機械翻訳のみ、とケースバイケースで使い分けましょう。
自社にとって運用管理しやすいシステムとする
多言語サイトを制作する際は、自社が運用しやすいシステムを構築することが重要となります。
例えば現地法人にコンテンツの更新を任せる場合、管理画面が多言語に対応していないと更新が難しいでしょう。せめて日本語と英語の両方に対応するようにはする必要があります。また操作自体もシンプルで、使いやすいUIのシステムを選ぶことで、更新頻度を落とす要因を減らすことができます。
他にも対応言語を順次増やす予定がある場合は、スケーラビリティのないシステムで多言語サイトを組んでしまうと言語を増やす際に余計なコストがかかってしまう可能性も。
このように自社の運用体制や、今後の計画に沿ったシステムとすることで、リリース後もスムーズな運用が可能になります。
言語の切り替えボタンを設置する
ユーザーが自身で言語に切り替えられるよう、言語の切り替えボタンの設置は必須です。切り替えボタンは通常、サイトのヘッダーやフッターに設置されます。また各言語の名前はその言語で表示すること、プルダウンで表示する際はデフォルトの表示部分に「日本語」と日本語で書かないことなどを注意することで、ユーザーにとって切り替えやすいインターフェースを提供することが可能となります。
関連記事:多言語サイトの「表示言語切り替え」の実装方法は?実装のポイントも
おすすめの多言語サイト制作ツール
最後に、多言語サイト制作に便利なツールを以下の3つ紹介します。
- WOVN.io
- Cloud Translation
- WPML
WOVN.io
WOVN.ioは1行のスクリプト挿入で導入可能という簡単さで、既存のウェブサイトを多言語対応サイトに変換できるツールです。動的コンテンツの多言語化や自動翻訳機能・ネイティブ翻訳にも提供しており、スピーディな多言語コンテンツ公開を可能にします。
さらに各言語のURL発行やhreflangタグの自動生成などのSEO機能により、多言語化したウェブサイトの検索エンジンランキング向上にも寄与します。
Translation AI
Translation AIは、Googleが提供する強力な機械翻訳サービスです。ユーザーが自身のアプリケーションやウェブサイトを世界中のユーザーに利用できるようにすることを可能にします。高度なAI技術を利用して、50以上の言語を翻訳することができ、リアルタイムのテキスト翻訳も可能です。また、API経由でアクセスすることができ、開発者が容易に組み込むことができます。
Translation AIの詳細はこちらから
WPML
WPMLは、WordPressサイトの多言語化を容易に行えるプラグインです。
サイトのコンテンツを自動翻訳が可能で、かつその結果を手動で修正し質の高い翻訳結果を得ることもできます。さらにSEOに配慮した機能が装備されており、各言語版のページが検索エンジンに適切にインデックスされるようサポートを受けられます。また300以上の言語をサポートし、Webサイトの全ての要素(投稿、ページ、カテゴリー、カスタムフィールドなど)の翻訳が可能で、ユーザーは自分の母国語でのサイト操作が可能です。
多言語サイトはリリース後のマーケティングが重要
この記事では多言語対応Webサイトの制作方法について紹介しました。この記事の情報を、企業の海外進出の足がかりにしましょう。
また多言語サイトはリリース後のマーケティングが重要です。
上でも紹介した通り多言語サイトといえど内容としては単一言語のWebサイトと変わらないため、リリースするだけで新規顧客の獲得に成功する、とはなかなかなりません。そこでリリース後にもマーケティングを滞りなく進めていく必要があるのです。
ここでおすすめしたいCMSがLeadGrid。LeadGridとは株式会社GIGがWebサイト制作をする際に利用するCMSで、多言語に対応しているのはもちろんリード獲得周りのマーケティングに強いのが特徴です。リードマグネットの自動ダウンロード機能やフォームの作成・編集機能もあるため、多言語サイトのリリース後のマーケティングをスムーズに進めるサポートをします。
もちろんAPI連携の機能もあるので、各種多言語サイトツールやマーケティングオートメーションツールとの連携も簡単です。
LeadGrid BLOG編集部は、Web制作とデジタルマーケティングの最前線で活躍するプロフェッショナル集団です。Webの専門知識がない企業の担当者にも分かりやすく、実践的な情報を発信いたします。
Interview
お客様の声
-
採用力強化を目的に更新性の高いCMSを導入し、自社で自由に情報発信できる体制を実現した事例
株式会社ボルテックス 様
- # 採用サイト
- # 採用強化
- # 更新性向上
Check -
直感的な操作性・自由に構成を変更できる柔軟性により、理想のサイト運営が可能になった事例
株式会社フォーカスシステムズ 様
- # コーポレートサイト
- # 更新性向上
- # 採用強化
Check -
ロゴ・サイト・モーション、すべてのデザインに世界観を込めたリブランディング事例
circus株式会社 様
- # コーポレートサイト
- # 更新性向上
- # リブランディング
- # 採用強化
Check -
物流DX企業として信頼いただけるようなサイトデザインに刷新し、SEO流入も増加した事例
三菱商事ロジスティクス株式会社 様
- # コーポレートサイト
Check
Works