ユーザーが3つのうち1つのテキストフィールドに入力する必要があるフォームを設計する方法
ユーザーに3つのうち1つのテキストフィールドに入力してもらうフォームがあります。これらの3つのフィールドは、他のクライアントをさまざまな方法（電話番号、電子メール、または名前）で識別するために使用されます。最後のテキストフィールドはオートコンプリートフィールドです。
もちろん、このフォームには他のフィールドも入力する必要があります。ユーザーにこれらのオプションの1つだけを入力するように要求され、他のオプションは無視されることをユーザーに理解させる最良かつ最も直感的な方法は何でしょうか。
1つのフィールドで3つすべてを「電話番号、電子メールまたは名前」のラベルと組み合わせることができますか。それ以外は、ユーザーがすべきことを説明するテキストを使用することのみを提案できます-「入力してください[〜＃〜] 1つ[〜＃〜]次の例：」。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
識別方法を1つだけ使用できる場合は、3つのラジオボタンのグループから使用するものを選択してもらい、1つを選択すると、その識別方法のラベルと入力を表示するか、ラジオボタン。
ラベルに「名前、電子メール、または電話番号」を付けるだけの場合と比べて、ラジオに個別の入力がある場合の利点は、検証対象がわかっていることと、各入力に標準IDを指定して、適切なオートコンプリート動作を実現できることです。次のQ＆Aをご覧ください。
入力された入力の自動検証を使用して、名前（文字）、電子メール（アットマーク）、または電話番号（番号）かどうかを確認できます。この方法では、この3つの入力フィールドが1つだけ必要になります。検証後は、認識された入力を強調表示するのが適切です。ユーザーが番号を入力した場合は、電話番号を強調表示します。
必須フィールドに、他のコントロールから目立つようにマークを付けます。 Web上の規約では、スター（*）が表示されることがよくありますが、他の必須フィールドオプションを使用できます。いくつかは、必要なフィールドを強調するために薄い黄色を使用します。
また、ラベルをすべてのフィールドに右揃えして、ユーザーがどのフィールドがどのラベルに接続されているかを読みやすくします。
Cancalボタンが本当に必要ない場合でも、SubmitボタンとCancelボタンを使用します。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
3つのうち1つが必要な場合は、ユーザーが少なくとも1つのフィールドにテキストを入力するまで送信ボタンを無効にし、説明テキストを使用して必要なものを強調表示します。
（言うように）さらにフィールドがある場合は、コンテナー内で3つのフィールドをまとめて、ユーザーが問題のフィールドを見つけやすくします。