言語スイッチャーは、多言語サイトを構築する際に注意を払うことが重要な多言語 Web サイトの要素の 1 つであり、 Drupal 多言語 Web サイトもその 1 つです。
言語スイッチャーは、Web サイトにアクセスするときに別の言語に切り替えるために使用される言語切り替えボタンです。 言語スイッチャーを訪問者にとって使いやすいものにすることは、ユーザー エクスペリエンスを向上させ、SEO を最適化できるため重要です。
では、 Drupal 用の言語スイッチャーをどのように設定すればよいのでしょうか?また、Web サイトにとってはどのようなメリットがあるのでしょうか? 以下の説明を読み続けてください。
多言語 Drupal Web サイトにとって言語スイッチャーの作成が重要なのはなぜですか?
ユーザーフレンドリーな言語スイッチャーを開発することは、多言語 Web サイトを成功させるために非常に重要です。 Drupal用のセットアップ言語スイッチャーを作成することが有益な理由は以下のとおりです。
- 強化されたユーザー エクスペリエンス:ユーザー フレンドリーな言語スイッチャーにより、言語間のシームレスな移行が容易になり、ナビゲーションとコンテンツの理解が簡素化されます。 これにより、全体的なユーザー エクスペリエンスが向上し、フラストレーションが軽減され、エンゲージメントが向上します。
- 直感的なナビゲーション:ユーザーは言語スイッチャーを簡単に見つけて利用できる必要があります。 直感的に設計されたスイッチャーは、明確な配置と簡単に認識できるアイコンやラベルを備えており、ユーザーは言語を簡単に切り替えることができます。
- 直帰率の削減:ユーザーフレンドリーな言語スイッチャーにより、直帰率の削減に役立ちます。 訪問者が好みの言語を素早く見つけて選択できると、サイトに留まり、コンテンツを探索し、コンバージョンに至る可能性が高くなります。
- 明確なコミュニケーション:言語スイッチャーにとって、ユーザーとの効果的なコミュニケーションは不可欠です。 明確かつ簡潔なラベルや記号は、利用可能な言語オプションを伝え、混乱を最小限に抑え、ユーザーが十分な情報に基づいて選択できるようにするのに役立ちます。
- SEO の最適化:検索エンジンは、Web サイトをランク付けするときにユーザー エクスペリエンスを考慮します。 適切に実装されたユーザーフレンドリーな言語スイッチャーは、多言語 SEO にプラスの影響を与え、複数の言語で検索するユーザーに対するサイトの可視性とアクセシビリティを向上させます。
Drupalの言語スイッチャーをセットアップするにはどうすればよいですか?
言語切り替え機能は通常、Web サイト翻訳サービスによって提供されます。 この機能は、ユーザーが設計したい内容のニーズに応じて調整できます。
ただし、すべての翻訳サービスがカスタマイズや使いやすい言語切り替え機能を提供しているわけではありません。 したがって、多くの CMS を提供し、それらと互換性のある自動翻訳サービスを探すことが重要です。その 1 つが Linguiseです。
Linguise自動翻訳は、柔軟で簡単にカスタマイズ可能な言語切り替え機能を提供し、 Drupalと統合されてい。
次に、 Drupal Web サイトの言語スイッチャーを設定する方法を説明します。 以下の説明を読み続けてください。
ステップ 1: Linguise アカウントを登録する
ステップ 2: ドメイン Web サイト Drupalを追加する
Linguise内で翻訳が必要なDrupalのドメインを追加する必要があります 以下を含むいくつかのフィールドに入力する必要があります。
- アカウント
- URL
- プラットフォーム/CMS
- 言語
- 翻訳言語
- URLを翻訳する
ステップ 3: 言語スイッチャーをアクティブにする
すべての設定が完了したら、次のアクションとして、言語切り替え設定を入力し、言語移行中のユーザーの利便性を高めるためのフラグを表示することが含まれます。 Linguiseダッシュボード > [設定] > [クリップボードにコピー] に移動して、 Linguiseにあるコードをコピーします。
Drupalを利用できます。 に移動するだけです。
最後に、スクリプトの場所を必ず検証または検証してください。
言語スイッチャーは、最初は Web サイトの右上隅にフローティング位置で表示されます。 好みに基づいて柔軟にカスタマイズできます。
ステップ 4: メインディスプレイのセットアップ
Linguise[設定]に移動することで、言語スイッチャーをカスタマイズするオプションもあります。 この領域内で、言語フラグの表示設定に進みます。 このセグメントに実装された変更は、Web サイトの言語スイッチャーに自動的に反映されます。
初期セットアップでは、さまざまなコンポーネントに焦点を当ててプライマリ ディスプレイを調整します。
最初に考慮すべきことは、言語リスト表示フォームの構成であり、サイドバイサイド、ドロップダウン、またはポップアップの 3 つのオプションから選択できます。 左側には各フォームのプレビュー表示があります。
以下に示す最初の形式は、並列レイアウトです。
次のフォームは、以下に示すようにドロップダウンの形式になります。
最後にポップアップフォームがあります。
次に、次の手順では、言語スイッチャーの配置を決定できる位置の構成を行います。 位置の選択肢は複数あるので、訪問者の目に留まりやすい位置を選択してください。
最後に、国旗 + 言語名、国旗 + 短縮名、または国旗のみのいずれかの組み合わせの優先順位を決定します。
ステップ 5: フラグのデザインを設定する
その後、主表示セクションの下に、旗のデザイン構成が表示されます。 以下の画像は、利用可能な設定オプションの一部を示しています。
- 言語名の表示: 「ドイツ語」や「ドイツ語」など、国または言語に基づいて名前を表示するかを選択できます。
- 英語の国旗タイプ:このオプションは、「英語 USA」や「英語 イギリス」(スペイン語、台湾語、ドイツ語、ポルトガル語と同様) など、複数のバリエーションがある言語に適用できます。
- 旗のスタイル:この設定では、旗のアイコンの形状を円形にするか正方形 (長方形) にするかを定義できます。
ステップ 6: フラグの色とサイズを設定する
旗のデザインを設定したら、色や大きさなどさまざまな要素を調整します。 次のインターフェイスでは、次のような多数のカスタマイズ可能な設定を使用できます。
- Flag border-radius:長方形を使用する場合の境界線の半径をピクセル単位でパーソナライズします。
- 言語名の色:言語名のデフォルトのテキストの色を選択します。
- ポップアップ言語の色:ポップアップまたはドロップダウン領域の言語タイトルの色。
- フラグのサイズ:フラグのサイズを変更します。
- 言語名のホバー色:言語名の上にマウスを置いたときのテキストの色。
- ポップアップ言語のホバー色:ポップアップまたはドロップダウンの言語タイトルの上にマウスを置いたときのテキストの色。
ステップ 7: フラグ box-shadow を設定する
最後のフェーズでは、フラグのシャドウ設定を構成するオプションがあります。 初期設定では、Web サイトに表示される各フラグの影を指定できますが、その後の設定は、言語フラグの上にマウスを移動したときの影の効果に関係します。
言語スイッチャーのカスタマイズ設定を保存するには、[保存]をクリックしてください
Drupalの言語スイッチャーを構成したら、言語スイッチャーから期待できる結果を次に示します。
Drupal Web サイト用のユーザーフレンドリーな言語スイッチャーを作成するにはどうすればよいですか?
Drupal用の言語スイッチャーを確立するプロセスが完了したら、Web サイトのさまざまな利点を高めるために、ユーザーフレンドリーな言語スイッチャーを作成する方法を理解することが不可欠です。
- 認識可能なアイコンまたはフラグ:よく知られた言語のアイコンまたはフラグを利用して、さまざまな言語を表します。 選択したアイコンまたはフラグが視覚的に目立つようにし、明確にするために広く認識されるようにします。
- 戦略的な配置:言語切り替えツールを Web サイト上で目立つように配置します。理想的には、ヘッダー、フッター、ナビゲーション メニューなどのすべてのページにわたって一貫して配置します。 翻訳ツールの視認性と簡単なアクセスを確保します。
- フラグの言語ラベル:各言語オプションにそれぞれの言語で明確にラベルを付けます。 たとえば、英語には「English」、スペイン語には「Español」、ドイツ語には「Deutsch」などを使用します。これにより、ユーザーは好みの言語を簡単に識別して選択することができます。
- 革新的なデザイン:翻訳ツールに革新的なデザインを採用し、馴染みのある記号やテキストを利用して言語の選択を示します。 たとえば、英語の場合は「EN」、ドイツ語の場合は「DE」を使用します。 明確な色や強調表示を使用して、言語切り替えツールが目立つようにします。
- ユーザーフレンドリーな切り替え:デフォルト言語が好みに合わない場合に、ユーザーが別の言語に切り替えるプロセスを簡素化します。 言語選択には、ドロップダウン メニュー、フラグ/アイコン リスト、またはトグル ボタンの使用を避けてください。
- 応答性の高いデザイン:言語切り替えツールの応答性が高く、さまざまなデバイスや画面サイズにわたってシームレスに機能するようにします。 すべてのユーザーにスムーズなエクスペリエンスを保証するために、デスクトップ、スマートフォン、タブレットでその機能をテストします。
