web-dev-qa-db-ja.com

フォームフィールドのツールチップと単純なヘルプテキスト。何が最も効果的ですか?

あなたの経験では、ユーザーが入力する必要がある特定のフィールドに関する詳細情報をユーザーに提供するための最良の(ユーザーエクスペリエンス)方法は何ですか?これらのフィールドはSAASのセットアッププロセスの一部であることに注意してください。

ツールチップは、フィールドの横にヘルプテキストを表示するよりもうまく機能しますか?

プレーンなヘルプテキストが使用されている場合、それらを表示するのに最適な場所はどこですか? (フィールド名の下、ボックス、または右側?)

これについてのあなたの考えを聞いてみたいです。さまざまな種類のヘルプテキストの効果を比較するリソースをオンラインで見つけることができませんでした。

4
user3676159

スマッシングマガジンにはこのトピックをカバーするかなり良い記事があります しかし、私はそれを何年にもわたって私のために十分にテストしてきたいくつかの簡単なヒントに要約します。


1.垂直方向のレイアウトが最もわかりやすい

フォームフィールドの真上にラベルを配置し、直下にヒントを配置します。

空のフィールド内にプレースホルダーテキストを追加するのが適切な場合もありますが、垂直レイアウトはパンとバターです。

vertical form fields


2.インライン検証は、すべてのエラーを一度にリストするよりも優れています

フォームフィールドがフォーカスを失った場合、何かがおかしいときはすぐにユーザーに通知するのが常に良いので、後でそれを理解する必要はありません。 inline validation


3.寛容な入力は厳密な検証よりも優れています

ユーザーが提供するすべてのものに満足する。特定の方法で住所と電話番号を入力させないでください。検証を回避できない場合は、すぐにインラインフィードバックを提供してください。

forgiving inputs


4.少ないフィールドは、複数のフィールドよりも優れています

最後の手段としてユーザーからの入力のみを求めてください!それを完全に知る必要がない場合は、ユーザーに提供するように依頼しないでください。 (または、少なくとも、どのフィールドが必要かを知らせて、上に配置します)

fewer fields


5.自然言語は冷たい硬いフィールドよりも優れています

状況に応じて、自然言語を使用すると 変換率が標準のフィールドリストよりも28%増加します と示されています。

natural language

6
DaveAlger

私の意見:

テキストが本当に役立つ場合は、ツールチップで非表示にしないでください。本当に役に立たない場合は、ツールチップで画面を乱雑にしないでください。

本当に役立つテキストの場合、理想的にはラベル自体の一部です。

Field Title (helpful text here):
[                              ]
1
DA01