すぐに、または「i」をクリックした後にのみツールチップを表示する
ローン申し込みフォームを持っています。すべてのフィールドが必須であり、それらのほとんどは説明ツールチップを取得しました。ツールチップをどのように表示するかについては、苦労しています。ユーザーがフィールドの背後にある「i」アイコンをクリックするか、フォーカスのツールチップを表示するまで、それらを非表示にしますか？
テストを実施しましたが、結果は10:10と決定的ではなかったため、明確な結果はありません。
pS私の悪い発音と文法のスキルを失礼します;）
これをテストしたとき、質問はどのように表現されましたか？
それは：
「このフォームに記入していただけますか？どちらがよかったですか？」
それともそれは：
「ツールチップを呼び出す方法として、どちらがいいですか？」
後者の場合、「i」をクリックすることに賛成して、結果に誤って影響を与えた可能性があります。質問自体が「i」をクリックすることをユーザーに説明するためですが、実際には、すべてのユーザーがそれを知っているわけではありません。です。
A/Bテストは有益だと思うので、口頭でのユーザーフィードバックではなく、より客観的な指標（つまり、完了までの時間、正確性、放棄）を使用できます。
結局のところ、ユーザーのアクションは言葉よりも雄弁です:)
（@inkmarbleで述べたように）マウスオーバーに比べてクリックの方が手間がかかる場合がありますが、タッチ専用デバイスを使用するユーザーの増加にも留意する必要があります。現在の最新技術では、タッチデバイスのアイコンにマウスオーバーする方法がないため、このユーザーグループはこのヘルプ情報にアクセスできません。
例：以前に使用したために存在することがわかっていた編集オプションが見つからなかったため、最近Facebookに非常に不満を感じました。しばらくして、テキストエントリにカーソルを合わせたときにのみ表示されるこれらの灰色の小さなアイコンの1つなのかどうか疑問に思いました。私のデバイスはコンバーチブルなので、モードを切り替えることができました。そうしないと、テキストをまったく編集できませんでした。
別のWebページでは、これを異なる方法で解決しました。彼らは単に両方を行いました。ヘルプテキストは、その上にマウスを置くと表示されますが、onclickも表示されます。これは、タッチデバイスや、離れた場所にいてもテキストを表示したままにするマウスユーザーに適しています。同時に、「通常の」マウスオーバーユーザーに害を与えることはありませんでした。全体として、技術的に実現可能な場合は、ハイブリッドアプローチも試してみます。
tooltipは通常、短い説明フレーズです-「5または6ワード」または「1-2短い行」である必要があるという提案を私は見ました。それらはもともとボタンやフィールドの役に立つリマインダーとして意図されていて、詳細を知っていてもリマインダーを必要とするユーザーを対象にしていました。
表示しているヘルプ情報は、たぶん時折または初めてのユーザーを対象とした、かなり充実したもののようです。
ハイブリッドアプローチを使用することをお勧めします。
- マウスオーバーすると、最後に「（Click for more）」（もちろんローカライズ済み）を含む従来のツールチップが表示されます
- ユーザーがクリックした場合は、追加の情報を含む大きなヘルプテキストを表示します。
ローンを申請する人は、知識を持っているか、初心者かもしれません。どちらの場合でも、「i」アイコンは有益なので、マウスをホバーすると、説明ボックスがページにポップオーバーします。クリックはマウスホバー以上の努力です。
他の方法は、すべての情報をフォームのRHSに揃えることができます-場所に割り当てられた番号を使用して-ユーザーが情報の「i」アイコンにマウスを合わせる必要さえなく、そこに簡単に座っていることができるなどです。情報が長すぎる場合は、「i」アイコンが残り、フォームを中断することなく、情報がRHS列内に表示されます。
@inkmarbleは正しいです。ラベルは右揃えにする必要があります。
「EUR」コードの位置を変更できます。単一の要素内で左揃えに見えます。
デフォルトにする最初のフィールドに焦点を当てる必要があります。そのため、テキストフィールドにフォーカスを合わせると、テキストフィールドの近くにヘルプテキストを表示できます。それは理にかなっているはずです、ユーザーはそのフィールドに入っている間読むことができます。
テキストフィールドの幅を再確認してください。 （金額の最大桁数）
注：「i」にマウスを合わせると、ユーザーはデータを入力するときにヘルプテキストを見つける必要があります。