成果に繋がるランディングページの基本構成とは？7つの要素と作り方を解説します

ランディングページ（LP）は、検索やSNS、広告などから訪れた見込み客に商品購入やメルマガ登録、資料請求などといった行動を起こして貰う目的で作るものです。

そしてこのLPには、成果に繋がるものと繋がらないものが存在します。

その違いは「構成」です。

LPは適当に作って成果を出すことは出来ません。

成果に繋がるLPは、訪問者であるユーザー目線で興味＆関心を得られる様に構成されている為、目的のコンバージョンに繋がります。

逆に成果に繋がらないLPは、上記の様なユーザー目線とは程遠い構成になっている為にページの途中で離脱されるので、コンバージョンには至らないのです。

よってコンバージョンするLPを作る為には、LPを構成する7つの要素を知りユーザー目線で「ストーリー」を設定し構築することが必須です。

当記事では、コンバージョンに繋がるLPの構成や作り方のポイントを徹底解説します。

あなたが今からランディングページを作ろうとしていたり、既に作っているがより高い成果を出したい場合はぜひ参考にして下さい。

ランディングページの基本構成とは？

前述の通り、ランディングページ（LP）は検索やSNS、広告などから訪れた見込み客に商品購入やメルマガ登録、資料請求などといったコンバージョンを起こして貰う目的で作るものです。

ランディングページは主に、「ファーストビュー」、「ボディーコピー」、「クロージング」という3つで構成されています。

具体的には、以下の通り。

ファーストビュー
・キャッチコピー＆アイキャッチ画像
・CTA（購入はこちらから等）フォームボタン

ボディーコピー
・ベネフィットの掲示
・商品やサービスの内容説明
・販売実績・お客様の声など

クロージング
・よくある質問の回答、購入などの流れ解説
・必要情報の入力フォーム、ボタン

これら7つが、LPに必要な基本構成です。

コンバージョンに繋がるLPでは、この7つの要素が必ず入っているのでぜひあなたも導入して下さいね。

ファーストビュー・一目でユーザーが求めていること＆LPの内容や目的を伝える部分

ファーストビューというのは、その名の通り「LPを見たユーザーが初めに見る部分」です。

あなたも経験があるでしょうが、このファーストビューで「そのLPが自分が求めているものか否か？」を瞬時に判別し、ページを読み進めるか離脱するかを決めますよね？

よって、このファーストビューというのは「LPにおいて最も重要な部分」といって良いでしょう。

ファーストビューの要素は、先程紹介した以下の2つです。

ボディーコピー・LPの内容がなぜユーザーに必要なのかを伝える部分

LPのボディーコピーでは、「そのLPの内容がなぜユーザーに必要なのか？」を伝えます。

ここでは内容説明や、ベネフィット（購入してどうなれるのか？等）、ユーザーからの信頼を獲得する要素を加えることが必須です。

当たり前ですが、ファーストビューで掲示したキャッチコピーとズレのないものを伝えましょう。

ボディーコピーの要素は、以下の3つです。

クロージング・ユーザーの疑問や不安を解消しコンバージョンに繋げる部分

クロージングは、ユーザーの疑問や不安を解消しコンバージョンに繋げる要素です。

ただベネフィットや信頼を構築する要素だけではコンバージョンには至らないので、質問の回答や返金などの保証の有無、商品の限定性や希少性を掲示し、「今買うしかない！」と思って貰える様な工夫が必須です。

つまり、「お客が買わない理由を1つ1つ潰して行く」ということですね。

クロージングの要素は、以下の2つです。

ランディングページ（LP）の構成に必要な8つの要素

ここまで、成果の出るランディングページの構成である「ファーストビュー」、「ボディーコピー」、「クロージング」という3つの要素を解説しました。

この項では、各要素を更に7分割して解説します。

①キャッチコピー＆アイキャッチ画像

前述の通り、ファーストビューである「キャッチコピー＆アイキャッチ画像」はLPで最も重要な要素です。

ユーザーがLPを訪れた際、このファーストビューでページを見るか離脱するかを「約3秒」で決めると言われていますからね。

その為、ここではユーザーに「このページは自分が求めているものだ！」、「続きが気になる！」などと感じさせる様な構成にしなければいけません。

では、この「キャッチコピー」と「アイキャッチ画像」のポイントを1つずつ解説します。

キャッチコピー

キャッチコピーは、商品名であったり「ベネフィット」（そのLPの内容を見てどうなれるのか？）などを一目で分かり易くする為の要素です。

キャッチーな商品名で関心を引いたり、あなたの実績や顧客の成果などがあるなら「数字」を用いて掲示すると効果的です。

キャッチーな商品名なら、「すっきりフルーツ青汁」が代表的ですね。

苦くてまずいイメージのある青汁が、おいしそうに感じますから。

ライザップで言えば、「結果にコミットする」というのも、顧客に確実な成果を出させるサービスというベネフィットを伝えられます。

アイキャッチ画像

アイキャッチ画像は、「そのキャッチコピーをイメージさせる画像」のことです。

先程のすっきりフルーツ青汁であれば、以下の様な「フルーツ感をイメージさせる美味しそうなアイキャッチ画像」が印象的です。

青汁を求めている人からすれば、高確率で魅力的に感じる筈です。

そしてライザップの場合、あの誰もが知る以下の様な「特徴的なビフォーアフター」がアイキャッチ画像になっていますよね。

因みにデータやオンライン講座などの無形商品の場合、商品自体が無形なのでアイキャッチ画像は「ゼロから自分で作る必要」があります。

とは言え別に難しいものではなく、「Canva」などの無料の画像作成ツールを使うことで簡単にフリー素材とテキストを組み合わせることで作れる為、以下の僕のサービスの様に無形商品でも商品を可視化させることが可能です。

このアイキャッチ画像は、その業界であなたのみのオリジナル画像を作成することで、LPにおいてより高い成果を生み出すことが出来ます。

ぜひ、魅力的なアイキャッチ画像を作成して下さいね。

②CTA（購入はこちらから等）フォームボタン

CTAは、「Call To Action（行動喚起）」の略です。

ようは、「商品購入はこちらから→フォームボタン」、「メルマガ登録はこちらから→フォームボタン」という様に、目的への行動を促す要素です。

扱う商品ジャンルにもよりますが、LPの最後だけではなくファーストビュー内（キャチコピー＆アイキャッチ画像の下）にもCTA＋フォームボタンを置くことで、成果が出やすくなる場合も多いです。

因みに、CTA＋フォームボタンにも高い成果を出すポイントがあります。

それが以下の4つ。

ボタンの色・サイズにメリハリを付けて目立たせる

ボタンの色・サイズにメリハリを付けて目立たせることでクリック率が高まります。

とは言え、無暗に目立たせるのではなく「LPのデザイン」などに合わせて行うことが必須です。

一般的に商品購入系のボタンは「赤」、メルマガ登録系は「緑」がクリック率が高いですが、LPのデザイン的にそれらが目立ちにくい場合は別の色に変える必要があります。

サイズに関しては、「メインテキストの3倍位」にすれば目立ちクリックされ易いですが、こちらもLPの文字サイズによって変わるので一概には言えません。

これらは、「A/Bテスト」を繰り返して最も反応が良いものを探し当てる作業が必須です。

場合によっては、グラフィック系の動くボタンの方が効果的な場合もありますしシンプルなものの方が効果的な場合もありますから、A/Bテストで判断しましょう。

因みに、強制的に一定の場所に固定しスクロールしても強制的に画面上に表示させる系のボタンは不快感を抱かれ易いので、僕はおすすめしません。

ボタンのコピー内に目的の請求を入れる

ボタンのコピー内に「目的の請求」を入れることも、高いクリック率やコンバージョンを実現する要素です。

具体的には、以下の様な請求が効果的です。

上記の様にシンプルな請求の方が効果的な場合もあれば、「今すぐメルマガ登録する」、「30日間無料体験する」などより具体的に掲示する方が効果的な場合もあります。

ボタン上部や下部にクリックを後押しするコピーを入れる

ボタン上部や下部に「クリックを後押しするコピー」を入れることで、クリック率が高まる場合もあります。

商品購入系なら、「〇日間限定販売であること」、「返金保証があること」など。

メルマガ登録系なら、「メルマガはいつでも簡単に解除できること」、「登録情報は外部に漏れないこと」などが効果的です。

CTAのバリエーションを増やす

「CTAのバリエーション」を増やすことも、高いコンバージョンを得られる要素です。

長いLPを作る際は、一定の感覚で複数のCTA＋フォームボタンを置く場合がありますが、その際に全てが同じコピーで表示させていてはもったいないです。

1つ1つ別々のコピーで「CTA＋フォームボタン」を置くことで、1つ目で反応しなかったユーザーが2つ目や3つ目で反応してくれるかもしれませんから。

当然ですが、このコピーは全て大元のキャッチコピーとズレの無いものにしなければ意味は無いので、注意が必要です。

③ベネフィットの掲示

ベネフィットは「その商品を購入したらどうなれるのか？」などをユーザーにイメージさせる様に伝える要素です。

このベネフィットが無いLPからは、まずコンバージョンに繋がることはありません。

ベネフィットでは、「その商品を購入したらどうなれるのか？」と「逆に買わないとどういう結末になるのか？」を掲示すると効果的です。

その商品を購入したらどうなれるのか？

これはそのLPの目的達成（商品購入など）によって、「ユーザーが叶えたい理想の未来」を伝える要素です。

「現在○○に悩んでいませんか？でもこの商品を購入すると○○になれます」など、ユーザーが抱える悩みに寄り添って共感し、叶えたい理想の未来をイメージさせることで高い効果を得られます。

共感を得るポイントは、「過去に自分も悩んでいたが、それを解消した」など、自分の悩みからの成功体験を合わせて伝えることです。

このストーリー性は最も高い共感＆信頼を構築できる要素なので、ぜひ導入して下さい。

扱う商品などのターゲット設定が「悩みを抱えた過去の自分」なのであれば、そこを意識して伝えることでユーザー目線の構成になりその後のLPを読み進めて貰い易くなります。

逆に買わないとどういう結末になるのか？

次は逆に、「その商品を買わないとどういう結末になるのか？」を伝える要素です。

叶えたい理想の未来を伝えると共に、購入しなかった場合の「叶わなかった未来」を伝えイメージさせることで、ユーザーの購買意欲が上がります。

「無料での実践に拘っているから、今の成功出来ないあなたがいるのではないですか？」などと伝えるのが良いでしょう。

④商品やサービスの内容説明

次は、商品やサービスの内容説明です。

ただし、ダラダラと商品説明を行うのではなく「ベネフィット」、「根拠」を交えて掲示しましょう。

ただ商品説明をするだけでは魅力を感じ辛いですし、ベネフィットを伝えるだけでは納得されないので根拠が必要ですから。

ざっくりと言えば、以下の様な書き方です。

これらを、各商品の内容説明ごとに行って下さい。

例えば僕はギターを弾くのですが、仮に「ロックギターのオンライン講座」を販売する際は、以下の様な商品内容になります。

これを1つずつ、各テクニック毎に「内容説明」、「得られるベネフィット」、「その根拠」を掲示していくのです。

つまり、「その速弾き編で何が学べるのか？その速弾き編でノウハウを学ぶとどうなれるのか？その根拠は何なのか？」を伝えるということです。

LPがコンバージョンに繋がらない人は大抵、商品説明（その速弾き編で何が学べるのか？）しかしていません。

それでは魅力を感じないので、「ベネフィット」（その速弾き編でノウハウを学ぶとどうなれるのか？）の掲示が必要です。

しかしただベネフィットを伝えるだけでは納得はされないので、「その根拠」も合わせて毎回伝える必要があるのです。

人は納得しないものにお金は払わないので、この「説明→ベネフィット→根拠」を1セットで掲示する癖を付けて下さい。

⑤販売実績・お客様の声など

ランディングページでは、自分の実績や商品の販売実績やお客様の声など「数値化したデータ」と「第三者の声」を掲示することで高い成果を上げられます。

これらは最も「信用」を得られる要素なので、ランディングページを構築する際には掲示できる様にしておいた方が良いです。

これらを掲示することで、「バンドワゴン効果」（売れてるなら確かな商品なのだろう、自分も買おうかな）などという心理状態を生めるので、コンバージョンの可能性が高まります。

掲示する際は具体的には、以下の要素が必要です。

実績は「画像」（または動画）と「数値」を用いて掲示する

ここで言う実績は、扱う商品に関する「あなたの実績」、「商品自体の販売実績」です。

これらを「画像」（または動画）や「数値」を用いて掲示して下さい。

ただテキストで掲示するだけだと、言うだけなら誰でも出来ますから証拠にはならないので、「画像」（または動画）かつ「数値」で証明できる様に掲示しましょう。

ギターのオンライン講座なら、自分の実力を証明する演奏動画（ビフォーアフターがあればより良い）、その講座が売れている証拠（参加者の支払い画像など）になります。

お客様の声は出来るだけターゲット層に近いものを

ランディングページを作る際はターゲットを設定するものの、実際にはターゲット以外の方にも購入されるものです。

しかしお客様の声として掲載するものは、出来るだけ「キャッチコピーなどのターゲットに近い方の声」を掲示して下さい。

まあ当たり前ですよね。

ターゲット層に近い方の声を掲示することで、集まるターゲットに響き易くなるのでコンバージョンの可能性が高まりますから。

⑥よくある質問の回答、購入などの流れ解説

「よくある質問の回答」、「購入などの流れ」を解説することで、見込み客に手間を掛けさせずスムーズにコンバージョンに繋がり易くなります。

このよくある質問の回答は、扱う商品などに関する想定できる見込み客の疑問を先回りして回答しましょう。

また解約や返金、返品の保証を付ける際は、「面倒な条件や手間が掛かるのではないか？」という不安も抱きやすいので、それを回答するのも効果的です。

売り切りではないコンサルティングなどの商品形態場合、「決済後のコンサルの流れ」なども掲示しておくのも良いですね。

他にも、あえて「絶対の成果の保証はしない旨」も質問の回答として記載することで、クレーマー気質の方が購入するリスクを減らせるのでおすすめです。（この世に絶対の効果を示すものは無いですから記載することに何ら問題はありません）

⑦必要情報の入力フォーム、ボタン

必要情報の入力フォーム、ボタンにも工夫が必要です。

人間は面倒なことであったり、1つでも分からないことがあると高確率で購買意欲が失せます。

LPはアンケート回答が目的ではなく、より多くのコンバージョンを達成することなので、上記の様な要素は1つでも省くことが必須です。

つまり、「誰が見ても分かり易くシンプルなものにすること」を意識して、必要情報の入力フォーム、ボタンを設置しましょう。

具体的には、以下の様にした方が良いです。

入力項目を最小限にする

最も重要なのは、「入力項目を最小限にすること」です。

例えばメルマガ登録の場合は、「メールアドレスのみ」で十分。

氏名や住所などは、商品購入時に入力して貰えば良いのです。

余計な項目を増やすことで途中で面倒くさくなり、LPから離脱される可能性が高まりますからね。

商品購入LPでも入力項目を1か所にまとめる等、出来る対策はあります。

ビジネスにおいて、「お客はわがまま」かつ「出来るだけお客に手間を掛けさせない」というのは鉄則ですから。

1～2クリックで決済画面に辿り着ける様にする

1～2クリックで決済画面に辿り着ける様にすることも必須です。

何度もクリックしないと決済画面に辿り着かないLPは、まずコンバージョンを取れません。

コンバージョンが取れているLPというのは、ほぼ必ずこの1～2クリックに決済画面に辿り着ける様になっています。

記入例を表示させる

「記入例」が表示されていないと、せっかく時間と手間を掛けて入力したのにエラーになり、ユーザーはイラついて離脱します。

よくあるのが、英語の大文字なのか小文字なのか、生年月日は西暦なのか年号なのか等ですね。

入力フォーム内に記入例を表示させておくことで、この様なトラブルが無くなるので必ず行いましょう。

チャットボットを活用する

最近は、lineなどの自動会話メッセージでユーザーの入力に対応する「チャットボット」を活用するLPが多いです。

予め先回りして各項目ごとに目的へ到達して貰うメッセージを設定しておくことで、ユーザーが考える必要が無く離脱を防ぐことが出来るのでおすすめです。

作成に手間は掛かりますが、一度設定すれば放置で稼働する様になるので導入するのも1つの手です。

よってここまでで、ランディングページの「ファーストビュー」、「ボディーコピー」、「クロージング」内の7つの要素を解説しました。

ランディングページ構成の作り方（ワイヤーフレーム）

次は、ランディングページの「ワイヤーフレーム」を作って行きましょう。

ワイヤーフレームとは、ランディングページの設計図のことを言います。

この設計図を先に作っておくことで、あとはその通りに必要な情報を書いて行けば良いだけなのでおすすめです。

ワイヤーフレームは、僕の場合はWordpressの固定ページでランディングページを作るので「下書き保存」で作成しています。

その後、ワイヤーフレームに情報を足して行き完成させるという流れです。

①.ページのレイアウトを決める

まずはレイアウトを決めます。

ランディングページは「1カラム」（メニューなどが表示されない1枚もののページ）で作成するので、こちらで設定します。

2カラムや3カラムは、基本的にランディングページでは使用されない為、1カラムでOKです。

使用するツールやテンプレートによっては「ランディングページ」という専用の設定がある場合もあるので、ご自身の環境に合ったものを使用して下さい。

②レイアウトに要素を当てはめる

次はレイアウトに要素を当てはめるので、先に決めた「ファーストビュー」、「ボディーコピー」、「クロージング」を設定します。

「ファーストビュー」

ファーストビューには、扱う商品などに関連したキャッチコピー、アイキャッチ画像、CTAを配置します。

「ボディーコピー」

ボディーコピーには、そのLPや商品などのベネフィット、商品説明、自分や商品の販売実績、お客様の声などを配置します。

これらの順番ですが、扱うジャンルによってコンバージョン率が変わる場合があるので、A/Bテストでデータを取り配置を入れ替えて試してみることをおすすめします。

「クロージング」

クロージングには、扱う商品などの「限定性」、「特典」、「返金や返品などの保証の有無」、「よくある質問や導入の流れ」、「CTAボタン」を配置します。

これがランディングページの設計図である、ワイヤーフレームの作り方です。

LPでコンバージョンを獲得する為には、ここまで解説した様に正しい構成で作ることも勿論ですが、その根底には「ユーザー目線」で構築することを心がけて下さい。

あなたのLPのターゲット設定が「悩みを抱えた過去の自分」である場合は、それがユーザー目線となります。

このユーザー目線を意識して正しい構成で構築すれば、あなたのLPは目的のコンバージョンを獲得できるでしょう。

構成における3つのポイント

ここで、おすすめのランディングページの構成における3つのポイントをご紹介します。

必ずユーザー目線で全体を構成する

ランディングページは、冒頭から最後まで全て「ユーザー目線」で構成して下さい。

慣れている上級者ならともかく、初めてランディングページを作る人や一度もコンバージョンを経験していない人が主観で作ると99＆成果は出せません。

デザインもそうですが、「内容説明→ベネフィットの掲示→その根拠の掲示」という要素を毎回1セットで行うことで、ユーザーが納得しページを読み進めてコンバージョンに至ってくれやすくなります。

見出しだけで要点が即理解出来る様にする

ランディングページを作る際は、見出しだけで要点が即理解出来る様にして下さい。

頑張って長いランディングページを作っても、ユーザーの大半はその全てをまともに読まずスクロールしたり、時には飛ばし飛ばしで読むものです。

その様な場合でも、見出しで「この項では何を伝えているのか？」が分かる様にしておけば、何かがユーザーの心に刺さるかもしれないので必須な要素です。

結果、再度初めからしっかり読んでくれてコンバージョンに至ってくれるかもしれませんからね。

様々なパターンのLP構成を作りテストする

ランディングページは作成して終わりではないので、「様々なパターンのLP構成」を作りテストしましょう。

キャッチコピーやアイキャッチ画像を変えたり、構成を変えたりデザインを変えたりと変更できる要素は幾らでもあるので、A/Bテストは必須です。

ただし、いつでも元に戻せる様に元のランディングページを保存しておくことを忘れないで下さいね。

LPの構成は訪問者目線で設計する効果大

ここまでランディングページの基本の構成における、「7つの要素」と「作り方の3つのポイント」を解説しました。

コンバージョンを獲得するLPを作る為には、正しい構成で作ることは当然として、あなたが設定するターゲットに沿った内容かつユーザー目線で作ることが必須です。

これらをすべて満たせば、ユーザーはストレスなくLPを読み進めてコンバージョンに至ってくれます。

ぜひ当記事を参考にコンバージョンしやすいLPを作って下さいね！