この記事の監修者

粟飯原 匠 |CEO

ベンチャーやスタートアップにて新規事業のマーケティング・セールスを担当し年商5億円までのグロースを経験。PENGIN Inc.を創業し、現在は上場企業やレガシー産業のマーケティング戦略の立案〜実行支援までを担当。

LPのファーストビューにフォームを置くべきか。それとも、説明を読んでもらってから入力へ進んでもらうべきか。

PENGINでは、位置だけで正解を決めず、読者が行動を決めるために何を確認する必要があるかから考えます。すでに申し込みたい人には入力までの手間を減らす。一方、まだサービスを理解していない人には、判断に必要な説明を届ける。両方を満たす設計が必要です。

ファーストビューとは、ページを開いた直後に表示される範囲です。メイン画像だけでなく、見出し、説明、実績、CTAなども含み、画面サイズによって見える範囲は変わります。

この記事では、PENGINで紹介してきた改善事例を出発点に、フォームと信頼情報をどう組み合わせ、何を検証するかを整理します。

実践事例|フォームへの導線と信頼情報を一緒に見直した

紹介してきた事例では、ボタンから入力へ進む構成に対し、メインビジュアルの近くにフォームを直接表示しました。同時に、実績や導入企業のロゴなど、信頼を補う情報も追加しています。

ここで変更したのは、フォームの位置だけではありません。入力までの手間を減らす変更と、依頼先を判断する材料を補う変更を組み合わせています。

そのため、この事例を「フォームを上に移せば同じ結果が出る」と読むのは適切ではありません。今回、比較期間・母数・流入構成などを元データで再照合していないため、改善倍率は示していません。フォーム配置と信頼情報のどちらが、どの程度寄与したかも切り分けられていません。

この実践からPENGINが重視するのは、入力欄を見せること自体ではなく、行動の前に残っている迷いを確認することです。申し込みの意思はあるがフォームが見つからないのか、入力はできてもサービスへの不安が残っているのかでは、優先する改善が変わります。

ファーストビューでは、行動前の4つの問いを整理する

PENGINでは、冒頭の情報を次の4つの問いで確認します。これは全要素を1画面に詰め込む指示ではなく、読者に必要な情報とその順番を決めるための整理です。

読者の問い用意する情報の例
自分に関係があるか対象企業、担当者、解決する課題。対象外の条件が重要なら、それも分かるようにする。
何が得られるかサービスの価値、資料の内容、相談できること。抽象的な形容詞だけで終わらせない。
その説明を信じてよいか主張に関係する実績、支援内容、導入事例。確認できる情報だけを示す。
次に何をすればよいか資料請求・相談などの行動と、送信後の案内。CTAとフォームの目的をそろえる。

たとえば「業務を効率化できます」という見出しだけでは、どの業務をどう変えられるかが分かりません。「営業担当者の見積作成を支援する」のように対象と用途を示し、その説明を裏付ける情報へつなげます。これは説明用の例であり、PENGINの特定案件のコピーではありません。

実績も、数が多ければよいとは限りません。読者が自社に近い課題を解決できそうか判断できるかを見ます。企業ロゴを置く場合も、何の支援実績なのかが分かる表現にし、根拠を示せない数値や比較優位を追加しないことが大切です。

LPのファーストビューで、読者が自分向けか、何を得られるか、信頼できるか、次に何をするかを確認できるようにする4つの問い。入力までの距離だけでなく、行動前の迷いを減らす情報を整理した概念図。
PENGIN整理。フォームへの導線と、行動を決めるための情報を一緒に確認します。

フォーム直接設置と、説明を先に見せる設計を選び分ける

すでに申し込みたい人には、入力までの手間を減らす

サービスや資料を理解し、すぐに申し込みたい読者がいるなら、フォームを探したり、別ページへ進んだりする手間を減らす設計は検討できます。

ただし、指名検索というだけで全員が申し込みたいとは限りません。ログイン先や既存顧客向け情報を探す人も想定し、実際の検索語句、流入先、問い合わせ内容を見て判断します。

直接フォームを置く場合は、得られるものと入力項目の意味を一緒に伝えます。入力欄だけを大きく見せ、サービスの説明が読めなくなる構成は避けたいところです。

説明が必要な人には、理解を進める道筋を残す

初めて知るサービスや、導入条件の確認が必要な商材では、いきなり詳細な問い合わせ内容を書いてもらうことが難しい場合があります。

この場合は、冒頭で価値と対象を示し、事例、機能、料金の考え方など必要な説明を経て、フォームへ進める構成を検討します。「資料の内容を見る」「相談できることを確認する」など、行動前の疑問に答える経路も選択肢です。

同じLPに両方の読者が来るなら、冒頭には申し込みへの入口を残しつつ、説明を読み進められるようにします。誰もが同じ順番で読む前提にせず、急ぐ人の手間と、検討する人の情報不足をそれぞれ減らすという考え方です。

広告からどのような目的の人を集め、何を約束するかは、広告LPのCVR改善と流入意図の設計で詳しく解説しています。

すでに申し込みたい読者と、サービスの説明が必要な読者を、目的・不足情報・導線の候補・確認事項の4軸で比較。フォーム直接設置を万能な正解にせず、入力の手間と情報不足を分けて考える図。
PENGIN整理。読者の状態は固定ではなく、必要な情報や経路は変わります。

見える場所に置くだけでなく、入力できる状態にする

PCでは収まるフォームでも、スマートフォンでは入力欄が画面を占有し、見出しや説明を押し下げることがあります。画面サイズごとに、何が最初に見えるか、説明を読めるか、入力中に困る場所がないかを確認しましょう。

入力項目の名前を、欄の中の例文だけで済ませていないかも確認対象です。W3Cのフォームラベルに関するガイドでは、入力欄の目的を示すラベルと、対象の入力欄を適切に関連付ける方法が説明されています。

また、入力を間違えたときに修正箇所が分かるか、入力内容が消えないか、送信後の案内が実際の対応と一致するかを点検します。フォーム到達後の具体的な確認項目は、EFOによるフォーム離脱の改善方法をご覧ください。

フォームを複数箇所に設置する場合には、表示・入力・送信の計測が重複していないかも確認します。配置を増やしただけで成果件数まで増えて見えないよう、計測仕様も合わせて点検しましょう。

改善結果を見るときは、何を変えて何を比べたかを残す

最初に、「申し込みたい人が入力場所を見つけにくい」「対象と価値が伝わっていない」など、確認した問題と改善仮説を一文で残します。

フォーム配置だけの効果を調べたいなら、比較する版の見出しや実績情報を同時に大きく変えない方が、何を検証したかが明確になります。反対に、複数箇所をまとめて直すなら、全体の変更パッケージとして評価し、1要素だけの効果とは説明しません。

計測では、フォームへの到達・入力開始・受付成功を分け、同じ流入条件、デバイス、CVの定義で比較します。CTAクリックが増えても、受付まで進まなければ問い合わせの増加とはいえません。

GA4のセッションキーイベント率は、キーイベントが発生したセッションを全セッションで割る指標です。イベントの延べ回数をセッションで割った値とは区別します。定義はGoogle公式のディメンションと指標一覧で確認できます。

母数が少ない場合は、1件の差だけで採用を決めず、入力観察や問い合わせ内容も合わせて仮説を確かめます。フォームで集まった相談が自社の対象に合うか、その後の商談につながるかも確認しましょう。率だけ高めるために必要な条件まで伏せてしまうと、営業側の対応が増えるだけになりかねません。

よくある質問

Q.ファーストビューにフォームを置けばCVRは上がりますか?

A.

一律にはいえません。入力までの手間が課題なら改善候補ですが、サービス理解や信頼材料が足りない場合には、先にその説明を整える必要があります。

Q.必要な情報はすべて最初の画面に入れるべきですか?

A.

すべて詰め込む必要はありません。対象と価値、次の行動が分かる状態をつくり、詳細を読みたい人が進める道筋を残します。スマートフォンでの見え方も確認します。

Q.少ないアクセスでも改善に着手できますか?

A.

送信できない、ラベルが分からないといった問題は、アクセスが少なくても修正対象です。ただし、CVRの小さな変化から効果の大きさを断定するのは避け、仮説と確認結果を記録しながら進めます。

まとめ|フォームの位置より、行動前の迷いを確かめる

ファーストビューの改善では、フォームを目立たせるだけでなく、自分に関係があるか、何が得られるか、信頼できるか、次に何が起きるかを確認できる状態にします。

別のLP制作実績として、Pro-D-use様のランディングページ制作では、要件定義・情報設計からデザイン・コーディングまで担当しています。制作範囲やデザインは実績ページでご確認いただけます。

既存LPの改善箇所を整理したい方は、PENGINのサイト分析・改善支援をご覧ください。新規制作や構成からの見直しについては、ランディングページ制作でも支援内容を紹介しています。LPの改善について相談するから、現在の課題をお聞かせください。

    お名前

    必須

    メールアドレス

    必須

    電話番号

    必須

    会社名

    必須

    お問い合わせ内容

    必須