LP（ランディングページ）の構成とは、ファーストビュー・問題提起・解決策・CTA・導入事例・料金・FAQなどのセクションを、ユーザーの心理変化に沿って配置する設計のことです。構成の良し悪しがCVR（コンバージョン率）を決定づけるため、LP制作で最も重要な工程と言えます。
この記事では、Web制作20年の経験から、CVRを高めるLPの構成テンプレートを体系的に解説します。基本の10セクション一覧から、ファーストビューの設計、CTA配置の最適解、PASONA/BEAFの法則、導入事例・料金・FAQセクションの設計まで網羅しています。LP制作を外注する場合も自社で制作する場合も、構成の全体像を把握しておくことで、制作パートナーとの認識齟齬を防ぎ、成果の出るLPに仕上がります。
LPの構成要素 — 基本の10セクション一覧
LPは複数のセクションで構成されますが、闇雲にセクションを並べても成果は出ません。各セクションには明確な役割があり、ユーザーの心理変化に対応しています。以下が、CVRの高いLPに共通する基本の10セクションです。
| No. | セクション名 | 役割 | ユーザー心理 | 省略可否 |
|---|---|---|---|---|
| 1 | ファーストビュー（FV） | 第一印象の形成・離脱防止 | 「自分に関係あるか？」 | 必須 |
| 2 | 問題提起 | 課題の言語化・共感の獲得 | 「そうそう、この悩みがある」 | 必須 |
| 3 | 解決策の提示 | 商品・サービスの概要紹介 | 「これで解決できるかも」 | 必須 |
| 4 | メリット・特徴 | 他社との差別化・選ぶ理由 | 「なぜこのサービスなのか？」 | 必須 |
| 5 | 導入事例・お客様の声 | 社会的証明・信頼の獲得 | 「本当に成果が出るのか？」 | 強く推奨 |
| 6 | 実績・数字 | 権威性の証明 | 「どれくらいの実績があるか？」 | 推奨 |
| 7 | 料金プラン | 価格の透明性・比較検討 | 「いくらかかるのか？」 | 商材による |
| 8 | 利用の流れ | 手順の可視化・不安の解消 | 「どう進めればいいのか？」 | 推奨 |
| 9 | FAQ | 残る疑問の解消 | 「この点が気になる」 | 強く推奨 |
| 10 | CTA（コールトゥアクション） | 行動の促進・コンバージョン | 「申し込もう / 相談しよう」 | 必須 |
この10セクションは、あくまで「基本形」です。商材やターゲットによってセクションの順序を入れ替えたり、一部を省略したりすることは問題ありません。ただし、ファーストビュー・問題提起・解決策・CTAの4セクションは、どのLPでも省略できない骨格です。
セクションの順序が重要な理由
LPはWebサイトのように回遊するものではなく、上から下に読み進める一方通行のコンテンツです。ユーザーの心理は「興味→共感→理解→信頼→行動」の順に変化します。この心理変化の順序に逆らった構成 — たとえば、問題提起の前に料金を提示する — は、離脱の原因になります。
Unbounceの調査によると、LPの平均CVRは業界横断で4.3%、上位25%のLPは11.45%以上のCVRを達成しています。この差を生む最大の要因が、セクションの構成と順序です。構成を最適化することで、同じ広告費・同じ流入数でもCVRを2〜3倍に改善できる可能性があります。
ファーストビュー（FV）の設計 — 3秒で離脱を防ぐ要素
ファーストビュー（FV）とは、ユーザーがLPにアクセスした直後にスクロールせずに見える画面領域のことです。LPの成否を決める最も重要なセクションであり、ユーザーの約50%がFVだけで離脱するかどうかを判断します。
FVに必要な5つの要素
- キャッチコピー（h1）: ユーザーの課題に直接刺さる一文。「何が得られるか」を明確にする
- サブコピー: キャッチコピーを補足する1〜2行の説明文。具体的な数字やベネフィットを含める
- メインビジュアル: 商品・サービスの利用イメージを伝える画像や動画
- CTA（一次CTA）: FV内に配置する最初のCTAボタン。スクロールせずにアクションできる導線
- 信頼性の根拠: 導入社数、受賞歴、メディア掲載ロゴなど、初見の信頼を補強する要素
キャッチコピーの設計パターン
キャッチコピーはLPのCVRに最も影響する要素の1つです。Web制作20年の経験で効果が高いと実感しているパターンは以下の通りです。
| パターン | 構成 | 例 |
|---|---|---|
| ベネフィット直球型 | 「〇〇が△△になる」 | 「問い合わせ数が3倍になるLP制作」 |
| 数字訴求型 | 具体的数値で成果を示す | 「導入企業300社、平均CVR改善率187%」 |
| 課題共感型 | ターゲットの悩みをそのまま表現 | 「広告費をかけても問い合わせが増えない…」 |
| 質問型 | ユーザーに問いかける | 「その LP、本当に成果が出ていますか？」 |
| 権威型 | 実績や専門性で訴求 | 「10年連続 顧客満足度No.1のLP制作」 |
キャッチコピーの文字数は15〜30文字が目安です。長すぎると認知負荷が上がり、短すぎると訴求力が不足します。HubSpotの調査では、具体的な数字を含むキャッチコピーは含まないものと比較してクリック率が36%高いと報告されています。
FVの設計で避けるべきミス
FVの設計で多くの制作者が犯すミスを挙げます。
- キャッチコピーが抽象的すぎる: 「ビジネスを加速する」「未来を変える」のような曖昧な表現は、ユーザーに「自分ごと」として認識されない
- 情報を詰め込みすぎる: FVにすべてのメリットを並べると、かえって何も伝わらない。伝えることは1つに絞る
- CTAが目立たない: 背景色とCTAボタンの色が同系色で埋もれている。コントラスト比を確保する
- モバイル表示を考慮していない: PC版では綺麗に収まるFVが、モバイルではCTAが画面外に押し出されている
- ページの読み込みが遅い: FVに高解像度の画像や動画を無圧縮で配置し、表示に5秒以上かかる
特にモバイルのFV設計は、PC版とは別に考える必要があります。モバイルではFVの高さが限られるため、キャッチコピー・サブコピー・CTAの3要素を画面内に収めることを最優先とし、メインビジュアルやロゴはスクロール後に表示しても問題ありません。
FVの高さの目安
FVの高さはデバイスによって異なります。以下の範囲に収めることを目安にしてください。
- PC: 600〜750px（フルHDモニタで画面内に収まるサイズ）
- タブレット: 500〜700px
- スマートフォン: 500〜650px（iPhoneのviewportを基準）
重要なのは、キャッチコピーとCTAがスクロールなしで表示されることです。背景画像の美しさやアニメーションの演出よりも、ユーザーが即座に「何のページか」「何をすればいいか」を理解できることを優先してください。
CTA（コールトゥアクション）の最適な配置と文言
CTAはLPの目的そのものであり、すべてのセクションはCTAに向けてユーザーを誘導するために存在します。CTAの配置・文言・デザインがCVRに直結するため、感覚ではなくデータに基づいて設計することが重要です。
CTAの配置パターン
LPにおけるCTAの配置には、大きく3つのパターンがあります。
- FV内CTA: ファーストビュー内にCTAを配置する。即決型のユーザーを取りこぼさない
- セクション間CTA: 各セクションの間にCTAを挟む。ユーザーが「もういいかな」と思ったタイミングで行動できる
- ボトムCTA: ページ最下部に配置する。全セクションを読み終えた納得度の高いユーザーを獲得する
効果的なLPでは、この3パターンをすべて使います。具体的には、FV内に1つ、セクション間に2〜3つ、ボトムに1つ、計4〜5つのCTAを配置するのが標準です。
CTA文言の比較
CTAボタンの文言によってクリック率は大きく変わります。以下は、業界で広く知られている文言の効果比較です。
| CTA文言 | 心理的特徴 | 適するケース |
|---|---|---|
| 「無料で相談する」 | ハードルが低い。「無料」がクリック率を押し上げる | BtoB、コンサル、制作会社 |
| 「今すぐ申し込む」 | 緊急性を感じさせる。即決ユーザー向け | キャンペーンLP、期間限定オファー |
| 「資料をダウンロードする」 | 個人情報の提供と引き換えに情報を得る | BtoB、SaaS、ホワイトペーパー |
| 「まずは無料で試す」 | リスクゼロを強調。トライアル提供型 | SaaS、サブスク、EC |
| 「見積もりを依頼する」 | 具体的なアクション。購買意欲が高い層向け | 制作会社、リフォーム、BtoB |
| 「お問い合わせはこちら」 | 汎用的だが曖昧。クリック率は最も低い傾向 | 特に推奨しない |
WordStreamの調査によると、CTAに「無料」を含めるとクリック率が平均28%向上する結果が出ています。また、一人称（「〇〇を手に入れる」）のほうが二人称（「〇〇を手に入れてください」）よりもクリック率が高いという結果もあります。
CTAデザインの3原則
CTAボタンのデザインは、以下の3原則に従ってください。
- コントラスト: CTAボタンの色は、ページ内で使われていない色にする。補色関係にある色が最も目立つ。背景が白系なら青やオレンジ、ダーク系なら明るいグリーンやイエローが有効
- サイズ: CTAボタンはページ内で最も大きなボタンにする。モバイルでは横幅いっぱい（width: 100%）のボタンが効果的
- 余白: CTAボタンの周囲に十分な余白を確保する。他の要素と近すぎると視覚的に埋もれ、クリック率が下がる
マイクロコピーの活用
CTAボタンの直下に1行の補足テキスト（マイクロコピー）を添えると、クリック率が向上します。
- 「最短30秒で入力完了」（手間の少なさ）
- 「クレジットカード不要」（リスクの低さ）
- 「毎月100社以上にご利用いただいています」（社会的証明）
- 「〇〇日まで限定50%OFF」（緊急性）
マイクロコピーは、ユーザーがCTAボタンをクリックする直前の「最後の一押し」として機能します。ボタンの文言だけでは伝えきれない安心感や緊急性を補足する役割です。
問題提起 → 解決策の流れ — PASONAの法則とBEAFの法則
LPの中盤を構成する「問題提起→解決策→メリット」の流れは、ユーザーの心理を「共感→期待→納得」に導くストーリー設計です。この流れを体系化したフレームワークとして、PASONAの法則とBEAFの法則の2つが広く使われています。
PASONAの法則
PASONAの法則は、マーケティングコンサルタントの神田昌典氏が提唱したセールスライティングのフレームワークです。LPの構成にそのまま適用できます。
| ステップ | 意味 | LPでの実装 |
|---|---|---|
| P: Problem（問題） | ユーザーの抱える課題を提示 | 「こんなお悩みはありませんか？」セクション |
| A: Affinity（親近感） | 課題への共感を示す | 「私たちも同じ課題に直面していました」 |
| S: Solution（解決策） | 自社サービスを解決策として紹介 | サービス概要・特徴の提示 |
| O: Offer（提案） | 具体的なオファー（条件）を提示 | 料金プラン・特典・限定オファー |
| N: Narrowing（絞り込み） | 対象や期間を限定し緊急性を出す | 「先着30社限定」「〇月〇日まで」 |
| A: Action（行動） | CTAで行動を促す | 「今すぐ無料で相談する」 |
PASONAの法則は、特にBtoB向けのLP（問い合わせ獲得型・資料請求型）で高い効果を発揮します。ユーザーの課題を起点にストーリーを組み立てるため、「自分ごと」として受け取ってもらいやすい構成です。
BEAFの法則
BEAFの法則は、ECやBtoC向けのLPで効果的なフレームワークです。
| ステップ | 意味 | LPでの実装 |
|---|---|---|
| B: Benefit（ベネフィット） | 商品を使った結果得られるメリット | ビフォー・アフターの提示 |
| E: Evidence（根拠） | ベネフィットの裏付けとなる証拠 | データ、受賞歴、専門家の推薦 |
| A: Advantage（優位性） | 競合と比較した際の優位性 | 比較テーブル、独自技術の説明 |
| F: Feature（特徴） | 商品・サービスの具体的な特徴 | スペック、機能一覧、素材・製法 |
BEAFの法則では、最初に**ベネフィット（結果）**を見せてからその根拠を提示する、という順序がポイントです。「この商品にはこんな特徴があります」ではなく、「こんな結果が得られます。その理由は〜」という構成にすることで、ユーザーの興味を持続できます。
2つの法則の使い分け
| 比較項目 | PASONAの法則 | BEAFの法則 |
|---|---|---|
| 適する業種 | BtoB、コンサル、サービス業 | EC、BtoC、物販 |
| 起点 | ユーザーの「課題」 | 商品の「ベネフィット」 |
| CVの種類 | 問い合わせ、資料請求、無料相談 | 購入、カート追加、定期購入 |
| ストーリー | 課題→共感→解決→提案→行動 | 結果→根拠→差別化→特徴 |
| LP全体の長さ | 長め（4,000〜8,000px） | 中〜長め（3,000〜6,000px） |
どちらのフレームワークを選ぶかは、商材とターゲットによります。BtoB向けの問い合わせ獲得LPならPASONA、EC系の購入促進LPならBEAFが基本です。ただし、両方を組み合わせて使うケースも多く、たとえば「PASONAの流れで全体を構成し、解決策セクション内ではBEAFの順序でサービスを紹介する」といったハイブリッド構成も効果的です。
問題提起セクションの書き方
問題提起セクションは、ユーザーが「そうそう、これが困っている」と共感するための場所です。以下のポイントを押さえてください。
- ユーザーの言葉で書く: 専門用語ではなく、ユーザーが実際に口にする言葉で課題を表現する。「CVRが低い」ではなく「広告費はかけているのに問い合わせが来ない」
- 具体的なシーンを描写する: 「上司に報告するたびに、成果が出ていないことを説明しなければならない」のように、ユーザーが置かれている状況をリアルに描く
- 3〜5個の箇条書きで列挙する: 課題を箇条書きで並べることで、1つでも当てはまればユーザーは「自分のことだ」と感じる
- 課題の深刻さを示す: 放置するとどうなるかを示唆する。「このまま放置すると、広告費だけが膨らみ続けます」
解決策セクションの書き方
解決策セクションでは、問題提起で示した課題を自社の商品・サービスがどう解決するかを提示します。
- 課題と解決策を1対1で対応させる: 問題提起で挙げた各課題に対して、それぞれの解決策を示す
- 「何ができるか」ではなく「何が変わるか」で伝える: 機能の羅列ではなく、ユーザーの状態がどう変わるかを描く
- ビジュアルで補強する: 解決策のイメージ図、利用画面のスクリーンショット、ビフォー・アフターの写真で理解を補助する
- 具体的な数字を含める: 「改善する」ではなく「平均で1.8倍に改善する」のように、可能な限り数字で示す
導入事例・お客様の声セクションの設計
導入事例・お客様の声は、**社会的証明（ソーシャルプルーフ）**を提供するセクションです。どれだけ自社の強みを語っても、ユーザーが最も信頼するのは「同じ立場の人の体験談」です。Nielsen Norman Groupの調査でも、ユーザーの92%が「知らない人のレビューでも、企業の自己宣伝より信頼できる」と回答しています。
効果的な導入事例の構成
導入事例は、以下の4要素で構成すると説得力が増します。
- 課題（Before）: 導入前にどのような課題を抱えていたか
- 選定理由: なぜ自社サービスを選んだか。競合と比較した際のポイント
- 導入後の変化（After）: 具体的な数字での改善結果（「問い合わせが月5件→月22件に」など）
- 担当者のコメント: 実名・肩書き・顔写真付きのコメント。可能であれば企業ロゴも
お客様の声（テスティモニアル）の設計ポイント
- 実名・顔写真・肩書きを掲載する: 匿名のレビューよりも信頼性が格段に高い。「東京都・30代・男性」よりも「株式会社〇〇 マーケティング部 田中様」のほうが響く
- 具体的な数字を含む声を優先する: 「とても満足しています」よりも「CVRが2.3倍に改善しました」のほうが説得力がある
- ネガティブな要素も含める: 「最初は半信半疑でしたが」「正直、費用は安くないですが」のような正直な声が含まれると、全体の信頼性が向上する
- ターゲットに近い属性の声を選ぶ: BtoB向けLPならBtoB企業の声、中小企業向けなら中小企業の声を優先的に掲載する
導入事例がまだ少ない場合の対策
サービス立ち上げ直後で導入事例が不足している場合、以下の代替手段で社会的証明を補うことができます。
- β版テストの結果: β版を利用したユーザーのフィードバックを導入事例として掲載
- 導入社数・利用者数: 「100社が導入」「累計10,000ユーザーが利用」などの数字を掲示
- メディア掲載実績: プレスリリースやメディア記事で取り上げられた実績をロゴで表示
- 業界専門家の推薦: その業界の有識者からの推薦コメント
- 自社の実績: サービス提供者自身の実績（「過去200サイトのLP制作で培った知見」など）
事例がゼロの状態でも、「実績ゼロだから社会的証明を省略する」のは避けてください。何かしらの代替手段で信頼性を補強することが、CVRの維持には不可欠です。
料金セクションの見せ方 — 比較テーブルの設計パターン
料金セクションは、ユーザーが最も知りたい情報の1つでありながら、設計を間違えるとCVRを下げる原因にもなるセクションです。料金の見せ方は、商材の性質と価格帯によって最適なパターンが異なります。
料金セクションの設計パターン
| パターン | 内容 | 適するケース |
|---|---|---|
| 松竹梅型（3プラン） | 3段階のプランを比較テーブルで表示 | SaaS、定額サービス、パッケージ商品 |
| 料金レンジ型 | 「30万円〜80万円」のように幅を提示 | 受託制作、コンサル、カスタムメイド |
| 事例ベース型 | 「A社の場合：〇〇万円」と具体例で示す | 高単価BtoB、コンサル |
| 料金非公開型（問い合わせ誘導） | 料金を記載せずCTAへ誘導 | エンタープライズ向け、カスタム見積もり |
松竹梅型プランの比較テーブル設計
3プラン構成の場合、中間プランをおすすめとして強調するのが定石です。これは「おとり効果（Decoy Effect）」と呼ばれる心理効果を利用したもので、3つの選択肢がある場合、人は真ん中を選びやすい傾向があります。
比較テーブルの設計で押さえるべきポイントは以下の通りです。
- おすすめプランを視覚的に強調する: 色の違い、「人気No.1」バッジ、枠線の強調などで最も売りたいプランを目立たせる
- プラン間の違いを明確にする: 機能の有無だけでなく、「どのような課題を持つ人に向いているか」をプラン名やサブタイトルで表現する
- CTAをプランごとに配置する: 各プランの直下にCTAボタンを配置し、プランを選んだ直後に行動できるようにする
- 年額と月額の切り替えを用意する: SaaS系の場合、年額割引の表示で年額契約への誘導を図る
料金レンジ型の設計ポイント
受託制作やコンサルティングのように、案件ごとに費用が変動する商材では、料金レンジ型が適しています。「30万円〜80万円」のような幅のある表記が一般的ですが、ユーザーは「結局いくらかかるのか分からない」と不安を感じやすいのが難点です。
この不安を解消するために、以下の工夫を取り入れてください。
- 事例ベースの料金例を併記する: 「A社様（LP1ページ＋フォーム）：35万円」のように、実際の制作事例と費用を掲載する
- 費用に影響する要素を明示する: 「デザインの作り込み」「ページ数」「アニメーションの有無」など、費用が変動する要因をリスト化する
- 見積もりまでのステップを簡潔に示す: 「無料相談→ヒアリング→お見積もり（最短3営業日）」のように、見積もり取得の手順を可視化する
LP制作の費用相場について詳しくは、「LP制作の費用相場とSEM広告で成果を出すポイント」で解説しています。
FAQセクションの構成 — ユーザーの不安を解消する
FAQセクションは、ユーザーがCTAをクリックする直前に残る「最後の疑問」を解消するためのセクションです。CTAの直前に配置することで、「気になる点はあるけど、聞くほどでもないし…」という理由での離脱を防ぎます。
FAQの設計原則
- ユーザーの実際の質問を収集する: 営業・カスタマーサポートが頻繁に受ける質問をベースにする。想像で作ったFAQは的外れになりやすい
- 質問は具体的に書く: 「料金について」ではなく「料金の支払い方法にはどのような選択肢がありますか？」のように、ユーザーが実際に使う言葉で書く
- 回答は簡潔かつ完結に: 1つの回答は3〜5行程度にまとめる。長文が必要なテーマは別ページへのリンクを設ける
- 5〜10問に絞る: 多すぎると読まれない。最も重要な質問から順に並べる
- 購入の障壁を取り除く質問を優先する: 「返品はできますか？」「契約期間の縛りはありますか？」「個人情報は安全ですか？」などの不安系の質問を優先する
LPにおけるFAQの効果的な分類
| 質問カテゴリ | 例 | 目的 |
|---|---|---|
| 料金・費用 | 「追加費用はかかりますか？」 | 価格に対する不安の解消 |
| サービス内容 | 「対応可能な業種はありますか？」 | 対象範囲の明確化 |
| 手続き・フロー | 「申し込みから納品までどれくらいかかりますか？」 | プロセスの可視化 |
| 保証・サポート | 「契約後のサポート体制はどうなっていますか？」 | リスクの軽減 |
| 比較・選定 | 「他社サービスとの違いは何ですか？」 | 差別化の補強 |
アコーディオン形式の推奨
LPのFAQは、**アコーディオン（開閉式）**で実装することを推奨します。すべての質問と回答を展開した状態で表示すると、ページが長くなりすぎてユーザーが圧倒されます。アコーディオン形式にすることで、ユーザーは自分が気になる質問だけを選択的に確認でき、それ以外はスキップできます。
FAQ構造化データ（FAQPage JSON-LD）を実装すると、Google検索結果にFAQが表示される可能性があります。検索結果上でのCTR（クリック率）向上と画面占有面積の拡大が期待できるため、必ず実装してください。
まとめ — LP構成チェックリスト
LPの構成は、CVRを決定づける最も重要な設計要素です。テンプレートをそのまま使うのではなく、自社の商材・ターゲット・流入元に合わせてカスタマイズすることで、成果の出るLPに仕上がります。
この記事で解説した内容を、LP制作時のチェックリストとして活用してください。
構成全体のチェックリスト
- LPの目的（CVの種類）が1つに絞られているか
- ターゲットペルソナが明確に定義されているか
- 基本の10セクションのうち、必須セクション（FV・問題提起・解決策・CTA）が含まれているか
- セクションの順序がユーザーの心理変化に沿っているか
- PASONAまたはBEAFの法則に基づいたストーリー構成になっているか
ファーストビューのチェックリスト
- キャッチコピーがユーザーのベネフィットを明確に伝えているか
- サブコピーに具体的な数字が含まれているか
- CTAがスクロールせずに表示される位置に配置されているか
- モバイルでもFV内にキャッチコピーとCTAが収まっているか
- 広告キーワードとFVの訴求が一致しているか
CTAのチェックリスト
- CTAが4〜5箇所に配置されているか（FV内、セクション間2〜3箇所、ボトム）
- CTA文言が具体的なアクションを示しているか（「こちら」ではなく「無料で相談する」）
- CTAボタンが視覚的に目立つか（周囲とのコントラスト比を確認）
- マイクロコピーで最後の一押しがあるか
- フォームの項目数が5個以下か
信頼性のチェックリスト
- 導入事例またはお客様の声が3件以上掲載されているか
- 実名・肩書き・顔写真が含まれているか
- 具体的な数字（改善率、導入社数など）が掲載されているか
- FAQで購買の障壁となる疑問に回答しているか
- 外部データやの引用の出典が明記されているか
パフォーマンスのチェックリスト
- モバイルのPageSpeed Insightsスコアが80以上か
- 画像がWebP形式で最適化されているか
- モバイル表示でテーブルが横にはみ出していないか
- CTAボタンがモバイルでタップしやすいサイズか（高さ48px以上）
- ページ全体の読み込み時間が3秒以内か
LP構成のA/Bテスト設計と業界別パターンについてはLP改善・A/Bテストガイドで詳しく解説しています。
LP構成の設計から制作、公開後のA/Bテストまで、一貫した支援をお求めの方はRINIAのLP制作サービスをご覧ください。コーポレートサイト制作やUIデザインも対応しています。LP制作の予算感は「ホームページ制作の費用相場」も合わせてご確認ください。まずはお問い合わせフォームからお気軽にご連絡ください。
無料相談する