問い合わせ多段階フォーム:ステップ設計、進捗表示、完了率の最適化
1. 多段階フォームの完了率の仕組み:分割したほうがなぜ完了者が増えるのか
多くの人は「フォームは短いほど完了率が高い」と直感します。これは1ページフォームでは正しく、3項目から10項目に増やすと完了率は確かに下がります。しかし項目数が8つを超えると逆転します。10項目を3ステップに分けると、完了率は1ページの2〜3倍になるのです。理由は項目が減ったからではなく、ユーザーの心理的負担が変わったからです。
1ページの長いフォームに直面すると、画面いっぱいの入力欄が目に入り、心理的プレッシャーが最大になります。多くの人は入力し始める前にページを閉じてしまいます。多段階フォームなら入力欄は2〜3個しか表示されず、心理的負担はずっと小さくなります。「次へ」を押すほうが「送信」を押すよりハードルが低いのです。「次へ」は前進、「送信」は約束だからです。人は一度最初の一歩を踏み出すと、その後のステップも最後まで進みやすくなります。
| フォームの種類 | 総項目数 | 完了率 | 離脱率 | 適用シーン |
|---|---|---|---|---|
| 1ページの短いフォーム | 3〜5個 | 55%から70% | 30秒から45秒 | スピード見積もり、資料ダウンロード |
| 1ページの長いフォーム | 8〜12個 | 15%から25% | 75%から85% | 非推奨、トラフィックの無駄 |
| 多段階3ステップフォーム | 8〜10個 | 40%から55% | 45%から60% | 標準的な問い合わせフォームの第一選択 |
| 多段階4ステップフォーム | 10〜14個 | 35%から50% | 50%から65% | 複雑な要件、大口顧客の問い合わせ |
| 多段階5ステップ以上 | 15個以上 | 25%から35% | 65%から75% | 極めて意欲の高い場面のみ適用 |
上の表はB2B自社サイトの経験データです。分岐点は項目数8個にあります。8個未満なら1ページで十分、8個を超えるなら分割の効果がコストを上回ります。フォーム項目設計の全体的な考え方は問い合わせフォームの項目設計と転換率を参照してください。まずどの項目を集めるかを決め、それから分割方法を決めます。
2. ステップ設計:どうグループ分けし、どう並べるか
分组の原則は「項目タイプ別」ではなく「心理的なハードル別」です。最も入力しやすい項目を最初のステップに、最も難しい項目を中間のステップに、確認が必要な項目を最後のステップに置きます。ユーザーが入力を始めると、埋めた分だけ「ここまでやったのだから」という心理が後押しします。最初のステップで気軽に始められ、中間のステップでは半分まで埋まっているので簡単にはやめず、最後のステップではここまで時間をかけたのだから最後まで終わらせたいと思うものです。
標準的なB2B問い合わせフォームは、次のように分割できます。ステップ1は基本情報(名前、メールアドレス、会社名の3項目)、ステップ2は要件の詳細(製品型番、数量、用途の3〜4項目)、ステップ3は補足情報(電話番号、タイムゾーン、予算の2〜3項目)、ステップ4は確認して送信です。4ステップで合計10項目ほどになりますが、1ステップあたりの負担は軽く感じられます。
| ステップ | コンテンツ | フィールド数 | 心理的なハードル | 設計のポイント |
|---|---|---|---|---|
| ステップ1 | 基本情報:名前、メールアドレス、会社名 | 2〜3項目 | 最低 | スムーズに始めてもらう |
| ステップ2 | 要件の詳細:製品、数量、用途 | 3〜4項目 | 最高 | 核心となる情報で、最も複雑なステップ |
| ステップ3 | 補足情報:電話番号、タイムゾーン、予算 | 2〜3項目 | 中程度 | 任意項目はここにまとめる |
| ステップ4 | 確認して送信:入力内容の確認と送信 | 新規項目は0 | 低 | 確認してから送信してもらう |
1ステップあたりの項目数は2〜4個に抑えます。少なすぎるとステップが多くて終わらない印象を与え、多すぎると1ページの長いフォームと同じ問題に戻ってしまいます。1ステップ3項目が黄金比です。フォームのA/Bテストの方法はこちらをご覧くださいフォームのA/Bテスト。分割数そのものもテストする価値のある変数です。
三、進捗表示:あとどれくらいか分かるようにする
多ステップフォームには進捗表示が欠かせません。ないと、ユーザーはどこまで進んだか分かりません。進捗表示のない多ステップフォームは離脱率が30%以上高くなります。ユーザーは「いつまでたっても終わらないのでは」と感じるからです。進捗表示のポイントは2つ。具体的なステップ数を示すこと(プログレスバーだけでは不十分)、そしてプログレスバーに視覚的なフィードバックを持たせることです。
最も効果的なのは「テキスト+プログレスバー」の組み合わせです。上部に「ステップ2/全4ステップ」と表示し、その下に50%まで進んだプログレスバーを置きます。プログレスバーだけでは効果が劣ります。ユーザーは数字で残り時間を判断したいからです。「ステップ2」だけで「全4ステップ」と書かないのも不十分です。終わりがどこか分からないからです。
| 進捗表示のタイプ | 完了率 | ユーザーの受け止め方 | おすすめ |
|---|---|---|---|
| 進捗表示なし | 基準100% | あと何ステップか分からない | 推奨しない |
| プログレスバーのみ | 110%から115% | 感覚はあるが数字がない | 代替案 |
| テキストのみ「ステップX」 | 115%から120% | 現在のステップは分かるが全体のステップ数は分からない | 不十分 |
| テキスト+プログレスバー「ステップX/全Yステップ」 | 125%から140% | 進捗と終わりがはっきり分かる | 第一候補 |
| 各ステップの見出し+プログレスバー | 130%から150% | 各ステップで何をするか分かる | 発展案 |
進捗表示にもうひとつ大事な要素があります。それが「戻る」ボタンです。各ステップに必ず「戻る」ボタンを置き、ユーザーが前の入力内容を修正できるようにしましょう。戻るボタンがないフォームでは、入力ミスをしたユーザーは最初からやり直すしかなく、完了率が大きく落ちます。戻るボタンは、すでに入力した内容をリセットしないようにしてください。フォームとCRMのデータ連携についてはこちらサイトのリードをCRMへ。
4. 完了率の最適化:各ステップの離脱を減らす
多段階フォームの離脱は、ステップごとに積み重なっていきます。完了率の最適化は、特定の1ステップだけを改善するのではなく、どのステップの離脱率が最も高いかを見極めて、そこに手を打つことです。一般的に、離脱率が最も高いのは2番目のステップ(要件の詳細)です。入力項目が最も多く、記入が難しいからです。
すぐに効果が出る最適化の方法をいくつか挙げます。1番目のステップは必須項目だけにして、任意項目は後ろに移す。各ステップの送信後に自動保存し、途中でページを閉じても次回続きから再開できるようにする。予算の項目は任意にしてスライダー入力にする。最後のステップの確認ページでは、入力済みの情報をすべて分かりやすく一覧表示する。フォームの信頼性についてはこちら問い合わせフォームの信頼性とスパム対策配信。
| 最適化の方法 | 期待できる完了率の向上 | 実施の難易度 | 対象ステップ |
|---|---|---|---|
| 1番目のステップは必須項目だけにする | 10%から15%の改善 | 低 | ステップ1 |
| 下書きを自動保存し、再開できる | 8%から12%の向上 | 中 | すべてのステップ |
| 予算項目をスライダー式の任意入力に | 5%から8%の向上 | 低 | ステップ3 |
| 最後のステップに確認ページを設けて一覧表示 | 5%から10%の向上 | 低 | ステップ4 |
| 各ステップに残り時間の目安を表示 | 3%から6%の向上 | 中 | すべてのステップ |
5. よくある誤解とやってはいけないこと
| 誤解 | 見かけの施策 | 実際の結果 | 正しい方法 |
|---|---|---|---|
| 項目が少ないのに無理に分割する | 5項目を3ステップに分割 | 画面遷移の負担が分割のメリットを上回る | 7項目以下なら1ページで |
| 1番目のステップで最も難しい質問をする | 要件の詳細を1番目のステップに置く | 1番目のステップで離脱率が急上昇 | 易しいものを先に、最も難しいものは中間に |
| 戻るボタンがない | 進むだけで戻れない | 入力ミスをすると最初からやり直すしかない | 各ステップに戻るボタンを置く |
| 進捗表示が「進行中」だけ | ステップ数も進捗も分からない | あとどれくらいかかるか分からない | 「全Yステップ中X番目」とプログレスバーを表示 |
| 各ステップの項目が多すぎる | 各ステップに5項目以上を詰め込む | 分割した意味がなく、無駄になる | 各ステップ2から4項目 |
| 最後のステップでもう一度入力させる | 確認ページでもう一度入力させる | 時間の無駄だと感じてそのまま閉じる | 確認ページは読み取り専用の表示と送信ボタンのみ |
この6つの誤解のうち、最も多いのは1つ目です。「多段階フォームは良い」という話だけを聞いて、項目数に関係なく分割してしまい、その結果5項目を3ステップに分けて、1ページで入力するより体験が悪くなります。分割の前提は、項目数が本当に多いこと(8項目以上)です。それ以外は1ページのほうが完了率が高くなります。
FAQ よくある質問
項目がいくつ以上なら多段階フォームに分割すべきですか?
多段階フォームはどうグルーピングするのが最適か?
多段階フォームの進捗表示はどうするのがベストか?
ユーザーが入力途中でページを閉じてしまったら?
多段階フォームに「前へ」ボタンは必要か?
多段階フォームと1ページフォーム、どちらが良いか?
最後に
多段階フォームは、一見するとフロントエンドのインタラクションの問題に思えますが、実は心理学のレバレッジを活かしてフォームの完了率を高める話です。肝心なのはフォームを長くすることではなく、長いフォームをユーザーが体感する短いタスクに分解することです。各ステップの入力欄は2つか3つだけで、次へを押すたびに進んでいる感覚があれば、ユーザーは最後まで進みやすくなります。直感に反する結論ですが、入力欄の総数が多い分割フォームのほうが、入力欄の少ない1ページフォームより完了率が高くなります。
実践は3ステップです。まずフォームの入力欄を正確に数えます。7つ以下ならそのまま、8つ以上なら分割を検討します。分割するときは簡単なものから難しいものへ並べ、最も複雑なものは中間のステップに置きます。次に「第Xステップ / 全Yステップ」の進捗表示と、各ステップの戻るボタンを追加します。最後にA/Bテストを2週間実施し、1ページ版と分割版の完了率の差を比較します。
覚えておきたい一言。多段階フォームは「長いフォームを分割する」ほど単純な話ではなく、「大きな山をいくつかの段に分ける」ようなものです。各ステップが楽に登れる高さだからこそ、ユーザーは一歩ずつ最後まで進もうと思えます。山のふもとに立ったまま、その場で引き返してしまうことはありません。
