覚えておくと便利な会員登録フォームを構築するポイント


覚えておくと便利な会員登録フォームを構築するポイント入力フォームのユーザビリティについて。

参考url:
http://www.web-20.net/2008/08/post_81.html

以下、参考urlから引用。

ユーザーに信頼性・安心感を与えるポイント

  • いきなり登録させない
  • 必ず利用する項目以外は必須にしない
  • 非公開項目には非公開と出す
  • 暗号化通信(SSL)のページにはその旨明示する
  • プライバシーポリシー(個人情報への扱い)は上部に明示する

入力ミスを減らすポイント

  • メールアドレスを2度確認したほうがミスが減る
  • ログインIDはメールアドレスで
  • 登録ボタンは大きくする
  • クリアボタンとかいらない!

ユーザビリティ向上

  • 初期入力位置にフォーカスさせる
  • ラジオボタンやチェックボックスにはfieldset、label要素をつける
  • ラジオボタンは初期状態で選択しないほうがいい
  • サイト独自の用語などはその場でヘルプを表示する
  • 生年月日の年はセレクトボックスでなく、テキストで入力してもらう
  • 生年月日のセレクトボックス初期値を主要ユーザー層に合わせる
  • 会員フローにナビゲーションバーを表示する
  • 「その他」->自由入力のベスト解
  • 長文入力欄(テキストエリア)には残り文字数表示

以上です。詳細は参考サイトを参照して下さい。

なお、個人的には最後に紹介した

長文入力欄(テキストエリア)には残り文字数表示」を是非実装したいなと思いました。

残り何文字入力出来るって結構重要だと思いました。

こちらの関連記事も合わせて読んでみては?:)

  1. scriptaculous.jsのエフェクト(Highlight)使用方法
  2. webpod(iPod)の使い方及び設置方法
  3. Highslide JSの使い方(使用方法)
  4. テキストエリア等の入力フォームをリサイズ可能にするJavaScript
  5. XHTML(Valid)規格に準じたFlashソースの書き方

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>