web-dev-qa-db-ja.com

選択(ドロップダウンリスト)のデフォルト値は何ですか?

選択/ドロップダウンリストをデザインする際のベストプラクティスは何でしょうか。一部のプロジェクトでは、フォームの選択で作業しましたが、リストの最初の値が入力されました。他のプロジェクトでは、ユーザーが何かを選択する前に、常に「-select-」オプションを選択していました。空のフィールドも想像できます。

ガイドラインはありますか?この問題における最新技術とは何ですか?

3
Landeeyo

そのようなガイドラインはありませんが、ほとんどの設計システムはドロップダウンの使用方法に関する洞察を提供します。以下にいくつかの例を示します。

素材デザイン:露出ドロップダウンメニュー

IOS-ピッカー

傍注、Appleは通常、ドロップダウンが好きではありません。選択した他のページ全体に移動します。

Microsoft Fluent設計ガイドライン

まさにあなたが探しているものではありませんが、一見の価値があります。

一般的なガイドライン(私の経験から)

デフォルトのドロップダウン:説明-デフォルトの状態のドロップダウン。例-フォントを選択できるドロップダウン。デフォルトのフォントが常に選択されています。ガイドライン-デフォルトのオプションが選択されたプレースホルダーを提供します。

No Stateドロップダウン:説明-デフォルトの選択状態を知る方法がないドロップダウン。例-国籍を選択するために使用されるドロップダウン。ガイドライン-説明用のプレースホルダーを使用してください。上記の例では、プレースホルダーは「国籍を選択」または「選択」でも可能です。

フィールド固有のドロップダウン:説明-事前定義された目的を持つドロップダウン。例-カレンダー、時間セレクター、ユーザー名/プロファイルの選択。ガイドライン-フィールド固有のプレースホルダーを使用します。カレンダー入力を設計している場合、プレースホルダーはその日の日付を指定します。時間セレクターには、現在の時間を表示する同様のプレースホルダーがあります。プロファイルのリストから単一のプロファイルを選択するためのプロファイルセレクターでは、現在のプロファイルがプレースホルダーとして使用されます(参照:facebook)。

これが^ _ ^お役に立てば幸いです

6
Chemicalinck

ここには「ベストプラクティス」はありません。これら2つのオプションは完全に異なります。

事前選択-オプションの1つが最も可能性が高いと信じる理由がある場合(これは、最も人気のある/可能性の高いオプション、またはユーザーについて知っているデータに基づく可能性があります)または知っている場合に使用しますデフォルトまたは現在のオプション(変更するために選択できるものですが、オプションはすでに有効になっています)、またはそのオプションでユーザーをプッシュする場合。

空白または「選択してください」-わからない場合や、ユーザーが意識的に選択する必要がある場合は、これを使用してください。ラベルを付けるか、空のままにするかは、別の選択です。

5
vsvec

説明テキストをドロップダウンアイテムとして含めますかいいえ

すべてのフィールドにラベルを付ける必要があります ドロップダウンラベルは常に表示する必要があります 。これにより、ユーザーが選択できる十分なコンテキストが提供されます。いずれにしても、選択後の指示ドロップダウンの選択肢は消え、すでにラベルが提供しているものと比較して冗長なノイズが追加されます。

X Collective-デフォルトではドロップダウンで「選択してください」にしないでください によると:

空のフィールドがある場合、ユーザーに「選択してください」と指示する必要はありません。さらに重要なのは、ユーザーがフォームをスキャンして空のフィールドを探すことです。

フォーム入力にデフォルト値を追加しますたぶんそうではない

X Planet-フォームのドロップダウン によると:

ユーザーの大部分(おそらく90%)がその値を選択すると思われる場合を除いて、 デフォルト値を使用しない にする必要があります。特に必須フィールドの場合。

なぜ?人々がフォームをすばやく通過するため、エラーが発生する可能性があるためです。——すべての選択肢を解析するのに時間がかかり、すでに価値のあるものを誤って見落とす可能性があると想定しないでください。

関連項目:

1
KyleMit