Webサイトにおける入力フォームは、顧客情報を企業に提供するためのインターフェースです。たとえば商品の注文フォームであれば、住所を入力することで購入時の発送先となりますし、BtoB商材の問い合わせフォームであれば、入力した情報が商談のきっかけとして用いられることもあります。
業務にかかわらず、普段の生活でもインターネットユーザーの1人として入力フォームに触れる機会があると思いますが、その際にこんな経験をしたことはないでしょうか?
「入力したけどエラーが出て、なかなか前に進めずストレスを感じた」
「入力する項目が多すぎて途中で断念してしまった」
入力フォームまで辿り着くのは、商材に強い興味を持ってくれているモチベーションの高い方です。故にここで離脱されてしまうことは大きな損失に繋がります。
CVR(コンバージョン率)改善の施策のひとつにLPO(ランティングページ最適化)がありますが、その中でも「EFO(エントリーフォーム最適化)」は入力フォームにフォーカスし、使いやすくすることで入力完了率を高める施策のことを指します。
本記事のゴールはEFOの進め方、および具体的な改善ポイントを理解することです。参考画像を交えながら詳しく解説していきます。
目次
入力フォームの設置場所
入力フォームの設置場所は、おもに「一体型」と「分離型」の2種類があります。
一体型
LP(ランディングページ)の中に埋め込まれているタイプのフォームです。このようなLPを「フォーム一体型LP」と呼ぶこともあります。ページを遷移せずに完結できるため、分離型に比べて途中で離脱しにくい点がメリットです。
LP内のCTAボタンを押すと、最下部の入力フォームまでスクロールさせるパターンをよく見かけますが、ファーストビューに配置するパターンもあります。
ファーストビューに配置するパターンは、商材の認知度が高かったり、記事LPなどを経由していてユーザーのモチベーションが高くなっている場合に効果的です。「資料請求ダウンロード」や「無料で試してみる」など比較的ハードルが低いCTAを持ってくることで、CVR向上が期待できます。
分離型
LPのCTAボタンを押した後にフォームのページに遷移するタイプです。
たとえば求人紹介サービスのように、学歴や職歴など事前に入力する情報がたくさんあるような商材に向いています。入力項目が多いケースでは、一体型にすると縦にどんどん長くなってしまうため、分離させた方がモチベーションが続きやすくなります。
場合によってはフォームの内容ではなく、設置場所を変えてみることも効果的なEFO施策の1つです。次の項目ではEFOの具体的な進め方を解説していきます。
EFOの進め方
EFOは、入力フォームまわりで何が課題になっているのかを見極めることからスタートです。以下の手順に沿って進めていきましょう。
STEP1:問題の特定と課題の洗い出し
LPのCVRが低かったりコンバージョン自体が発生しなかったりという状況において、CTAボタンや入力フォームまわりが原因があるのか、それ以外が要因となっているのか、いくつかの可能性が考えられます。問題を特定し課題を導き出す手段として、今回の記事では2つの方法をご紹介します。
1つめはGA4やヒートマップツールなどのツールを利用した分析です。データを元にユーザーの離脱率の高いページやつまずきやすい箇所などを特定していけます。
たとえば、入力フォームの2ページめでの離脱率が高ければ、そのページの構成や項目を重点的に見ていくことでCVRの改善が見込めるでしょう。一方でファーストビューやLP前半での離脱率が高いのならば、優先するべきはEFOよりもファーストビューやコンテンツの見直し、流入元の広告からのギャップを埋めることかもしれません。LPにおいてボトルネックがどこにあるのかを見極めていきましょう。
2つめは、ユーザーに実際の画面を操作してもらうユーザビリティテストの実施です。入力フォームまわりの問題は、実際に実機で操作してみて初めて気づくことも多く、表面を見ただけでは良し悪しの判断がつかないことが少なくありません。テストを行った方々のフィードバックを収集し、そのフィードバックを元に入力フォームの構成やインターフェースを改善していきます。
STEP2:A/Bテストの実施
課題を洗い出したらさっそくフォームの改修を実施していきたいところですが、実際の入力フォームをいきなり改修していくのはリスクが高めです。A/Bテストを挟むなどして、慎重に進めていった方がよいでしょう。
たとえば少し入力項目を減らしたりテキストの一部を変更する程度なら、A/Bテストをせずに直接改修を進めることもありますが、項目を大幅に減らすケースなどは、ハードルが低くなる分モチベーションがあまり高くないユーザーが増える可能性もあるため、注意が必要です。
そのためフォームの改修を行う場合は事前にA/Bテストを実施し、本来の目的がしっかり達成できるのはどちらかを見極めておくことをおすすめします。
A/Bテストのやり方は大きく2つあります。1つめはEFO(LPO)ツールを使用する方法で、2つめは既存LPのフォーム部分を改修して別URLとしてLPを複製し、リンク先テストを行う方法です。後者のやり方はテストを行うのに工数がかかってしまうので、繰り返しテストを行う場合はEFOのA/Bテスト機能のあるサードパーティーツールの利用も検討してみてください。
まずはA/Bテストを実施し、成果が出た施策を本番に反映する流れをとっていくと、改修の工数も抑えられて着実にCVRを上げていくことができるでしょう。
LPのA/Bテストを円滑に進めるための確認事項は、以下の記事で解説しています。
STEP3:A/Bテストを評価する
A/Bテストの評価は、期間を設定して数値を見ていきます。ページビューやコンバージョン数が少なすぎると判断がつきづらいため、ある程度の数を担保できる期間を設けるとよいでしょう。
また、A/Bテストを行う際にはどちらがよいのか判断が難しいのも問題のひとつです。できる限り正確に優劣を判断したい場合には「統計的有意性」の有無を基準するとよいでしょう。
こちらの記事のように、エクセルなどで関数を駆使する方法もありますが、A/Bテスト信頼度判定ツールなどを使うとより簡単に正確な結果を導き出せます。
しかしながら、十分な優位差が出るまでテストをすると時間がかかりすぎたり、ビジネスのスピード感が求められる現場では早急に改善したいケースもありますよね。
ズルズルと判断を先延ばしにするのではなく、「少しでも数字がよくなれば採用する」あるいは「少しでも数字が下がれば不採用」などのように実施の前に判断基準を決めておき、有意差がつかなかったときにどちらのパターンを採用するかも考えておくとスムーズに進めていくことができるでしょう。
テストパターンが勝った場合:入力フォームの改修
LPを複製して2パターン作り別URLとしてA/Bテストを行った場合は、成果の良かったLPを広告配信に採用する形になります。一方でLPOツールを使ったA/Bテストにおいて改善を加えたテストパターンが勝利したときは、修正内容をLPの本番環境に反映・実装していく必要があります。
フォーム作成ツールやCMSの拡張機能を使って作られている入力フォームの場合は、専門的な知識がない人でも比較的カスタマイズがしやすい仕様になっています。一方でオリジナルで制作した入力フォームを改修する場合はエンジニアの協力が必要になってくるでしょう。とくにデータ取得や送信などの裏側に関する改修はバックエンド領域の専門知識が必須です。大規模な改修を行う場合は前もって対応できる方のリソースを確保しておくようにしましょう。
オリジナルが勝った場合:結果を踏まえて次の施策へ
A/Bテストの結果が悪かったとしても、決して落ち込む必要はありません。テストパターンが負けたということは、オリジナルの方が良かった要因が必ずあるということです。
その結果を踏まえて考えられる仮説を立て、新たな次の施策へと繋げていきましょう。1回こっきりで終わりではなく、繰り返しの検証によって成果を高めていけることがEFOやLPOの醍醐味だと思います。
次の項目では入力フォームの主な改善ポイントをご紹介します。
押さえておきたい5つの改善ポイント
入力フォームにおいて大切なことは、ユーザーに手間やストレスをかけさせずにコンバージョンまで到達してもらうこと、そして正確な情報を入力してもらえるようにすることです。その2点を踏まえてボトルネックを取り除くことを目的に、改善案を出していきましょう。
入力項目や工数を減らす
入力項目が多すぎると離脱に繋がりやすくなります。優先度が低い情報は任意項目にして必須項目と分けたり、無駄な項目をなるべく省くようにしましょう。
ただ入力項目を減らすことが全てのケースにおいて正解というわけではありません。
BtoB商材など、商談前にユーザーから詳細な情報を取得しておきたいときは、入力項目を多めにするケースもあります。その場合は「本当にすべての項目が商談前に必要な情報なのか?商談の段階でヒアリングするのではダメなのか?」など、リード獲得後のアプローチも踏まえてすり合わせておくとよいでしょう。
また自由入力欄(テキストエリア)は比較的負担が大きく情報の精査もしづらくなるため、明確な選択肢が用意できる内容であれば、ラジオボタンやチェックボックス、プルダウン形式を活用するとよいでしょう。選択肢は網羅的かつ被りがないか確認します。
ただし商材によっては自由入力形式で詳細に書いてもらった方が次のアクションに繋げやすいケースもあります。「事前に詳しい情報を取得すること」と「ハードルを下げること」を天秤にかけたときの優先度を考えてフォームを作るのが重要です。
細かい部分ですが、ハイフンや特定文字の指定をなくしたり、電話番号入力の際に枠を移動せずに一列で入力できるようにするのも有効です。ただし、顧客管理システムの処理上の問題で入力形式に制限をつけなくてはならないケースもあるので、事前に確認しておきましょう。
郵便番号を入力すると市町村まで自動で表示されることがあったり、電話番号を記入する際に数字キーボードが自動で表示されるケースがあります。このように自動補助や入力制御機能を活用するとよりスムーズに進めてもらえるでしょう。
明確で伝わりやすいテキストにする
ユーザーがエラーではじかれる回数を減らすためには、正しい情報を入力してもらえるように誘導することが大切です。
どんな情報を入力すればいいのかわかりやすい見出しにしましょう。パスワードなど使用する文字の種類に制限がある場合も必ず補足を入れるようにします。
またエラーメッセージが「入力に不備があります」のみだと、はじかれた原因が判別しにくくなります。具体的なエラーの詳細を記載するようにしましょう。
下記画像のように、プレースメントホルダーに記入例をつけておくと、ユーザーがスムーズに記入できます。補足情報が多すぎるときはオンマウスで表示されるインフォメーションをつけるのも一つの手です。
ユーザーを不安にさせる要素を払拭する
入力を進める中でユーザーを不安にさせないことも重要です。
たとえばボタンの文言が簡潔すぎると次のアクションを読み取ることができず、クリックを躊躇してしまうかもしれません。「ボタンを押したら何が起こるか?」が伝わるテキストを入れるようにしましょう。
入力項目が多すぎるケースでは途中離脱を防ぐための工夫も必要です。上部に残りの項目数や入力完了率を表示させることで、ユーザーが現在地を把握でき、モチベーションを保ちやすくなるでしょう。
送信ボタンを押した後に待ち時間がある場合は、読み込み中であることを知らせるようなアニメーションを入れたり、正しく送信できたことがわかるように完了ページに飛ばすようにすると、よりユーザーを安心させることができます。
情報を適切な場所に置く
たとえばエラーメッセージをまとめて最上部や最下部に表示させるケースがあります。
1つずつ参照するのが手間になるため、エラーメッセージはなるべく各項目の付近に載せるようにしましょう。
サイズや種類の選択が必要な商材では、該当の箇所に戻って確認しに行くのが手間になるので、選択肢の近くに画像や詳細なテキストをつけておくと親切です。
また「送信」ボタンの後に「プライバシーポリシー」のチェックがあると、ブラウザの読み上げ機能を使う視覚障害者にとっては順番が逆になってしまい混乱させる恐れがあります。上から下、左から右に読まれるという意識を持って配置を考えましょう。
直感的に操作しやすくする
モバイル端末での表示はユーザーが意図していない場所を押さないように、入力範囲やボタンをタップしやすい大きさに調整するとよいでしょう。
モバイルフレンドリーなLPの作り方に関しては、以下の記事も参考になります。
配色も大切な要素で、たとえば必須項目や任意項目は色を分けることで区別しやすくなります。エラーや未入力項目を赤くすることで修正箇所をわかりやすくする手法もあります。
まとめ
入力フォームの空欄を埋める作業は労力がかかるため、ユーザーがわざわざ入力しようと思ってもらえるだけのモチベーションや動機が必要です。
そのためには入力フォームに到達するまでに、商材の魅力や登録によって得られるベネフィットを十分に伝えておくことも大切になってきます。LP全体を改善していくことでCVR向上に繋げていきましょう。
LP改善については以下の記事も参考になります。