LPのお問い合わせフォーム設計|ページ内設置と別ページの選び方
LPのお問い合わせフォームはページ内と別ページのどちらに置く?設置方法の比較、CTAと受付目的の揃え方、必要項目、スマートフォン操作、完了計測の注意点を解説します。
LPにお問い合わせフォームを置くときは、ページ内に埋め込むか、専用ページへ移動するかを選びます。どちらが常に優れているとは限りません。入力の長さ、公開環境、ページの読みやすさ、受付後の運用から判断しましょう。
ここではサービスへの相談を受けるLPを想定し、設置方法とCTAの文言、項目設計、公開前の確認を整理します。
ページ内と別ページ、それぞれの確認点
| 設置方法 | 使いやすい場面 | 確認する点 |
|---|---|---|
| ページ内 | 短い相談フォームを説明の続きに置く | ページの長さ、移動後の見出し位置 |
| 専用ページ | 項目が多い、入力へ集中してもらいたい | LPの名称や申込目的が引き継がれるか |
| 外部の受付ページ | LPの環境で送信処理を持たない | 表示や操作、移動先が分かる案内 |
外部ページをiframeで埋め込む場合は、埋め込みが許可されているか、スマートフォンで二重スクロールにならないかを確認します。入力後の高さの変化や完了画面も見てください。PHPファイルへのリンクと、PHP処理をLPへ組み込むことも別の作業です。
CTAとフォームの目的を一致させる
LPのボタンが「資料を受け取る」なら、移動先でもどの資料を、どう受け取れるかを示します。ボタンでは無料相談なのにフォームでは契約申込と書かれていると、入力してよいか迷わせます。
相談用の案内例:このサービスについて相談したい内容をお知らせください。担当者が確認し、メールでご案内します。送信時点でご契約が確定するものではありません。
ページ内の複数のCTAは、同じ受付を指すなら文言の意味も揃えます。資料請求と個別相談の二つを扱う場合は、問い合わせ種別の設計を使い、どちらを選んだか分かる形にします。
LPで説明した内容を、もう一度入力させない
一つのサービス専用LPなら、利用者にサービス名を自由記述してもらう必要があるか考えます。固定の表示や選択済みの項目で伝えられる場合があります。ただし、URLや隠し項目から渡した値は書き換えられる可能性があるため、料金や受付条件の決定根拠としてそのまま信用しない設計にします。
初回返信に必要な名前・連絡先・相談内容から始め、住所や電話番号は使い道を確認して追加します。LPだからとにかく短くするのではなく、送信後の確認が成り立つ情報を残しましょう。
フォームへ移動した直後の画面を見る
固定ヘッダーがあるLPでは、ページ内リンクで移動した見出しが隠れていないか確認します。入力欄の真ん中に移動するより、受付目的と説明を読める位置へ着地させると状況が分かります。
- スマートフォンでCTAを押して、受付説明が見えるか。
- 入力中に固定バナーがボタンを覆わないか。
- エラーが出ても、修正する項目を見つけられるか。
- 確認画面から戻ったときに入力が保持されるか。
- 完了後に同じフォームへ再送する必要がないと分かるか。
フォームの完了と広告の成果を分けて確認する
CTAのクリックは、送信の完了ではありません。完了画面の表示を成果として使う場合も、直接アクセスや再読み込みをどう扱うか確認します。入力内容そのものを解析へ送らず、必要な操作や成功状態を計測対象にします。
改善前後では、広告、流入元、掲載期間も確認してください。申込数の変化をフォームだけの効果と断定しないことが大切です。指標の考え方はEFOの改善チェックリスト、完了画面はサンクスページの設計で補えます。
公開先に合うフォームを選んで設置する
FreelanceFormを使う場合は、PHPなどの動作環境を確認し、デザイン見本をLPへ合わせます。ページ内への組み込みや計測設定は案件ごとの作業です。テンプレートを置けば広告計測まで自動で揃うとは考えず、必要な設定を分けて確認しましょう。
最後は実際のLPの入口から送信・受信まで通します。フォーム単体で動くだけでなく、LPで読んだ説明と、受付後に届く案内がつながっていることを確かめてください。