woork: Useful tips to enrich your HTML Forms

フォームのユーザビリティを改善するためのサンプル集が公開されてます。

(1) フィールドに対するヒントをツールチップ表示するサンプル

最低６文字であることが分かりやすく表現できます

(2) オートコンプリートサンプル

おなじみ、オートサジェスト

(3) 残り文字数表示サンプル

残り文字数が分かることで、何文字以上〜何文字以内という表記を省略して分かりやすく。

(4) ラジオボタンがYESの時にinputを表示。

必要な部分だけ表示してフォームを分かりやすく。

申し込みフォーム部分は、申し込み受付型のサイトでは非常に重要ですが、こうした配慮がされているといいですね。
究極にフォームを使いやすくした、ベストプラクティスのようなサンプルをまとめたサイトがあったら役に立ちそうですね。

関連エントリ

• フォームのフリガナを自動入力させる「AutoRuby.js」
• Ajax＆PHPでアニメーションするコンタクトフォームを作成するサンプル