ユーザーと企業の両方にとって、フォームはWebサイト上でもっとも重要な要素の１つです。サイト訪問者が操作でき、使い勝手が良いのが最高のフォームと言えます。そのようなフォームであれば、サイト訪問者はフィードバックや購入、予約、登録をするためにフォームの項目を埋めようとするでしょう。
逆に、不格好でユーザーを誘導できずページ全体の印象を下げてしまうのは最悪のフォームです。では、どのようにして直感的で効果的なフォームを作り、ビジネス価値に繋げれば良いのでしょうか？
モバイルデバイスでフォームを最適化するための10の方法という記事も参考にしてください。
Googleからヒントを得る
人気サーチエンジンの１つであるGoogleは、ここ数年で何度もアルゴリズムをアップデートしてきました。それらはすべて、ユーザーが探しものを簡単に見つけられるようにする目的で行われています。
直近では、Googleは友だちと話しているみたいな検索機能にしようと試みています。今やユーザーは、日常会話で使用している言葉で探したい情報を見つけたいと考えています。この流れはWebデザインにも波及しており、サイト訪問者はコーディングや機械学習にも人間的な要素を期待しています。
その結果、ユーザーの興味を引き、より人間的な方法でユーザーの情報を集めるための、自然な言語を使ったUIとフォームが増加しました。企業は昔ながらのフォームによる堅苦しい表示ではなく、ユーザーが考えていることを反映しようと努力しています。
カスタマイズ可能なテンプレートと、事前に構築されたプラグインのおかげで、そのようなフォームの作成はとても簡単になりました。直感的なフォームを作り上げるにはフォームデザインの単調な作業をたくさん行う必要がありますが、ベストプラクティスによってユーザーがWebサイトでフォームをいつ、どこで、どのように見るのかを判断することができます。
フォームを用いるベストプラクティス
ユーザーと企業にとってもっとも使いやすいフォームは、どこでどのように示せばいいのでしょうか？ 以下のガイドラインに沿って考えてみましょう。
１. 必要な情報のみを聞き、論理的なフォーマットに沿う
最良のフォームとは、自然言語処理が示すように、情報ではなく会話を要求するものです。あらゆる論理的な会話と同じように、ユーザーとアプリまたはWebサイトがコミュニケーションできるものである必要があります。そのためには、以下のことを実行しましょう。
- ユーザーの視点から見て、順序正しい質問をしましょう。これには、普段の会話と同じように有意義かつロジカルな方法で情報を提供することが必要です。意味のある順番が特になければ、選択肢をアルファベット順に並べましょう。
- フォームを作るとき、なぜ個々の質問をするのか、その情報で何をしたいのかを考えましょう。そうすることで、不要な質問を除外し、ユーザーの注目を維持できる可能性が高まります。ユーザーの労力を減らすことが、コンバージョン率を高めるうえでもっとも重要な課題です。
２. カラムが１つのフォーマットを使用する
作成するフォームは必要な情報のみが含まれるようにし、１つのカラムで足りる程度の長さにしましょう。フィールドが水平に隣り合っていると、ユーザーは画面を「Ｚ」型に追う必要があります。結果的に、理解するまでの時間が遅くなり、ユーザーの注意が散漫になります。最良のフォームを作るためには、完了までの明確な道筋があること、すなわち上から１つずつフォームを入力できることが大切です。
Wen Tongの予約フォーム
３. タイピングの労力を最小限にする
入力フィールドの数を減らして、ユーザーのタイピングの労力を最小限にすることを徹底しましょう。モバイルにおいては特に重要です。ドロップダウンメニューやチェックボックス、ラジオボタンは、ユーザーの労力を最小限にするだけでなく、入力ミスを減らすことにもつながります。これは特にモバイルにおいて言えることです。
４. フィールドサイズと入力データ
フィールドサイズを、あなたの求めるデータに合った大きさにしましょう。最近のECサイトに関する研究では、全体の79％のユーザーが支払いの段階で購入をやめてしまうということがわかっています。
理由の１つは、フィールドサイズに混乱するからです。必要な情報に対してフィールドがあまりに長かったり短すぎたりすると、ユーザーは正しくフォームを入力しているかどうか疑問を持ってしまうことが研究からわかりました。この傾向はカード番号の入力の際に、もっとも顕著になります。情報がフィールドにしっかり合うようにしましょう。情報が多すぎても、少なすぎてもいけません。
Black Flag Creativeの支払いチェックフォーム
５. 柔軟なフォーマット
フォームの中には、異なる体裁のデータを要求するものがあります。たとえば、電話番号は123-456-7890のほかにも、(123) 456-7890という型もあり得ます。フォーマットがどんな体裁の電話番号でも受け入れるようにしましょう。
同じことは誕生日や予約日時にもいえます。ドロップダウンカレンダーで表示することもできますが、ユーザーの利便性を上げるためにできるだけ多くの選択肢を提供しましょう。
Lacey Ankenmanのフォームフィールド
６. 任意のフィールドと必須のフィールド
必要な情報しか求めていないのですから、理想的にはフォーム上のすべてのデータ入力が必須であるべきです。しかし、たとえば住所入力フォーム中のビルやアパートの番号など、もし任意の入力項目を含めなければならないのであれば、任意だとわかるように記載しておきましょう。
必須項目の隣に赤いアスタリスクを置くのがよくある方法です。もし任意のオプションを含めるならば、１つか２つまでにしておきましょう。
７. リセットエラーをなくす
以前はフォーム上にリセットボタンを設定する慣習がありましたが、これはおすすめしません。フォームの入力を全部終えたあと、間違えてリセットボタンを押してしまうと、入力内容がすべて消えてしまいユーザーを苛立たせてしまいます。
消えてしまったとしたら、もう一度フォームを全部入力するでしょうか？ それともウインドウを閉じてしまうでしょうか？ 恐らく後者でしょう。これを回避するためにも、リセットボタンをフォームから取り除いてください。リセットボタンはデメリットのほうが大きいです。
８. ユーザーを記入する気にさせる
ユーザーにフォームを記入してもらうためのカギの１つは、ユーザーにそうしたいと思わせることです。Webサイト上でどのようにユーザーにフォームを記入してもらうかの例を以下に示します。
- フォームをすべて記入することでユーザーが得られるメリットを並べましょう。利益や特徴、顧客に貢献する方法などのリストでも結構です。今後の購入に使える割引コードでも構いません。
- 社会心理学における社会的証明を利用して、ブランドの信頼性を構築しましょう。たとえばフォームの周りに商品を展示したり、顧客からの口コミを配置したりすることなどが考えられます。これにより、良い製品やサービスを提供しているという信頼を得られます。また、わかりやすい画像を入れることで、ブランドとユーザーのつながりを作る助けにもなります。
- プライバシーを尊重していて、スパムを受け取る心配はないと明確な表現でユーザーに伝えましょう。
Michael Butのマルチステップフォーム
９. 説得力のあるCTAを作る
コールトゥアクション（CTA）の重要さは、どれだけ誇張してもしすぎることはありません。なぜなら、CTAこそがコンバージョンへの第一歩であり、ユーザーが登録ボタンをクリックしたくなるものだからです。何をやっているのか、なぜユーザーにとって必要なのか、どんなところが特別なのかを、ユーザーに一目で理解してもらえるようにしましょう。難しい注文のように聞こえますが、以下のヒントが助けになるでしょう。
- 顧客の立場で考えましょう。CTAでの「あなた」という言葉を「わたしの」に置き換えてみてください。この単純な転換だけでコンバージョン率を90％増加させることが、最近の研究でわかっています。
- 大胆になりましょう。ユーザーの目をとらえ注意を引くような色、形、フォント、言葉遣い、配置を使いましょう。とるべきアクションが訪問者に明確に伝わる、大胆かつはっきりした色を使いましょう。
- CTAをメイン操作部分かフッターに置いてみましょう。サイトのどこからも見えるようになります。
直感的なフォームがビジネス価値を生み出す
サイト訪問者を呼び込むことができ、入力が簡単なフォームは、人々がWebページに滞在する時間を延ばし、最終的にはより多くの顧客に製品やサービスに対して興味を持ってもらえます。良いフォームの重要性は、いくら強調しても足りないでしょう。
説得力のあるCTAでユーザーをフォームへ引き込み、自然な言語でフォームをわかりやすくしましょう。それによりユーザーはフォームをもっと入力してくれるようになり、将来のビジネスへとつながります。
