web-dev-qa-db-ja.com

プレフィックスとサフィックスを含む完全な名前をフォームの1行に配置しますか?

プレフィックス、ファーストネーム、ミドルネーム(イニシャルではない)、ラストネーム、サフィックスを含む名前フィールドを持つフォームページで作業しています。クライアントは、これらすべてのフィールドを1行に収めたいと考えています。したがって、ここでの課題は、幅が960pxに制限されており、16pxフォントに固定されていることです。

プロジェクトはかなり進んでいますが、クライアントをとても喜ばせるので、私はこれを本当に理解したいと思います。ただし、複雑になりすぎないようにしたい。

私はこれを彼らが完成したフォームとして配置することを考えました、そしてそれはそれが完全に名前を表示するだけで崩壊します。次に、戻って変更する必要がある場合に備えて、フィールドの右側に編集ボタンを配置します。これはクールに見えますが、追加の手順です。

これは追求する価値のあるものですか?誰かがそれがより良い/類似したことを見たことがありますか?考え?

Current Layout スクリーンショットを追加しました。それはサイトの他の部分のパターンに従いますが、私が問題を抱えているのはここだけです。最大の問題は、フォントサイズと幅の制限です。これをすべて1行に収めようと、いくつか試してみました。 1つ目は、これをオープンモジュールとして使用し、完了すると、1行の表示フィールドに折りたたみ、変更が必要な場合に備えて編集ボタンを残すことでした。 2つ目は、ユーザーがすべての情報を1行で入力し、ボタンをクリックして、入力した情報を正しいフィールドに配信するgoogle連絡方法です。クライアントのどちらも好まなかった。したがって、ここに質問を投稿します。

2
Johnny UX

水平方向のスペースを増やすには、対応するフィールドの横ではなく、対応するフィールドの上にラベルを配置します。 Luke Wroblewskiが調査を行いました http://www.lukew.com/ff/entry.asp?504 これは、フィールドの上にラベルを付けると、フォームを実際に入力しやすくなることを示しています。

1であれば、フィールドを静的テキストに変更しても問題はないと思います。本当に必要です。そして2.ユーザーはそれをテストして、何が起こったのか、そしてどのようにフィールドを編集するのかがユーザーに明確であることを確認します。

0
Taylor L.

入力フィールドに入力されたデータを動的に同期する機能はありますか?その場合は、次のようにユーザーにフィードバックを提供できます。

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

0
SwankyLegg