[レベル: 初〜中級]
入力フォームのフィールドには、入力が「必須」なのかまたは「任意」なのかのラベルを両方付けることが推奨されます。
どちらか片方だけだと入力途中の離脱の原因になります。
ECサイトのユーザービリティ調査と最適化を専門に扱っているBaymard Instituteが詳しく解説しています。
15の大手ECサイトのユーザビリティ調査と18の主要なモバイルサイトのユーザビリティ調査、そして自社による最新の大規模なアイトラッキングテストによって実証することができました。
この記事では、その解説の要点をまとめて紹介します。
片方だけの「必須」「任意」ラベルの問題点
入力が「必須」か「任意」かをどちらか片方のラベルだけで示すことにはさまざまな問題点があります。
必須か任意かを示さないのはいちばんよくない
そのフィールドの入力が必須か任意かを示さないのはいちばんよくないスタイルです。
あるサイトでは必須なのに、あるサイトでは任意の項目があります。
ユーザーは自分で推測しなければなりません。
また一般的にいって、ユーザーは、未入力エラーを起こすのが嫌なのですべての項目を埋めたほうがいいと思う一方で、なるべく速く完了させたいので項目は少ないほうがいいとも思います。
どのフィールドが必須でその項目が任意なのか不明瞭な状態はユーザーを戸惑わせます。
「任意」だけは「必須」だけよりも悪い
「必須」フィールドには何も書かずに「任意」フィールドだけにそのラベルを付けるフィームが多くあります。
これも良くありません。
特に長いフォームで問題になります。
まず最初に出てくる任意フィールドがAbove the fold（ファーストビュー）にないと、必須か任意かがわかりません。
つまり「必須」のラベルも「任意」のラベルも見える範囲のフィールドにはないため、ユーザーはどちらなのかの判断に困ります。
また任意が少なくて間隔が空いていると、付いていないフィールドが必須か任意かがわからなくなってしまいます（どちらだったかをユーザーが忘れる）。
「必須」だけもよくない
「任意」ラベルだけよりはましですが、「必須」ラベルだけのフォームも問題を起こすことがあります。
たとえば、必須を「*」（アスタリスク）で示していると理解しないユーザーがいます。
ほかには、「必須」がなくても埋めなければいけないと思い込むんでしまうユーザーが存在します。
すべて必須でも付ける
すべての入力項目が必須なのは、支払い情報の入力フォームでよくあるパターンです。
たとえすべてが必須であったとしてもラベルを付けます。
まず、すべてが入力必須だと最初に説明してあったとしても読まないユーザーが必ずいます。
ほかのサイトでは必須ではなかったからとか自分の勝手な思い込みから、任意だとみなしてしまうユーザーもいます。
モバイルではより大きな問題になる
スクリーンが小さいスマートフォンでは、片方のラベルだけだと必須か任意のどちらなのかがますますわかりづらくなります。
どちらなのかがわからずに上に戻って確かめなければならないときがあります。
「このフィールドには“任意”と付いているから、付いていないフィールドは“必須”なのだろう」とユーザーに推測させなければならない状況も発生します。
「必須」「任意」ラベルはどちらも必要
ここまでで説明した以外にも、片方だけのラベルが引き起こす問題点に参照元記事では触れています。
サイト運営側が当たり前と思っているようにユーザーは認識したり動いたりしてくれないのです。
ユーザーは、「*」が入力必須のマークだとは認識しないし、フォームの最初に書いてある「すべて入力必須」の指示を無視するものだと僕たちは理解しておかなければなりません。
こうした問題の発生を抑えるために、すべてのフィールドで必須なのか任意なのかを示すことが推奨されます。
- 「必須」フィールドには、ウェブの慣例に従って「*」かそのまま「必須」のラベル
- 「任意」フィールドには、そのまま「任意」のラベル
たとえば、ベルメゾンのフォームには両方が付いています。
各フィールドに付けることでユーザーの勘違いや入力漏れを防ぐことができます。
また心理的に提供したくない情報は任意なのに必須だと勘違いさせてカゴ落ちを防ぐことにもつながります。
簡単にできるEFO（エントリフォーム最適化）なので即実践しましょう。
なおメールマガジン登録のように入力フィールドが1つや2つのフォームはラベルなしまたは片方だけでも構いません。
長いフォームでの話になります。