Duda のウェブサイトに言語スイッチャーを設置することで、ユーザーの言語変更プロセスが簡素化されます。この機能は、特にグローバルユーザーを対象とするプラットフォームにとって有益であり、ユーザーは好みの言語でコンテンツにアクセスできるようになります。.
Duda ウェブサイトに言語スイッチャーを実装するには、言語スイッチャーオプションをサポートする翻訳ツールを使用する必要があります。そこでこの記事では、自動翻訳サービスツールの1つを使用して Duda に言語スイッチャーを設定する手順について説明します。.
Duda ウェブサイトの重要な言語切り替え機能
Duda Web サイトに言語スイッチャーを設定すると、いくつかの重要な目的が達成されます。その目的には次のようなものがあります。.
- グローバルユーザー向けのアクセシビリティ向上：言語切り替え機能により、様々な国の訪問者が好みの言語でサイトを閲覧できます。この機能により、ユーザーエクスペリエンスが大幅に向上します。
- 国際的なSEOパフォーマンスの向上：複数の言語バージョンを提供することで、 Dudaサイトは外国語の検索結果でより高いランキングを獲得できます。例えば、ウェブサイトのドイツ語バージョンは、ドイツ語のGoogle検索で表示される可能性が高くなります。
- コンバージョン率の向上：コンテンツを複数の言語で提供することで、売上にプラスの影響を与えることができます。例えば、顧客が言語を切り替えられるeコマースプラットフォームは、より幅広い顧客基盤を獲得し、購入数を増やすことができます。
- ユーザーエンゲージメントとリテンションの向上：言語スイッチャーは、サイト上でのユーザーセッションを延長させる効果があります。例えば、コミュニティフォーラムで好みの言語で交流するユーザーは、より長い時間エンゲージメントを維持する傾向があります。ユーザーが母国語のサイトで過ごす時間は通常、第二言語のサイトに比べて2倍であるため、このエンゲージメントの向上は大きな意味を持ち、ユーザーリテンション率の向上につながります。
Duda ウェブビルダーで言語スイッチャーを設定する方法
Duda 多言語ウェブサイトにとって、言語切り替えの重要性を理解することは非常に重要です。多くのウェブサイト翻訳サービスがこの機能を提供していますが、ご自身の要件に合ったサービスを選ぶことが重要です。.
すべての翻訳サービスがカスタマイズ可能でユーザーフレンドリーな言語切り替え機能を提供しているわけではありません。そのため、様々なフレームワークと互換性があり、柔軟な言語切り替え機能を備えた自動翻訳サービスを選択することが重要です。.
Linguise、これらの基準を満たす自動翻訳サービスです。Dudaを含む一般的なCMSやウェブビルダーとシームレスに統合できる、柔軟性が高く直感的な言語切り替え機能を備えてDudaます。
Linguiseと Duda の連携はスムーズで、開発者は多言語サイトに言語スイッチャーを簡単に組み込むことができます Linguiseの高度な機能とユーザーフレンドリーなインターフェースを活用することで、 Duda ウェブサイトにおける言語スイッチャーの設定とメンテナンスのプロセスを効率化できます。.
ステップ 1: Linguise アカウントを登録する
まずは Linguise アカウントを作成してください。30日間の無料トライアルが含まれており、すぐに使い始めることができます。サインアップして Linguise ダッシュボードにアクセスしたら、翻訳を有効にするためにドメインを登録する必要があります。.
これを行うには、ドメイン URL (https:// を含む) をコピーし、プラットフォームとして「その他のクラウドホスト CMS」を選択します。
次に、サイトを翻訳するソース言語とターゲット言語を選択します。.
ステップ2: entriを使用してDNSを自動的に追加する
Linguiseでウェブサイトの登録が完了すると、2つのインストールオプションが表示されます。DNSを自動設定するには、 「DNSを自動的に接続する」をクリックします。Entri機能が利用され、DNSの変更が自動的に処理されるため、セットアップが簡単になります。または、DNSレコードを手動でコピーしてドメインプロバイダーに追加することもできます。
自動オプションを選択すると、Entri は Web サイトの URL をスキャンし、パブリック DNS レコードを確認して必要な設定を決定します。.
次に、「[ドメインプロバイダー] で承認」（例: Cloudflare）をクリックすると、ドメインプロバイダーのログインページにリダイレクトされます。.
ログイン後、Entri は正しい DNS レコード (言語ごとに 1 つと検証キーの TXT レコード) を自動的に挿入します。.
ドメインに追加されたDNSレコードが表示され、EntriがDNS設定完了の確認メッセージを表示します。DNSエントリが伝播された後、通常20～30分以内に変換機能が有効になります。.
手動セットアップを選択する場合の手順は以下をご覧ください。.
ステップ 3: DNS レコードをコピーする
ドメインの検証が完了すると、必要なDNSレコードをコピーできる画面が表示されます。これらのレコードは、fr.domain.com、es.domain.comなどの多言語ページを読み込むために不可欠です。.
次に、ドメインマネージャーにログインし、DNS設定セクションに移動します。以下の項目を追加する必要があります。
- ドメイン検証用のTXTレコード
- 対象言語の1つ以上のCNAMEレコード
以下は、TXT レコードと CNAME レコードの表示例です。.
すべてのレコードが追加されると、構成は次のセットアップのようになるはずです。.
ステップ 4: DNS を確認する
ドメインにすべてのDNSレコードを追加したら、 「DNS設定を確認」 LinguiseのDNSエントリの横に緑色のドットが表示されます Dudaの翻訳設定を完了することです。
ステップ 5: 言語スイッチャーを有効にする
言語スイッチャーは、ユーザーが好みの言語を選択できるフラグポップアップです。有効化するには、提供されているコードを Duda サイトのページのヘッダーセクションにコピーしてください。これにより、ライブウェブサイトにフラグベースの言語スイッチャーが自動的に表示されます。.
コードはドメイン登録プロセスの最後、またはドメイン設定にあります。クリップボードにコピーしてください。.
次に、ウェブサイト エディターを開き、左側のメニューから [設定] に移動して、 [HEAD HTML] を選択します。
Linguiseを貼り付けて、 「保存」、サイトを公開します。
Linguise 言語スイッチャーが Duda サイトのフロントエンドに表示されるようになります。.
ステップ6: メインディスプレイを構成する
言語スイッチャーの設定を始めるには、 Linguiseの「設定」>「言語フラグの表示」。ここでいくつかのオプションをカスタマイズできます。
- フラグ アイコン スタイル:並べて表示、ドロップダウン メニュー、またはポップアップから選択します。
- 位置：ウェブサイト上の言語切り替えボタンの表示位置を決定します。複数の配置オプションをご用意しておりますので、ユーザーが簡単にアクセスできる位置に設置してください。
国旗と言語名の組み合わせ、国旗と言語の略語、または言語名のみを表示するオプションがあります。ユーザーの認識を向上させ、ナビゲーションを容易にするために、国旗と言語名の両方を使用することをお勧めします。.
ステップ 6: 旗のデザインを設定する
メインディスプレイを設定したら、フラグの外観をさらにカスタマイズできます。.
- 言語名の表示：国または言語自体に基づいて言語名を表示するように選択できます。例えば、「French」や「Français」のように表示できます。
- 英語の国旗タイプ:このオプションは、米国英語やイギリス英語など、地域によってバリエーションが複数ある言語に役立ち、スペイン語、台湾語、ドイツ語、ポルトガル語などの他の言語にも適用されます。
- 旗のスタイル: 旗アイコンの形状を丸型または長方形から選択します
ステップ 7: 色とサイズをカスタマイズする
旗のデザインを設定したら、旗の色やサイズをさらにカスタマイズできます。調整可能なオプションは次のとおりです。.
- フラグの境界半径:長方形のフラグの角の半径をピクセル単位でカスタマイズします。
- 言語名の色:言語名を表示するためのデフォルトのテキスト色を選択します。
- ポップアップ言語の色:ポップアップまたはドロップダウン メニューの言語タイトル テキストの色を設定します。
- 旗のサイズ:デザインに合わせて旗アイコンのサイズを調整します。
- 言語名のホバーカラー:ユーザーが言語名の上にマウスを移動したときに表示されるテキストの色を選択します。
- ポップアップ言語のホバー色:ポップアップまたはドロップダウン メニューの言語タイトルのホバー テキストの色を設定します。
ステップ 8: フラグ box-shadow を設定する
最後に、フラグボックスの影の設定を変更できます。最初のオプションでは、ウェブサイトに表示される各国旗アイコンに影の効果を適用できます。2番目のオプションでは、ユーザーが言語の国旗にマウスを合わせたときの影の効果を管理できます。.
必要な調整をすべて完了したら、「保存」ボタンをクリックして変更を適用します。その後、 Duda のウェブサイトで設定が正常に反映されていることを確認してください。言語切り替えツールの表示は次のようになります。.
セットアップが完了すると、多言語 Duda Web サイトで言語スイッチャーがどのように動作するかを確認できます。.
次に、ウェブサイトをロシア語などの他の言語に翻訳できます。.
Duda ウェブサイトの言語切り替えを最適化するためのベストプラクティス
Dudaに言語スイッチャーを正常に実装した後は、サイトと訪問者の両方に対して機能を最適化するためのヒントを検討することが重要です。
簡単に認識できる言語の旗やアイコンを使用する
Duda のウェブサイトに言語スイッチャーを追加する際は、分かりやすい言語の国旗やアイコンを使用することが重要です。これらの視覚的要素は、ユーザーが好みの言語を素早く認識し、選択するのに役立ちます。例えば、地球儀のアイコンは言語の選択肢を表すものとして広く知られています。国旗も使用できますが、すべての言語が特定の国に関連付けられているわけではないため、混乱を招く可能性があることを覚えておくことが重要です。.
例： Amazonのウェブサイトでは、上部のナビゲーションバーで現在選択されている言語（例：「EN」）の横に小さな地球儀アイコンが表示されています。このシンプルでありながら効果的なデザインにより、ユーザーは現在の言語設定に関わらず、言語オプションを素早く見つけることができます。
国旗と一緒に言語名も記載する
国旗は確かに役立ちますが、単独で使用すべきではありません。国旗やアイコンの横に、その言語の母国語表記で言語名を表示することで、明瞭性が向上し、誤解の可能性を減らすことができます。これは、複数の国や地域で話されている言語の場合に特に重要です。.
例： Airbnbの言語切り替え機能では、言語名と対応する国旗の両方が表示されます。例えば、「英語（英国）」には英国国旗が、「イタリア語」にはイタリア国旗が表示されます。この組み合わせにより、ユーザーは希望する言語オプションを正確に選択できます。
言語切り替えボタンの位置を慎重に考える
言語スイッチャーの配置は、ユーザーのアクセシビリティにとって非常に重要です。一般的な配置場所は、ヘッダーの右上、フッター、メインナビゲーションメニュー内などです。重要なのは、メインコンテンツエリアを乱雑にすることなく、簡単に見つけられるようにすることです。.
例： linguiseでは、言語切り替えボタンはページの右上に配置されており、常に目につきやすくアクセスしやすいようになっています。この戦略的な配置により、ユーザーはサイト上のどこにいても、言語オプションを素早く見つけて利用できます。
言語スイッチャーを応答性良く設計する
言語スイッチャーがデスクトップパソコンからスマートフォンまで、あらゆるデバイスで適切に機能することを確認してください。画面が小さい場合は、横並びの選択肢リストではなくドロップダウンメニューを使用するなど、デザインの調整が必要になる場合があります。.
例：ユネスコウェブサイトの言語切り替え機能は、デバイス間でシームレスに適応します。デスクトップではヘッダーに横並びのリストとして表示されますが、モバイルではコンパクトなドロップダウンメニューに切り替わり、モバイルレイアウトを損なうことなく使いやすさを確保しています。
ページ間で言語スイッチャーの一貫性を確保する
Duda ウェブサイトの全ページで、言語スイッチャーのデザイン、機能、位置を統一してください。この一貫性により、ユーザーはどのページを表示していても言語オプションがどこにあるか正確に把握できるため、サイトをより効率的に操作できるようになります。.
例：ウェブサイトでは、ホームページから商品ページ、そしてチェックアウトのプロセスに至るまで、すべてのページのフッターに言語切り替えボタンを一貫して配置しています。この統一性により、ユーザーは閲覧中やショッピング中にいつでも簡単に言語を切り替えることができます。
Linguiseを使用して、 Duda Web サイトに言語スイッチャーを設定しましょう。
