例を見てみましょう。 「デザイナー」の作品の恐ろしいコピーは特に取り上げませんが、Microsoftの標準入力フィールドを使用した登録フォームの例を取り上げます。

ブラウザに関する小さな余談。 フォームのスクリーンショットはOperaで撮影されました。 FFは、目に優しい入力フィールドをレンダリングします。

フォームに戻りましょう。
まず、フレームを削除してみましょう。 これを行うには、入力フィールドを淡色で塗りつぶし、これらが入力フィールドのままであることを明確にします。 適切に調整されたモニターを使用している場合、フォームに明るい灰色の背景が表示されます。 これにより、背景と余白のコントラストがわずかに低下し、余白が目立たなくなります。 ただし、形状はより滑らかになり、灰色の縞模様につまずくことはありません。

しかし、最高はまだ来ていません。 新しい例の2つの要素が塗りつぶされていないことにお気づきでしょうか? これは、改善案の2番目の部分です。 アイデアは、入力フィールドの入力後、グラフィック指定を完全に削除することです。 テキストのみが残ります。 このソリューションには2つの大きな利点があります。
- フォームを確認する方がはるかに簡単です。見た目はつまずかないため、人はきれいな背景で入力された情報を見ますが、フレームのバーの後ろに表示されます。
- 充填プロセスはより興味深いものになっています。 フォームの要素を殺すゲームのようなもの。

データを入力した後に編集不可になることを混乱させないために、フィールドにカーソルを合わせると、フィールドが特定の色で強調表示されます。

実際、それがすべてです。 このような非常に簡単な方法で、フォームをより快適で面白くすることができます。