フォーム入力は小さなビューポートで全幅に拡大する必要がありますか？
ビューポートが小さいサイズに近づいたとき、私の最初の考えは、各入力を線形化して拡大し、各入力に全幅を与えることです。これにより、大きなビューポートの Iヒンティング が削除されますが、おそらく見た目は良くなります。
ここにイラストがあります：（あまり詳細を避けるために意図的にあいまいにしています）
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
このデザインの決定に関するデータ/記事または経験を誰かが持っているかどうか私は興味があります。私は Luke Wroblewskiのサイト を調べましたが、他の参考資料はありません。
ありがとう。
視覚的には、2つのサイズで問題ありません。入力フィールドのサイズが異なると混乱を招きます。2文字を入力し、40のスペースがある場合も同様です。ユーザーは、他に何かを追加する必要があるかどうか疑問に思います。ほとんどの場合、視覚的なヒントが役割を果たします。
もちろん、Chrisがコメントしたように、特定のサイズでは小さな画面での外観を制御できないため、簡単な方法ですべてのフォーム要素を100％に変換することは常に魅力的です。幅要素。正直なところ、誰もがそれを行いますが、あなたがどれほど執着的であるかに応じて、この視覚補助を使用し、それを最大限に保ちたいと思うかもしれません。
非常によく知られ、広く普及している例の1つがブートストラップです。あなたが持っている .form-group-smおよび.form-group-lgは、小さいフォームと大きいフォームの入力用のクラスとして、またはcol-*（*はxs-[number]、sm-[number]、md-[number]またはlg-[number]）、次にform-group 100％幅のクラス。しかし、どちらの方法を使用する場合でも、ポイントはBootstrapに入力サイズのオプションがあり、広範なUXテストを実行したことがあると思います。同じことがZurb Foundationにも当てはまるので、非常に安全です。形の異なるサイズが本当に良いと言うと、データはそれを使用する何百万ものサイトにあります！