ユーザーに1つ以上のアイテムを選択させたい場合、HTMLの正確に正しいフォーム要素は<select multiple>
。
<select multiple id="sel">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<option>Option 4</option>
<option>Option 5</option>
</select>
これは次のようになります。。
ユーザーは次の方法で複数の要素を選択できます Ctrl または Shift アイテムをクリックします。
これはブラウザで使用される標準ウィジェットですが、これはこの種の入力を表示する最良の方法ですか?ユーザーはそれを理解していますか?
指示を追加することはできますが、私の意見では、そのような指示が必要な場合は、おそらく悪い設計です。良い代替案はありますか?それを置き換えるJavaScriptウィジェットでしょうか?
つまり、平均的なユーザーはそれを理解していません。
チェックボックス付きのすべてのオプションを表示するか、チェックボックス付きのドロップダウン( 例 、機能ドロップダウンを参照)などのおしゃれなものを試すことができます。ただし、これはテストする必要があります。
Philがお役に立てば幸い
これはディスカッションで頻繁に発生しますが、決定的な代替案がまだ見つかっているかどうかはわかりません。以前のUXExchange/StackExchangeの議論はいくつかのアイデアを与えるかもしれません:
http://www.suumit.com/projects/bsmSelect/examples/index.html
つまり、複数選択の「推奨」機能の私のお気に入りの実装です。あなたが説明するように、それはリストではなくドロップダウンベースです。選択はチェックされていません。これは、6つの値のようなリストに対して処理するのが非常に困難です。一度にチェックしたすべてを確認することはできません。入力フィールドに選択を配置することは、私が見たかなりの数よりも優れています。入力フィールドのスペースがすぐに足りなくなるため、これは役に立ちません。
「3つの選択」を実行するものをいくつか見ましたが、これも役に立たないものです。何を選択したかを知る必要があります。私にとって、これはユーザビリティのすべての基準を満たしています。
フィルは正しいです。同じウィジェットを使用することもできますが、CTRL/Shiftキーの使用を削除します。チェックボックスが不適切であることが判明した場合、それはかなり自己文書化するソリューションになります。