横型フォームは今までにない優れたUXですか？
一般に、フォームを作成するとき、入力フィールドはほとんどの場合垂直方向にリストされる必要がありますが、フィールドを水平方向にリストするインスタンスが良い考えはありますか？
たとえば、フォームに多くのフィールドがあり、それらを互いに垂直に積み重ねると、フォームが垂直にオーバーフローする（そのため、ユーザーが下にスクロールしてより多くのフォームにアクセスできる）場合は、代わりに入力フィールドを水平にリストすることをお勧めします（したがって、オーバーフローはありません）？
「正しい」水平方向のフォームの良い例はありますか、それとも単に良いUXではありませんか？
それは非常に悪い考えです。まず、縦にスクロールした場合、すべてのフィールドが横になっているとどうなりますか？ユーザーの画面が非常に広い場合を除いて、90〜95％の場合、ユーザーは水平方向にスクロールする必要があります（これを考えてください：ユーザーの50％以上がモバイルでフォームを表示します）。そして、水平スクロールはユーザーにとって本当に不自然ですが、垂直スクロールはユーザーが期待するものです。
ただし、あちこちに表示されるものにかかわらず、2つの列を使用できます。 このページ には、フォームの構築に関する適切なアドバイスがありますが、列の数の部分には完全に同意しません。私が説明します：私の制御が及ばない理由により、3列のフォームを一度作成する必要があり、ユーザーテストは本当に悪かったです。しかし、私は多くの2列のフォームを構築しており、それらは1列のフォームとほぼ同じように機能し、スペースを節約しているだけです（ただし、間違いなく1列で実行できる場合は、それを試してください）。この例の問題は、2列のフォームがinverted-N形状で構築されると考えていることです。これは意味がありません。 2列のフォームは、ジグザグパターンを使用して作成する必要があります。これは、3列以上が本当に混乱する理由も説明します。
ラベルはどうですか？
考慮すべきもう1つのことは、ラベルです。上揃えのラベルを使用すると、ほとんどの場合、デスクトップからタブレットまで、2列を問題なく使用できます。ただし、インラインで配置されたラベルを使用する場合、デスクトップでは2列しか使用できない可能性があります。多分タブレット、ラベルと入力サイズと使用されるフォントに依存します。しかし、これはそれでも考慮すべきことです
特別なフィールド
水平形式に対する最強のケースは... textareaです。多くのinputフィールドが約30ピクセルの高さで、次にtextareaが100ピクセルの高さであると想像してみてください。問題なくレイアウトを壊します。複数のradio入力またはcheckboxesがある場合も同じことが起こり、フォームが非常に長くなり、非常に奇妙な水平スクロールが必要になります。 5〜6個のオプションがあることを想像して、ラベルにフォーカスがなくなるまで、またはさらに悪いことに、他のすべてのフィールドまで右にスクロールしてください。オプションを縦に並べると... textareaフィールドと同じようにレイアウトが崩れます
そして、私は何故これが間違っているのかを説明するのに何時間も行くかもしれませんが、あなたは今までにアイデアを思いついたと思います。だから、最初に言ったように：それは本当に悪い考えです
フォームの少なくとも一部の水平配置の例があることがわかると思います。良い例は、通常、地域/州、都市、郵便番号が一緒に配置されている住所入力フィールドです。これは、これらの入力フィールドを分割すると、関連性が非常に高い場合に、ユーザーが各フィールドについて個別に考えるようになるためです。
クレジットカードの有効期限やCCVフィールドなど、水平方向に配置される他の例も考えられます。これは、通常、一方の入力が他方の入力に追随し、入力フィールドのサイズが小さいため、垂直に積み重ねるとスペースを効率的に使用できないためです。
一般的に言って、フォームフィールドを水平にレイアウトすることは考慮されますbad for UX（詳しく説明したい場合はお知らせください）
ただし、画面の幅が16：9（またはそれ以上）である場合、垂直方向に表示されるフィールドが画面の50％以上を残す可能性があります。それも悪いです。
その場合は、2列のレイアウトを検討してください。
フォームとフォームフィールドが長すぎる場合、要件を処理する方法は複数あります。ユーザーはフォームの長さに注意し、フォームに費やす時間を概算できるため、長すぎるフォームを与えることは決して良い考えではありません。
また、ユーザーが自分の位置を認識していると、完成に向けて感情的に心地よくなります。
この種の要件に対処する方法はいくつかあります
- 最初のオプション：いいえを指定します。フォームのフィールドが多すぎる場合の手順
- ステップを賢くグループ化します。このフォーム要素のグループ化は、タスクの完了をスピードアップします
- また、可能であればステップにラベルを付けて、ユーザーが精神的にタスクを実行する準備をすることもできます。この準備により、ドロップオフ率が低下します。
このアプローチを採用する場合、ユーザーが保存して次のステップに進むことを許可します
2番目のオプション：フィールド数を減らすことができるフォームフィールドの重複を避けます
編集不可のコンテンツをフォームに表示せず、確認画面に表示する
ドキュメントに必要なフィールドのみをキャプチャしてみてください。貴重ではない追加のフィールドデータを理解してください
上記のポイントの例-一部のドキュメントの証明をキャプチャする場合は、コアシステムでのみ検証できるフィールドをロードします。そうでない場合は、検証が手動であるドキュメントの画像をキャプチャします。
水平方向のフォームは、
- 不動産あり
- ユーザーがボールを追跡するようにフォームフィールドシーケンスを水平シーケンスに合わせます
- 関連するフィールドをグループ化し、フォームを順番に並べます。
- このアプローチを採用している場合は、すべてのコンテンツプレゼンテーションが同じパターンに従って一貫性を保つようにし、学習曲線が増加しないようにしてください。
私はあなたの質問に答えることを願っています。