フォームは、ページ全体の幅よりも小さい場合、左揃えまたは中央揃えにする必要がありますか？
私たちのWebアプリケーションの最上部には小さなヘッダーとナビゲーションメニューがあり、その下には、単にオープンスペースの広い領域があります。常に表示されるサイドバーは必要ないため、列は1つだけです。レイアウトはウィンドウ幅が100％であるため、ワイドスクリーンを使用している場合でも、可能な限り多くのスペースを使用できます。
私たちの問題は、特定の1ページのフォームが非常に小さく、多くのスペースを取る必要がない場合があることです。また、ヘッダーの下の潜在的に巨大なオープンスペースでは、フォームが見苦しく見えることがあります。
たとえば、以下のパスワードリセットフォームには2つの入力のみが必要です。フォームをページ幅の100％にするのは面倒なので、かなり狭くしました。しかし、そこには、満たされていない大量の空白があります。
幅の狭いフォームを中央に配置する必要があるように感じるので、両側に等しい空白があり、頭を画面の中央から遠ざける必要はありません。
しかし、同僚は、幅の狭いフォームは左揃えにする必要があると感じています。これは、他のほとんどすべて（テキストのブロックなど）が左揃えになるためです。
皆さんはどう思いますか？フォーム全体を揃える方法について従うべき原則またはガイドラインはありますか？ラベルやボタンなどを揃える方法についてはたくさんの情報を見つけましたが、フォームがページ全体を占めない場合にフォームを揃える方法については知りませんでした。
フォーム-中央揃え、
フォーム-左揃え、
フォームが片側に遠すぎる場合は、中央に配置された場合よりもページがいっぱいにならないという事実を強調します。そして、その要素に注意を引くことは、あなたがフォーカスしたいフォームから注意を引くことになります。
したがって、centredの形式にすることをお勧めします。
しかし、私はまた、真っ白な背景がないことをお勧めします。 微妙なパターン を使用するか、背景に薄い灰色またはオフホワイトの色を使用してみてください。これは、フォームへの注意を引くのに役立ちます。
フォームの左側またはフォームの右側にコンテンツを配置する場合は、どちらでも機能します。フォーム以外のページにコンテンツがない場合は、中央揃えにするのが最適です。
私は実際には両方のオプションがかなりうまく機能すると思います。
私はあなたのサイトの残りの部分のデザインに一番合うものを選び、あなたのヘッダーの形/形を考慮に入れます。
JohnGBからの背景色の提案は、これをより明確に使用するのに非常に役立つと思います。