web-dev-qa-db-ja.com

フォームの送信ボタンを無効にするか、送信を許可してからエラーを表示しますか?

Webベースの医療アプリケーションの一部として、いくつかの異なるフォームがあります。これらのフォームにはかなりの数のフィールドがあります-フォームにもよりますが10-20です。それぞれに少なくとも5つほどの必須フィールドがあります。現在、必要なフィールドがすべて入力されるまで、保存ボタンを無効にしています。

すべての必須フィールドに入力する前に送信ボタンがクリックされた場合、デフォルトで送信ボタンを有効にしてからエラーメッセージを表示(および欠落している必須フィールドをハイライト表示)する方がユーザーエクスペリエンスが優れているかどうかについて議論してきました。

何が良いのかについての調査や健全な意見はありますか?フォームがかなり長いため、後者のアプローチに傾いています。フォームを送信してエラーを見つけることは、ボタンが有効になっていない理由を確認するためにフォームを検索する認識負荷よりも効率的かもしれません。

33
Voodoo

ボタンが無効になっているだけの場合、ユーザーは

  1. アプリケーションが壊れていると思います、
  2. 未入力のフィールドがすぐにわからない
  3. フィールドが最後まで埋められていないことに気づかない、これは迷惑です

ですから、同僚にあなたが私たちに言ったことを正確に伝えることをお勧めします。

ボタンを有効にしていない理由を確認するためにフォームを検索する認知的負荷よりも、送信してエラーを見つけることの方が効率的かもしれません。

27

送信ボタンが無効になっている場合は、その理由を必ずユーザーに伝える必要があります。

この場合、無効になっているボタンの原因を説明する短いメッセージを表示してみませんか?

この短いメッセージはフォームの下に表示される可能性があります-赤で表示されるか、別の方法で強調表示されます。そして、このアプローチは私の意見ではより良いユーザー体験を提供します。

おそらくあなたはとにかくJavaScriptなどを持たないユーザーのために他のアプローチを実装する必要があります...

12
caw

[送信]ボタンを有効のままにしておくことで得られる付加価値は、ユーザーが必要なものを気にしないことです。 [送信]をクリックして、完了します。

何かがまだ有効ではない有効でないことを示すために、私たちは邪魔をしません。

enter image description here

ユーザーは引き続き[OK]をクリックできますが、問題が発生した場合は、無効なアイテムにすばやく簡単に注意を向けさせます。私たちはそこにキーボードフォーカスを置いているので、彼らは重要なものに取り掛かることができます:

enter image description here

私自身(および他のユーザーを観察しました)のソフトウェアの使用を通じて、私は何が必要かについて気にしません。そして、私はソフトウェアがすべてが行われた場合にのみ私に保存させてくれることを学びました。そして、ソフトウェアはfocus私が気にしなければならないアイテムさえもします。

したがって、ソフトウェアでの私の手順は次のようになりました:

  1. F5
  2. 画面がまだ開いている場合は、必要なものを入力します
  3. goto 1
3
Ian Boyd

フォーム送信のベストプラクティスは、送信ボタンを無効にして(ある種のビジー状態を示す)、重複送信を回避することです。その問題を混乱させるようなことは何もしませんが、他の理由でボタンを無効にすることはできると思います。

私はあなたがどこから来たのかわかりますが、実際に、あなたが理由のためにボタンを無効にしているなら、ユーザーはその理由を考え出さなければなりません。無効化されたボタンは、要件の間接的なインジケータです。これらの要件を直接示し、余分なステップを回避する方がはるかに優れています。完成したフォームの数が減ります。

また、問題をある程度回避するために、フィールドをインラインで検証する(フィールドの入力後に検証を行う)かどうかを検討することもできます。また、フォームが長く、送信時に多くのエラーが強調される可能性がある場合にも役立ちます。あなたはおそらく送信ボタンを有効にするかどうかを検出するために何らかの検証をすでに行っているので、インライン検証を実行するのに大きな飛躍はありませんか?成功インジケータを目立つように、永続的で、フォームフィールドの外に置きます。

インライン検証の主題についての詳細 A List Apartサイト には、インライン検証が特定のフォームに適しているかどうかの考慮事項など、役立つ情報がいくつかあります。たとえば、より難しい質問ではより有用ですが、すべてではないが一部の質問でそれを使用することの矛盾は議論の余地があります。

(これらの変更を確認するA/Bテストを検討して、結果が向上することを確認してください)

2
Roger Attrill

送信ボタンを無効にすることによる問題(IMO)と、おそらく、JavaScriptのようなメッセージの検証と表示を使用することによる問題は2つあります。まず、ユーザーはページ全体を再スキャンして、何が無効であるかを特定し、何かが間違っていることに気づく必要があります。これは認知負荷が高く、適切なメッセージを表示することが非常に困難です。

ただし、2番目に、より複雑な検証(つまり、複数のフィールドにまたがる)であり、入力と同時に検証を行うと、ユーザーはエラーメッセージが点滅するか、現在入力していないフィールドにメッセージが表示されます。

「進行」できるボタンが欲しい-変更を送信し、入力を検証して、次に進む。それは私がやりたいことのように感じます。ボタンを無効にすることは、これが実行可能なアクションではないことを示します。つまり、フォームの送信(検証および続行)は、私が期待するものではありません。明確に示されている場合、REQUIRED入力のボタンを無効にしても問題ありませんが、INVALID入力の場合は無効にならないことがあります。

もちろん、私見、すべて!!!

0
  1. 不完全なフィールドを強調表示します。無害な方法を使用してください。明るい灰色の背景。ユーザーがやろうとしていることをユーザーに怒鳴るようなことはありません。
  2. ユーザーが不正なデータを入力した場合は、それを別の方法(赤い色の背景?)で強調表示して、何かが本当に間違っていることを示します。
  3. フォームが有効になるまで送信ボタンを無効にしますが、フォーム上またはボタンの近くでフォームが有効になるために必要な処理の概要を確認します。 (「名前と他の3つのフィールドは空白」、またはそれよりも賢いものです。)

...「完全」ではなく「有効」と言ったことに注意してください。不完全なフォームのFace 3についてに素敵なセクションがあります。不完全な状態でフォームを使用できる場合は、その方法を使用して、残りの情報を取得する別の方法を見つけるというアドバイスがあります。これは、ユーザーがフォームを定期的に確認し、必要な情報を追加する場合にのみ機能します。ただし、ユーザーの使用状況と一致しない場合があります。

0
Alex Feinman