第25回 登録フォームのユーザビリティ

商品購入や資料請求等の『登録フォーム』は、見せ方一つでコンバージョンレートが大きく変動します。

商品購入や資料請求等の『登録フォーム』は、見せ方一つでコンバージョンレートが大きく変動します。今回は、ビービットで繰り返し実施してきたユーザビリティテスト(ユーザ行動観察調査)から導出した、登録フォームにおいて守るべきルールの一部をご紹介します。

1. 入力項目を可能な限り減らす

文字を入力したり、項目を選択したりすることは、ユーザにとって非常に面倒な作業です。特に初心者はキーボード入力を嫌がる傾向があります。一方で、企業側はユーザの情報を入手するため、とかく様々な項目についての回答を 要求しがちです。

質問の数が増えれば増えるほど、ユーザの脱落率は高まります。当該フォームで獲得すべき情報を吟味した上で、最低限必要な項目に絞り込む努力をすべきです。

また、項目を絞り込んだ上で、郵便番号だけで住所の一部を自動入力してくれる機能(ボタン)など、ユーザの入力負荷を軽減するための工夫があるとなお良いでしょう。

2. 何を入力すべきかを迷わせない

何を入力すべきかが分かりにくい入力フィールドや誤解を招く選択肢もユーザにとって大きな障壁となります。これは入力・選択時に困りますし、誤入力・誤選択によるエラーにもつながります。

まずは、入力項目や選択項目の項目名(タイトル名)に誤解を含む要素がないかを吟味する必要があります。例えば、収入の入力フィールドに、「収入」というタイトル名をつけるのはNGです。「年収」なのか「月収」 なのかを誤解のないように明示すべきです。

次に、ユーザの入力の補助となるような記入上の注意やヒントを提示する必要があります。但し、ユーザは入力することに必死になっているため、入力フィールドから離れた位置に書かれた説明には目もくれません。

そこで、記入上の注意やヒントは、入力フィールドのすぐ横(または下に)に配置することが必須となります。

例えば、住所や電話番号の入力では、記入例を入力フィールドの横(下)に提示することで、「全角・半角のどちらで入力すべきか」「ハイフンは入れるべきか」といったことが直感的に理解できるようになります(註:全角・半角入力や、ハイフンの必要性の有無といったことについては、システム側で処理をしてユーザには意識させないのが一番理想的ではあります)。

また、ラジオボタン式やチェックボックス式の選択肢に難しい用語がある場合には、当該選択肢のすぐ横に括弧書きで簡単な説明をつけることで、誤答率を飛躍的に低下させることができるでしょう。

3. エラーへの対処を容易にする

一度生じたエラーからの復活を如何に簡単にするかが登録フォーム設計の肝であるともいえます。

よく見られる悪い例として、ページの上部にエラーメッセージが小さく表示されるだけというものがあります。先述したように、ユーザは実際に入力できるフィールドに目を向ける傾向があるため、入力箇所から遠い場所に エラー文言が表示されると、ユーザはエラーが発生したこと自体や、エラーの具体的内容に気付かず、エラーを繰り返してしまいがちです。

また、フィールドのラベルに赤く色をつけるだけで、エラー箇所を示すサイトも多いです。これは、色覚障碍のユーザが エラー箇所を把握できないというアクセシビリティ上の問題があります。

エラー箇所のすぐ近くに、エラーと分かるような印とともに、ユーザにとって理解しやすいエラー文言を提示することが大事です。

登録フォームの改善だけでは、ユーザビリティの高いサイトになるとはいえないかもしれません。しかし、こういった小さなところからコツコツとユーザにとって使いやすいものにしていく努力の積み重ねが、結局は大きな成果へとつながっていくのです。

  • 執筆者:宮坂 祐

    株式会社ビービット ユーザビリティコンサルタント