大陸と国のリストをWebページに表示する最良の方法
世界地図とウェブページに表示された2つのリストが繋がっています。 「ルーマニア」リンクにカーソルを合わせると、ルーマニア地域が世界地図で強調表示されます（ jVectorMapフィドルの例 ）。
ご想像のとおり、2つのリストはかなり大きくなる可能性があります。これをユーザーフレンドリーな方法で提示する方法は？気を散らすグラフィックと、グラフィックヒントの欠如、テキストの壁と非表示のリンク、デスクトップとモバイルなどの違いについて考えてください。
大陸名が目立つタグクラウド、大陸にカーソルを合わせるとメニュースタイルのリストが表示され、その国のサブリストが表示されることを考えました。
ユーザーエクスペリエンスの観点から、接続されたリストを表示するための最良のアプローチ（上記の2つに限定されない）を知りたいのです。
また、あなたが言及した分類（国をサブアイテムとして大陸に分類する）は、あなたがそれについても考えたと私が読んだ前に私が持っていた最初のアイデアでした。
これをマウス+キーボードデバイスとタッチデバイスの両方で実行する場合は、別のインタラクティブパターンが必要だと思います。タッチディスプレイ（+10インチディスプレイではない場合）に収まるように小さい地図上でアフリカまたは中央ヨーロッパのどこかの国をタップしようとすると、非常に煩雑になります。代わりに、ユーザーが地図または大陸のリストをクリックすると、その大陸がビューを拡大または置換し、マップコンテナーの領域全体を利用できるようになります。直接操作のインタラクティブパターンを提供する場合（たとえば、アイテムをタップ/クリックする）マップ）十分な大きさのコントロールを提供することを保証する必要があります。そうしないと、インターフェースが扱いにくくなり、使用するのが面倒になります。
あなたはこのようなものを使うことができます
参照： amMap
さらなる改善
- ユーザーが国のリストでアクションを実行する必要があるため、国のリストを地図の上に表示できます
- より良い空間管理のために、国をグループで提示できます（例：アジア、アフリカ、太平洋、ヨーロッパなどの大陸の地域）。
- さらに、各グループはリージョンごとに折りたたむことができるため、一度に1つのリージョンのみが表示されます。
更新
よりコンパクトな外観にするために、Google翻訳が表示言語に使用しているスタイルに従うことができます。現在の国リストと同様のスタイルを使用できます。列ごとに25または20か国を指定すると（少しスクロールして）、206か国を8または10列にリストできます。
国の選択には、一部の 言語の選択に使用したパターン ）を適用できます。
- 大陸ごとにグループ化された複数列のリストにアイテムを表示します。
- 簡略化されたマップを概要/索引として使用します。 3つの垂直エリア（アメリカ、ヨーロッパ-アフリカ、アジア-オセアニア）に分割されたマップが使用されます。リストをスクロールすると、現在表示されている領域が強調表示されます。リージョンをクリックすると、リストが対応するセクションにジャンプします。
- このコンテキストでは、国をさまざまな言語で検索できるようにするために、クロスランゲージ検索をすばやく行うことも役立ちます。
リストとマップの間に追加の接続が必要な場合。リストから国にカーソルを合わせると、マップで強調表示/ズームできます。
ここであなたに「コピー/貼り付け」の回答を作成するのではなく...私が考えていることをあなたの希望に答えるために、クリック可能なワールドビューを持っていますが、ズームインするには数回のクリック-3回のクリックが必要です（および可能性をドラッグして）、選択した国/地域を選択します。例えば：
- ワールドビューをクリックすると、ヨーロッパにズームインします
- ヨーロッパが近づく（クリックポイントを中心に）
- ベルギーをクリックします（クリックポイントを中心に）
- 現在、ベルギーとその周辺の国境が見えています
- （地域/言語を確認するために）地域をクリックします（ベルギーには地域で3つの異なる言語があります-私が知っているもの：NED、FRA、GER）
マップのズームには、表示されている国/言語のリストを伴うことができます。リストは短くなります（または、情報の詳細に応じてより具体的になります）。