フォーム上のエラーメッセージの配置に最適な場所（一般的および特定の両方）
無効なデータを入力すると、一般的なエラー（例：「フォームにエラーがあります」）と特定のエラー（例：「これは実際のメールではありません」の両方が表示されます。住所"）。
特定のエラーは関連する入力フィールドの横に配置されますが、汎用メッセージをフォームの上部または送信ボタンの横の下部のどこに配置するのが最適か疑問に思っています。
一番上に配置することについての私の考えは次のとおりです...
- 広範なコンテンツ（一般的なメッセージ）は、特定のコンテンツ（メッセージ）にドリルダウンします。
- スクリーンリーダーは、フォーム全体をもう一度調べる必要がなく、フォームの最初に問題が発生したことを通知します（下部にある場合、エラーが発生するまで、そこにエラーメッセージがあることはわかりません） ）
- ユーザーがフォームに戻って特定のメッセージを操作した場合（特にスクリーンリーダーに関連する場合）、一般的なメッセージが下部に表示されることは少し無意味なようです。
- ページのサイズが大きくなった場合（フィールドが追加される可能性があるため）、フォームを送信するとページの再読み込みがトリガーされ、一般的なメッセージが折りたたみの下に表示されます。
一方、下に配置すると...
- エラーを関連する入力（この場合は送信）のすぐ近くに置く習慣を維持します。
- 視覚的なユーザーにとっては、方向性を決めるのが簡単になる可能性があります。固定される最後のものは送信なので、メッセージをメッセージの横に配置すると、スキャンする必要が少なくなります。
エラーメッセージの表示が（インラインではなく）ページ送信に依存している場合は、下部に配置しないことを強くお勧めします。 「送信」ボタンの横に表示されるユーザーの自動反応は、エラーがまだ解決されていないため、そのボタンをもう一度クリックしても意味がありません。最も可能性の高いシナリオは、信じられないほどイライラして、完全に有効なフィールドを変更してメッセージを削除しようとすることです。
その場合、個々のフィールドが修正されたら、それを最上位に配置すると、少なくとも関連性から削除されます。
もちろん、今ではインライン検証に向けた慣例的なシフトがあります。これは、素晴らしい驚きであるか、ユーザーに期待されています。これで遊んでみませんか？
エラーメッセージは、ユーザーが見ている可能性が最も高い場所に表示されます。エラーを表示するためにページ全体をリロードする必要がある技術設計の場合、ユーザーが上部を見ている可能性があります。これは、ユーザーがページをフラッシュまたはクリアして自然に目が移動するためです。一方、（AJAXなどで）ページを部分的に更新できる場合は、送信ボタンのそばにメッセージを配置します。これは、特に検証が高速な場合に、目が当たる場所だからです。
3番目のオプションは、エラーのあるフィールドのみを含むエラーページをオンザフライで作成することです。これはおそらく、フィールドのすぐ上にある特定のメッセージのみを必要とするほどコンパクトです。これにより、ユーザーは2つのエラーメッセージを読んだり、問題のあるフィールドを長い形式で探したりする必要がなくなり、ユーザーが進歩していてフォームに「行き詰まっている」ことがないため、感情的に前向きな体験になる可能性があります。
重大なエラーと「それほど重要ではない」エラーを区別し、それに従って配置することを忘れないでください。たとえば、ユーザーが見逃してはならないエラーは、ユーザーが見そうな場所に配置する必要があり、それほど重要でないエラーはコンテキストに配置できます。大きな赤いエラーでユーザーを怖がらせることは、それ自体のエラーメッセージと同じ大きさでない場合は悪い設計です...