web-dev-qa-db-ja.com

入力ボックスがオートコンプリート対応であることをユーザーに伝えるにはどうすればよいですか?

ページの特定のフィールドでオートコンプリートが有効になっていることをユーザーに知らせる適切なグラフィカルサインはありますか?

たとえば、フィールド名は「ドキュメントの作成者」です。そのボックスへの入力を開始すると、ajaxポストバックが実行され、類似した名前を持つ人物のリストが提供されます。ただし、ユーザーがそのフィールドに入力すると、ボックスが多少特殊であるという兆候はありません(さらに、ランダムな名前を入力することはできませんが、リストから選択する必要があります)。

そこで、入力ボックスの背景に配置できるグラフィックアイコンを探しています。らせん(奇妙に見える)、下向きの矢印(紛らわしい、ユーザーにドロップダウンボックスだと思わせる)、チェックマーク(意味がありません)を考えました。

16
naivists

ドロップダウンであることを示す下向き矢印をボックスに表示します。次に、いくつかの小さなヘルプテキストを追加します。これが Atlassian JIRA が問題を解決する方法であり、非常にうまく機能します。

enter image description here

6
Evan

オートコンプリートの選択肢がすぐに表示され、アイコンは必要ない場合に最適です。とにかく、ユーザーはオートコンプリートのアイコンを認識しません。

一致するものがない場合は、テキストを赤色に変更し、メッセージを横(またはドロップダウンリスト、代替を表示する場所)に表示することができます。ユーザーが文字を削除した場合、これを再度検証し、おそらくメッセージを削除する必要があります。

5
Jonas

ポストバックの実行時に表示される回転する円のgifを使用するだけです。これは必ずしも「オートコンプリートロード」を示すものではありませんが、ユーザーが入力の結果として何かが表示されることをユーザーが期待するバックグラウンド通信に十分な頻度で使用されます。

5
Matt

placeholder text (HTML5)またはオートコンプリートについて何かを説明する入力valueを使用することも役立つ場合があります(プレースホルダーテキストは薄い灰色で斜体であり、ユーザーが入力を開始しますが、値を設定すると、私の経験では、テキストカーソルがボックス内にあるとすぐに非表示になるか、古いブラウザー、または場合によってはモバイルブラウザーで非表示になるため、ユーザーは入力前にそのテキストを削除する必要があります。注意して使用してください)。

そうは言っても、ブラウザーと検索エンジンはユーザーをナッジする必要なしに何年もの間これを行ってきたので、対話が迅速に行われる限り、あなたは明確になっているはずです!

2
mnicole