ファーストビューで伝えるべき3要素:3秒で「読む」か「閉じる」かが決まる

LPのファーストビュー(FV)は、3秒で「読む」か「閉じる」かが決まる場所です。 FVで離脱が多い、何を書けばいいか迷う、と止まっているLP担当者の方に向けて書いています。 LP100本以上の実績から見えた「FVで伝えるべき3要素」と、その設計手順を整理します。

ファーストビュー(FV)とは何か

ファーストビュー(FV)とは、LPを開いた瞬間に、スクロールせずに画面に表示される領域のことです。英語では Hero Section や Above the Fold とも呼ばれます。

PCで言えば、画面の上から最初のスクロールが必要になるまでの範囲。スマートフォンで言えば、最初に親指を動かさずに見える1画面分です。表示領域は端末によって変わりますが、「最初に目に入る情報」という意味では共通しています。

FVがLPの中で特別に扱われる理由は、3つあります。

• 全訪問者が必ず見る場所:本文より下に進む人は半分以下になることが多い中、FVは100%の人が見る
• 最も多くの人が離脱する場所:「自分には関係ない」と判断されると、3秒で閉じられる
• 以降の本文を読む価値があるか、決める場所:FVで興味を持ってもらえなければ、本文は読まれない

LP100本の実感としても、FVの設計が弱いLPは、本文をいくら磨いてもCVRが上がりません。本文改善の前に、まずFVを整える。これがLPO の基本順序です。

なぜ3秒で「読む」か「閉じる」が決まるのか

「3秒で離脱」というのは、感覚的な話ではなく、ヒートマップやアクセス解析でも確認できる現象です。理由は、人の情報処理の仕組みに根ざしています。

検索や広告の流入は「複数の選択肢を比較中」だから

LPへの主な流入経路は、検索結果からのクリック、または広告からのクリックです。どちらの場合も、利用者はすでに「複数の選択肢を見比べている最中」にあります。1つのLPで判断が終わるのではなく、3〜5本のサイトを並行して開いて、見比べています。

並行で見比べている状態だと、「ピンと来ない」サイトは即座に閉じられます。「ちょっと読んでみよう」という余裕はありません。3秒で「自分向けかどうか」を判断され、関係ないと判断されれば、戻るボタンで離脱します。

利用者は「読みたい」のではなく「答えを探している」から

「LPを読みに来た」という感覚は、利用者側にはありません。利用者は「自分の困りごとを解決する方法を探している」だけです。LPは、その答えを提示してくれるかどうかで判断されます。

つまり、FVは「読ませる場所」ではなく「答えを示す場所」です。文章を読み込ませる前に、「ここに答えがある」を一目で示す必要があります。読み込まないと答えが分からないFVは、3秒で閉じられます。

スマートフォン閲覧が前提だから

LPの大部分は、スマートフォンで閲覧されます。スマートフォンの画面は小さく、片手で持って親指でスクロールする使い方が中心です。

この閲覧スタイルだと、「閉じる」と「次に進む」が同じ動作の延長線上にあります。少しでも「違うかも」と感じた瞬間、無意識に戻るボタンを押せます。ボタンを押すのが容易な分、離脱の閾値も低い。これが、3秒で離脱が起こる構造的な理由です。

FVで伝えるべき3要素

FVで伝えるべきは、突き詰めると3要素だけです。順番にも意味があります。

1. 誰のためのLPか

最初に伝えるべきは、「このLPは、誰のために書かれているか」です。3秒で離脱するかどうかを決める要因の1つ目が、「自分向けか?」の判定だからです。

書き方の例:

• 「月10件以上の問い合わせを取りたい中小企業の経営者へ」
• 「広告経由のLPでCVRが上がらず悩むマーケ担当者へ」
• 「年商3〜10億規模で、マーケ担当が1〜2人のBtoB企業様へ」

「すべての方へ」「事業者の皆様へ」のような曖昧な対象は、誰にも自分ごと化されません。具体的に絞った方が、対象読者には強く刺さります。「対象外の人を捨てる勇気」が、誰のためのLPかを書く時に必要になります。

2. 何が解決するか

次に伝えるべきは、「このLPで紹介するサービスは、どんな課題を解決するか」です。利用者は、解決したい課題を持って検索や広告経由で訪れています。そこに「あなたの課題はこれですよね、それを解決します」と先回りで示すことで、利用者は「自分の困りごとに合っている」と認識します。

書き方の例:

• 「LPのCVRが上がらない原因を、3軸で診断します」
• 「マーケ施策の優先順位がつかない問題を、90日計画で解消します」
• 「広告費が無駄になっているリスティング運用を、構造から見直します」

ここで大事なのは、「機能」ではなく「課題」で書くことです。「LPO支援サービスです」は機能訴求。「LPのCVRが上がらない原因を診断します」は課題訴求。利用者の頭の中の言葉に合わせるのが、課題訴求の基本です。

3. どうなるか(Before/Afterの変化)

最後に伝えるべきは、「サービスを利用すると、どう変わるか」です。Before(今の状態)と After(変化後の状態)の対比で示すと、利用者は導入後をイメージできます。

書き方の例:

• 「広告予算は変えずに、問い合わせ数を2倍に」
• 「90日後、社内に『データを見るリズム』が定着している状態へ」
• 「LPの離脱箇所が、ヒートマップを見れば一目で分かる状態に」

数字で書ける場合は、数字で書いてください。数字にしにくい変化は、「Before:〜〜状態、After:〜〜状態」の対比で書きます。曖昧な「成果が上がる」「効果的に活用できる」では、利用者の頭の中にイメージが作れません。

3要素を1ページに収める実務手順

3要素を理解しても、FVデザインに落とす段階で詰まる方が多い。実務の手順を整理します。

Step 1: 3要素を1行ずつテキストで書き出す

デザインに入る前に、必ずテキストで書き出してください。次の形式です。

• 誰のため:(1行)
• 何が解決:(1行)
• どうなる:(1行)

それぞれ40〜60文字に収まる長さで書きます。長すぎる文章は、FVに入りません。短く書けない場合は、まだ訴求が絞り切れていない、ということです。

Step 2: 3要素を「優先順位」で並べる

3要素をFV内のどこに配置するか、を決めます。基本パターンは次の通りです。

• メインコピー(大きい文字):「どうなる」(Before/Afterの変化)
• サブコピー(中くらいの文字):「誰のため」+「何が解決」を補強
• 箇条のベネフィット:3つの強みやメリットを箇条で

「どうなる」を最初に大きく見せる理由は、利用者が一番知りたいのは「自分にとって何が変わるか」だからです。「誰のため」や「何が解決」は、そのベネフィットに辿り着いた後で、補強として読まれます。

Step 3: CTAボタンを配置する

FV内にCTAボタンを置くかは、商材次第です。配置すべきパターンと、配置すべきでないパターンを整理します。

CTAボタンの文言は、「申し込む」「お問い合わせ」のような汎用語ではなく、「無料でLP診断を受ける」「30分の戦略セッションを予約する」のように、「押した先で何が起きるか」を再現する文言にしてください。

Step 4: 視覚要素(画像・配色)を決める

3要素と配置が決まったら、最後に視覚要素を整えます。

• 背景画像:商材を象徴する写真または抽象的なグラフィック。「人の写真」は信頼に効くことが多いが、商材次第
• 配色:背景とテキストのコントラスト、CTAボタンの色のコントラスト
• フォント:見出し用と本文用で2種類。読みやすさ優先

視覚要素は、3要素を伝える「補助」です。視覚要素だけで魅力的に見せようとすると、肝心の訴求が伝わりません。3要素のテキストが先、視覚は後。順番を守ってください。

FV設計でよくある失敗パターン

LP100本の経験から、FV設計でつまずく典型パターンを5つ共有します。

失敗1: いきなり機能訴求から入る

「業界10年の実績」「累計1000社の導入」「専門スタッフ多数」――これらは機能や特徴です。利用者の課題には繋がっていません。

利用者は「自分の課題が解決するか」を知りたいのに、「会社の自慢」が並んでいると、「これは自分向けではない」と判断します。機能や実績は、信頼設計として本文の中盤に配置します。FVは課題訴求とベネフィット訴求で構成してください。

失敗2: 「すべての方へ」「事業者の皆様へ」と対象を絞らない

「広く対象にした方が、より多くの問い合わせが来る」と考える方がいます。実態は逆です。対象を絞らないFVは、誰の心にも刺さりません。

特定の対象に絞ったFVは、その対象に強く刺さり、対象外の人をきれいに離脱させます。これで構いません。対象外の人を捕まえても、商談には繋がらないからです。LPは「全員を集める装置」ではなく「対象顧客を見つける装置」と割り切ってください。

失敗3: メインコピーが長すぎる

メインコピーが3行以上ある、もしくは80文字を超えていると、3秒では読み切れません。3秒で読める長さは、おおむね20〜40文字です。

長くなる原因は、「全部入れたい」気持ちです。3要素を1つの文章にまとめようとして、長くなる。これを避けるには、メインコピーには1要素(どうなる)だけを入れ、残り2要素(誰のため・何が解決)はサブコピーや箇条に分けてください。

失敗4: ベネフィットが抽象的すぎる

「成果が上がる」「効率化する」「最適化する」――これらは、何も言っていないのと同じです。利用者の頭の中に、具体的なイメージを作れません。

ベネフィットは、「何が、どこから、どこまで」の3要素を含めて書いてください。「問い合わせ数が、月3件から月10件に」「LP制作期間が、3ヶ月から3週間に」「広告のCPAが、5万円から2万円に」。数字や具体的な変化を入れると、ベネフィットは「読める」「想像できる」状態になります。

失敗5: 視覚要素で押し切ろうとする

派手な背景、動く画像、目立つアニメーション。視覚的に魅力的にしようとして、肝心の3要素が読めなくなっているFVを、よく見ます。

視覚要素は、3要素を読みやすくする補助です。視覚が3要素を邪魔している状態は、必ず修正してください。判断基準はシンプルで、「3秒で3要素を読み取れるか」です。読み取れないなら、視覚を引き算します。

テマヒマ/平岡の視点

FVの3要素は、LPの中で最も「迷わせない」が試される場所です。

利用者は3秒しか時間をくれません。その3秒で、「自分向けか」「何が解決するか」「どうなるか」を、迷わずに読み取れる状態にする必要があります。1要素でも曖昧だと、利用者は判断を保留して、戻るボタンを押します。

LP100本の経験で、何度も自分に言い聞かせてきたのが、「3要素を、1要素ずつ削って、最後に残ったものが本物」という原則です。最初に書く時は、どうしても要素が多くなります。「これも伝えたい、あれも入れたい」と詰め込みたくなる。ですが、詰め込んだFVは、必ず読まれません。1要素ずつ削って、削れなくなった最後の3つが、その商材の本当に伝えるべき訴求です。

データと仮説の往復という言葉も、FVの改善でこそ効きます。FVのCVRは、ヒートマップで「FVをどこまで読まれて」「サブコピーに視線が止まっているか」が確認できます。仮説を立てて、1要素ずつ修正して、また数字を見る。FVは、LPの中で最も短いサイクルで仮説検証できる場所です。

もう1つ大事なことを伝えておきます。FVは、お客様の「最初の印象」を作る場所です。中身がいくら良くても、FVがズレていると、本文を読まれません。LPの本文を磨くより、まずFVを整えてください。本文改善の費用対効果は、FVが整ってから初めて出始めます。

よくある質問(FAQ)

関連記事

• → LPOとは何か:ランディングページ最適化の基本ガイドと、成果を分ける視点
• → CVRを上げるCTAとフォーム改善のチェックリスト20項目
• → LPで読者を「迷わせない」を実現する具体策:1要素ずつ削る原則
• → ヒートマップの見方:何が見えれば改善案が出るのか

著者情報

平岡 大輔

株式会社テマヒマ 代表取締役 / マーケGYM主宰

事業会社と支援会社の両方で、20年以上マーケティングの現場を経験。著書『売れるランディングページ改善の法則』など、現場で培った判断基準をもとに発信しています。

20年以上の実務経験 LP100本以上の制作・改善 事業会社・支援会社の両側を経験