web-dev-qa-db-ja.com

無効なデータが入力されたことを示すエラーメッセージ?

主観的な質問でごめんなさい...

ユーザーが無効なデータを送信したときにWebフォームに表示されるマイクロコピーに取り組んでいます(例:無効な日付/時刻)。インライン検証と日時ピッカーとマスクを使用して、無効なデータが送信されるリスクを実際に最小限にしようとしましたが、ユーザーがまだ問題を抱えていることは間違いありません。アプリはフライトクルーが使用するように設計されているため、パイロットやスチュワーデスが意図的に少し気まぐれになっています。これまでに使用したテキストは次のとおりです。

「おっと、入力したデータの一部に問題がありました。今すぐ修正しましょう。心配しないでください。」

これは十分な信頼性がないように思われるため、物議を醸す選択を証明していますが、アプリの他の部分で使用されているマイクロコピーと一致しています。これと組み合わせて、個々のフィールドを強調表示し、個々のフィールド自体を修正する方法をユーザーに伝えます。これは、ページヘッダーに表示される一般的なアラートテキストです。UXを改善するための良い提案やデザインパターンはありますか?

9
thesaundi

アラートを表示しているようです(テキストの長さからそう思います)。日付フィールドの下に、はるかに短い「インライン」メッセージを表示してみませんか。 「エラー、「Z」は有効なテキストではありません。」これは、ユーザーが入力しているとすぐに発生します。また、ユーザーのワークフローへの影響も少なくなります。

ユーザーが[送信]ボタンをクリックしたときにアラートを表示するように予約しておきますが、インラインアラートを入力どおりに表示すると、アラートを表示する必要がほとんどなくなります。

2
Hisham

以前の入力の何が正しくなかったかをユーザーに正確に伝えることは、ユーザーにとってより役立ちます。たとえば、4桁の年を期待し、ユーザーが最後の2桁だけを入力したかどうかを確認します。次に、彼が間違ったこととその修正方法を教えてください。そうしないと、同じ間違いを繰り返して、同じメッセージをもう一度投げさせて、苛立ちが増します。確かに、トーンは役割を果たしますが、本当に役立つ情報を含むメッセージはそれが本当に何であるかです。

1
Max Steenbergen

以前の両方の答えにはある程度同意しますが、質問もします。 「インライン検証」と言うとき、単にメッセージングについて言及しているのですか、それとも実際にデータ入力を検証しているのですか?データの実際の検証とエラーメッセージは別のものです。

一般に、検証のベストプラクティスは2段階です。クライアント側の検証を使用して、入力された内容が最初のスニフテストに合格することを確認します。フィールドに入力すると、簡単にインラインフィードバックを提供して、入力内容が適切に機能するかどうかをユーザーに通知できます。ただし、サーバーの検証は2番目のステップとして非常に重要であるため、データがコミットされる前に予期せぬ事態が発生することはありません。

メッセージングに関しては、先ほど述べたように、フィールドに入力するときにすばやくメッセージを提供できますが、提案したテキストはカジュアルすぎると思います。それは他のサイトのコピーの調子と一致しているかもしれませんが、Maxが言うように、コンテキスト内で間違いが何であるかをユーザーに明らかにすることが重要です。 「電子メールアドレスを修正してください。提供された電子メールアドレスが有効ではないようです。」のような一般的なフレンドリーなメッセージは、私が望んでいるほどではありません。

それが通常のフォームである場合、クライアント側の検証が完了した後に私が行うことの1つは、フォーム入力の全体的な検証をサーバー側に提供することです。これは、特定のメッセージを返す機会です(クライアント側の検証が正確であれば、たいていの場合、問題にはならないはずです)が、可能であればコンテキストに表示して、ユーザーがまだ注意が必要なフィールドを正確に把握しています。

Hishamが送信時に警告ボックスを提案する理由を私は知っていますが、特にフォーム自体を変更してユーザーにメッセージをより細かく提供できる場合は、IMHO警告ボックスは不格好です。

1
jameswanless

短くて甘いものにしてください。 Steve KrugのDo n't Make Me Thinkの処方は、「おっと、あった... blablabla ... now」のようなメッセージは多すぎるについて考える。

スペースを使用して、ユーザーができるだけ早くエラーを修正するのに役立つメッセージを表示してください。

例えば:

ユーザーが姓を入力するのを忘れた場合は、次の短いメッセージのいずれかを赤で表示し、エラーのあるすべてのフィールドを赤で強調表示します。

  1. 姓を入力してください。
  2. 姓が必要です。
  3. 姓を入力してください。

ユーザーがすぐに入力を開始してエラーを修正できるように、常に最初の空のフィールドキャレットフォーカスを与えます。

1
Petrus Theron