WebフォームにHTMLチェックボックスを配置するためのベストプラクティスは何ですか？

Question

次のHTMLフォームについて考えてみます。

フォームのチェックボックスは、本当に面倒です。なぜなら、何をしても、フォームの残りのコントロールと適切な視覚的フォームを合わせることができないからです。たとえば、次の2つの可能なレイアウトがあります。

そして

主な理由は、チェックボックスのラベルが反対側に表示されることです。それを正しい側に置いても、視覚的な非調和レイアウトは解決されません。

私の質問は、ウェブ上のチェックボックスのベストプラクティスは何ですか。 2項目のHTML選択コントロールに置き換える必要がありますか？

Answer 1

フォームのラベルは一貫している必要があります。

ここに多くの解決策の1つがあります（私は1つのチェックボックスと同じものに相当するラジオボタンを使用しましたが、チェックボックスを使い続けることができます）

またはあなたは上揃えすることができます：

追加する編集：

http://www.slideshare.net/lukew/web-form-design-best-practices

フォームの配置についての良いアドバイス...

Answer 2

ページ上で要素を配置するための最も有用な方法の1つ（少なくとも、私はそう思っています）は、テーブルを使用することです。物事を行と列にうまく分類し、すべての境界線を非表示にすることは非常に簡単で、ユーザーにはすべてがうまく並べられているように見えます。追加の利点は、さまざまなサイズのセルです。何かがより多くのスペースを必要とするなら、それにもっとスペースを与えます。チェックボックスを端まで移動する必要がある場合は、tdの幅を5または10％（行のサイズに応じて）に設定します。いくつかの本当に素晴らしいレイアウトはこの方法で構築できます。