LPはファーストビューでこれだけ変わる！成果につながる7つの改善ポイント

コンテンツを増やし、デザインも刷新した新しいLP（ランディングページ）が、なぜか古いLPに負けてしまう……。

デザイナーにとっては、これまでの苦労が水の泡になったように感じる悔しい結果ですが、決して珍しいことではありません。

私自身も、内容やデザインをブラッシュアップしたはずの新しいLPが、古いLPに負けてしまったという悔しい経験があります。

原因は、LPの最初の入口である「ファーストビュー」にありました。

ユーザーはページを開いて数秒で「続きを読むか」を判断します。ここで心を掴めなければ、どんなに改善したコンテンツも見られず、ユーザーは離脱してしまいます。

情報を詰め込みすぎたり、デザインを優先した結果、伝えるべき価値が伝わらなかったりすると、フルリニューアルでも成果を落とすことがあるのです。

だからこそ、LP制作を“空振り”にしないためには、まずファーストビューだけの改善から着手することをおすすめします。

実際、成果が伸び悩んでいたLPのファーストビューを改善しただけで、CVR（コンバージョン率）が約2倍になったケースもあります。

この記事では、ファーストビューだけでもインパクトを出すためのコツをご紹介します。

ファーストビューで改善すべき7つの要素

①メインコピーはシンプルに、便益がわかりやすい内容に

メインコピーは、LPで最初にユーザーの目に入る言葉です。

ここで「何のサービスで、どんな強みがあるのか」が一瞬で伝わらなければ、スクロールすらされずに離脱されてしまいます。だからこそ、ファーストビューにおける最重要の要素といえます。

ポイントは シンプルで理解しやすいこと。

以下の3つの条件を満たすかどうかを基準に見直してみましょう。

1. ベネフィット（何が得られる？）

サービスの特徴（機能）ではなく、利用することで得られる未来（便益）を語ります。

「講座数が多い」という特徴よりも、「英語が話せるようになる」という未来を描いたほうが響きやすくなります。

2. 独自性（なぜこのサービス？）

競合にはない、自社だけの強みを一言で表現します。

「支援する」だけでは他社と変わりませんが、「未経験に強い」と打ち出すことで差別化ができます。

3. 分かりやすさ（誰にでも伝わる？）

どんなに優れた内容も、伝わらなければ意味がありません。

業界の専門用語は避け、ターゲットが普段使っている言葉で語りかけましょう。理想は2行以内・15〜20文字程度。長い文章は無意識に敬遠され、読まれる前に離脱されてしまいます。

難しい言葉よりも、ユーザーがパッと理解できる表現のほうが、行動につながりやすいです。

人間の脳は長い文章に出会うと、「読むのに労力がかかりそう」と無意識に判断します。自分で「長い」と感じる前に、処理コストを避けるために情報をスルーしてしまうのです。

そのため、冗長なコピーは「よく分からない」「面倒そう」という印象を与え、読まれる前に離脱につながります。

まずは現在のLPのメインコピーが「サービスの便益をシンプルに伝えられているか」を優先的にチェックしてみてください。

②「自分ごと化」を促す”呼びかけコピー”を盛り込む

ファーストビューでは、サービスの特徴を伝えるだけでは十分ではありません。ユーザーに「これは自分のことだ」と思ってもらう共感のきっかけを作ることが重要です。そのために有効なのが、ユーザーの悩みや「こうなりたい」という気持ちを代弁する呼びかけや共感が大切になります。

ポイントは、ユーザーの心をつかみながら、間口を狭めすぎないことです。

ユーザーの心理に寄り添う

ユーザーが抱える課題や理想の未来を言葉にすることで、心理的な距離を一気に縮めることができます。

こうした一文は、ターゲットの心情に寄り添い、「これは自分向けのサービスだ」と感じてもらえる強力なトリガーになります。配置場所はメインコピーの上や下に置き、メインコピーより小さめのサイズにすると自然に目に入ります。（イメージ画像の②を参照）

対象を狭めない

ペルソナを意識しすぎるあまり、ユーザーを限定してしまう表現を用いると潜在顧客を取りこぼすリスクがあります。
たとえばプログラミングスクールで「初めてのプログラミングなら〜」という呼びかけは、すでにプログラミングを少し学んだことのあるユーザーには響かないかもしれません。

前述で紹介した「ユーザーの心理に寄り添う」点と、対象になるユーザーの広さは、時に相反してしまうこともあります。ポイント１とのバランスを取りながら、適度に広い共感を呼びつつも、ターゲットに刺さる表現を心がけましょう。

③ サブコピーで「強み」を端的に示す

呼びかけで自分ごと化を促すことができたら、サービスの強みを端的に伝えることで、ページをスクロールする動機づけをすることも重要です。

そこでサブコピーとして、ユーザーにとってのサービスのメリットや、安心できる理由を端的に伝えましょう。

例えば、エンジニアスクールのLPでは以下のようなサブコピーが考えられます。

イメージ図では、メインコピーの上部に「呼びかけ」のコピーを、メインコピーの下部にサブコピーを配置していますが、実はこの順序は逆であっても問題ありません。

ただし、どちらかを「呼びかけ」にするのであれば、もう片方をサービスのメリットを端的に伝えるコピーにすることを意識すると情報が整理され、「自分ごと化」と「サービスの強み」が伝わりやすいファーストビューになります。

④ ビジュアルでも「自分ごと化」しやすくする

LPのファーストビューに大きく配置されるメインビジュアルのことを「ヒーロー画像」と呼びます。
ページを開いた瞬間に最初に目に入るイメージであり、ユーザーが「自分に関係あるかどうか」を直感的に判断する材料になるため、ファーストビューの改善だけでインパクトを出すためには、とても重要な要素になります。

ヒーロー画像の選び方

ユーザーの共感を得られるヒーロー画像とはどんなものでしょうか。ポイントは、ユーザーが自分を投影できる場面をイメージさせることです。

画像選びに自信を持てない方は、まずは次の3つのいずれかに当てはまることを意識して、画像を用意しましょう。

①利用シーン

サービスを実際に使っている場面

例：決済アプリなら、支払いをしている姿

利用シーンの画像は「第三者がサービスを使っている姿」を通して、ユーザーが自分ごと化をするアプローチです。

「このサービスは自分も使えるかも」と自然に想像してもらうのが目的になります。

②UI（ユーザーインターフェース）を示す

サービスで実際に触れるUI

例：法人向けSaaSなら、PC画面や管理画面

①利用シーンと似ていますが、違いは「想像の主体」です。
利用シーンの画像は「他人がサービスを使っている姿」を通してユーザーが自分ごと化するアプローチになります。
一方、UIを直接見せる場合は「自分がその画面を操作している状況」を頭の中でシミュレーションさせるアプローチです。

そのためUIを見せる手法は、より主観的にサービスを体験している感覚 を与えやすいのが特徴です。
特に無形商材やBtoBサービスのように「実際の利用イメージが湧きにくいもの」では、UIを見せることで「導入後に自分はこう操作するんだな」を具体的にイメージしやすくなります。

③理想の未来

サービスを利用した結果、手に入れられるポジティブな状態

例：転職サイトなら、転職後に笑顔で働く姿

この手法のメリットは、ユーザーが自分自身を未来に投影できる点です。

理想の姿が具体的に見えることで、サービスの便益を直感的に伝えることができます。

「このサービスを利用すれば、自分もこうなれる」という期待や希望をユーザーに持たせることが、こうした画像の役割です。

サービスや商材の認知度や特徴によって、どのビジュアルを優先するかが変わります。それぞれのビジュアルの特徴を理解して、どれが自社の商材に合いそうか考えて選びましょう。

たとえば、導入前に触れる機会が少ない商材（無形商材やBtoBサービスなど）は、①利用シーンや②UIを優先的に使うと効果的です。すでにサービスが知られている商材では、③理想の未来を見せる画像との相性が良いです。

イラストと写真、はたまた動画？結局どれがいいの？

ヒーロー画像を選ぶ際に悩みのポイントになりがちなのが、写真にするか、イラストにするか、はたまた動画にするかです。

最終的にはA/Bテストで確かめ、決めていくことをおすすめしますが、筆者の経験上このような傾向があります。

いずれを選ぶ場合も、サービスの特性やブランドイメージに合っているかを意識して決めることが大切です。

⑤信頼性・権威性が一目でわかる訴求を入れる

ファーストビューでユーザーに「このサービスは安心できる」と直感的に感じてもらうことも、ユーザーの行動を大きく左右する要素です。 第三者や多数の人から支持されていることを示す「信頼性・権威性」をファーストビューで伝えられると、LPの成果を大きく改善しやすくなります。

心理学的には、これは「社会的証明（Social Proof）」と呼ばれる現象に基づいています。人は「他の人が選んでいるものは正しい」と無意識に判断する傾向があるため、実績や第三者評価を示すことが強力な安心材料となります。

ポイント１：利用者数や満足度をアピールする

「累計◯万人が利用」「満足度◯％」といった具体的な数値は、抽象的な表現よりも説得力を持ちます。利用者数やランキングは、人気や実績を端的に示す有効な手段です。

ポイント２：受賞歴や公的認定をアピールする

「◯◯賞受賞」「公的機関認定」などの実績は、権威性を感じさせる代表的な要素です。これらは文章で説明するよりも、バッジやアイコンで視覚的に強調することで、瞬時に伝わります。

ポイント３：導入事例や掲載企業をアピールする

導入実績は、ファーストビューの下部の範囲に入るように配置すると効果的です。すべてが収まらなくても、一部が見切れているだけで十分に印象を与えられます。

特に有名企業のロゴは、「この会社も使っているなら安心だ」とユーザーに直感的な信頼感を与えます。BtoBサービスでは、信頼獲得に直結する強力な要素です。

また、就活・転職サイトでは掲載企業のロゴを見せることで、「大企業の求人も扱っているんだ」とユーザーに具体的なイメージを持たせることができます。これはサービスの魅力を一目で伝えるポイントになるため、積極的に掲載していきましょう。

注意点

信頼性を示す際は、必ず数字や情報の出典を明記しましょう。
誇張や根拠のない表現は、かえって信頼を失う原因になるだけではなく、罰則の対象にもなります。「○○ランキングNo.1」といった表現を使用する際は、その根拠となる第三者機関の調査を示さなければいけません。

さらに健康食品や化粧品、美容など、薬機法をはじめとした各種法令の規制がかかる場合もあります。掲載前に法的チェックを行うことが望ましいでしょう。

このように信頼性・権威性を用いた訴求は、事実や実績に基づいて行う必要があるため、すべての広告主が取り入れられるというわけではありません。しかし、ユーザーの不安を取り除き、行動に移す強力な後押しとなるので、掲載できる実績や第三者評価がある場合には、積極的に取り入れましょう。

⑥ CTAボタンは「その次の行動」を具体的に示す

CTA（Call To Action）ボタンは、ユーザーに「次にどう行動すればいいか」を示す最も重要な要素です。
ここが分かりにくいと、せっかくLPに興味を持っても行動につながらず、離脱を招いてしまいます。

ポイントは「行動を具体的にイメージできるかどうか」です。

ポイント１：次に起こることを明確にする

「無料登録」などの抽象的な文言では、クリックされにくい傾向があります。なぜならば、そのボタンを押した次に起こることがイメージしにくいからです。

「無料会員登録して求人を探す」「今すぐ診断を受ける」のように、次にできることを具体的に示すと行動に移してもらいやすくなります。

これは心理学でいう「実行意図（implementation intention）」の効果に近く、「このボタンを押せば何が起きるのか」が明確になることで、ユーザーの意思決定の負荷を減らすことができます。

ポイント２：マイクロコピーで背中を押す

ボタンの上に「かんたん登録1分」などの一言を添えるだけでも、心理的なハードルが下がり、クリック率が上がるケースがあります。
「負担が少ない」「安心できる」と感じてもらうひと工夫が有効です。

大前提として、CTAボタンはファーストビューに表示される範囲に配置しましょう。

スクロールしないと表示されない位置に置いてしまうと、「今すぐ登録したい」「すぐ試したい」と思ったユーザーを取りこぼしてしまいます。

CTAボタンが目立たなかったり、ユーザーにとって押しにくい内容になっていることで、LPの成果が伸び悩んでいることもありがちです。位置だけでなく、次のような点も注意しましょう。

マイクロコピーについては以下の記事もご参考に。

LPの成果を後押しするマイクロコピーの作り方【事例付きで紹介】

⑦視線の動きと余白を設計して、行動につなげる

ファーストビューのデザインは、ただ「きれい」に見せるだけではなく、視線の流れ・余白・レイアウトを意識することで成果に大きく影響します。

デザイン・レイアウトも見直してみることで、「見やすい・次の行動が取りやすい」ファーストビューに近づけることができます。

視線誘導については以下の記事もご参考に。

【視線誘導とは？】バナーやLP、資料に活かせる！目線の動きを意識したレイアウトパターン

まずはできるところから改善を始めよう

新しいLPが古いLPに負けてしまうことは、決して珍しいことではありません。
ですが、それは「失敗」ではなく改善のヒントを見つけるチャンスです。

今回紹介したファーストビューの要素を一つずつ見直すことで、成果は大きく変わる可能性があります。
大切なのは、結果に落ち込まず、改善のサイクルを回し続けることです。

LPを開いて、次の要素を書き出してみましょう

まずは、この中から「今すぐ直せそう」と思うものを一つ選んで改善してみましょう。
ほんの小さな改善でも、CVRがぐっと上がることはよくあります。

改善を進めるうちに、自然とLP全体の方向性も整理され、次の改善ポイントが見えてくるはずです。

この記事を参考に、まずはファーストビューから改善を始めてみましょう。