ランディングページ（LP）とは？作り方のコツや参考サイト

ランディングページを準備しておくことで、ウェブサイトの訪問者に会員登録を促したり、商品購入のきっかけを与えたりすることにつながります。ただし、きちんとその役割や作り方を理解し、戦略的に作成しなければ効果は発揮されません。

この記事では、ランディングページの意味や作り方について解説しています。おしゃれなデザイン例や役立つ見本サイト、構成のポイントについても紹介していますので、ランディングページ作成の参考にしてください。

ランディングページとは

ランディングページ（LP）とは、ウェブサイトの訪問者が最初にアクセスするページのことです。マーケティング分野では主に、SNSやWeb広告、バナー広告などを通してユーザーをウェブサイトへ誘導する際に、リンク先となるページのことを指します。

ユーザーが最初に触れるページとなるため、ウェブサイトへアクセスしてきた目的やニーズに応えることが大切な役割となります。そのため、商品・サービスの魅力や会員登録のメリットをわかりやすく紹介したり、商品の購入や会員登録、資料請求の方法を明確にしてコンバージョンにつなげたりする役割があります。広告クリエイティブやプラットフォームごとに、それぞれの目的に特化させた専用のランディングページを作成しておくのも、マーケティング戦略として効果的です。

なお、Google（グーグル）アナリティクスなどのウェブ解析ツールで表示される「ランディングページ」は、訪問者が実際にアクセスした最初のページを指します。マーケティングにおける狭義のランディングページ（ユーザーを誘導したいページ）とは少し異なることに、留意しておきましょう。

ランディングページの構成要素

ランディングページは基本的に、1ページのみで必要な情報を得られるように作成します。また、ユーザーがウェブサイト内のページをいくつも移動しないで済むよう、ランディングページから会員登録や購入などへすぐ進めるように、シンプルな導線とします。

わかりやすく簡潔にするためには、ファーストビュー、ボディ、クロージングという3段階の構成を意識すると良いでしょう。各段階の役割やポイントとともに、ランディングページに必須となるCTA（コール・トゥ・アクション）についても解説します。

• ファーストビュー
• ボディ
• クロージング
• CTA

ファーストビュー

ファーストビューとは、ユーザーがランディグページにアクセスした際に最初に目にする部分のことです。ユーザーはファーストビューを見た時に、たった3秒でページ全体を見るかどうか直感的に判断します。ファーストビューでメリットや特徴が十分に訴求されていない場合、ユーザーはすぐに離脱するため、コンバージョン率も伸び悩みます。そのため、画像やキャッチコピーなどを使っていかに商品・サービスの魅力を伝えるかが重要です。

ファーストビューには以下の構成要素が含まれます。

• メインビジュアル：ランディングページの最初に表示される大きな画像のことです。ユーザーの第一印象を決める「顔」としての役割を果たすため、ブランドや商品のイメージに合ったものを選びましょう。キービジュアルとも呼ばれます。
• キャッチコピー：商品の特徴やユーザーの悩み解決に焦点をあてたもの、実績をアピールするものなど、目的に合わせた簡潔でわかりやすいメッセージを大きく表示します。メインメッセージやヘッドコピーとも呼ばれます。
• サブコピー：必須ではありませんが、メインのキャッチコピーを補足する役割を果たすサブコピーを追加することもあります。
• 権威付け：「販売実績」、「人気No.1」、「ランキング上位」など、ユーザーの信頼獲得のために具体的な数字などを用います。有名人や専門家の許可を得て、名前を使用することもあります。サブコピーに盛り込まれたり、メインビジュアル上に装飾として追加されたりします。

ボディ

ランディングページのボディは、商品・サービスの特徴や魅力、使い方など具体的なメリットを交えながら情報を詳細に伝える部分です。情報だけでなく、画像や図、表、イラストなどを使うと、内容が伝わりやすくなるでしょう。ユーザーが抱える悩みに着目し、解決策を提示する形で商品やサービスを紹介すると共感を得やすく、コンバージョン率アップも目指せます。具体的には、下記のような要素をボディに盛り込んでおきます。

• 商品やサービスの情報
• 商品・サービスにより得られるベネフィット
• 権威性（売上数や専門家の声など）
• 口コミやお客様の声
• 競合他社商品との比較

場合によっては、ボディ内に複数のセクションを設けます。目的やテーマに合わせてセクションを分けることで、ページにリズムができ、飽きることなく最後まで読んでもらえることにもつながります。セクションごとに背景色を変えるなど、セクションが変わったことが明確にわかる工夫も行うと良いでしょう。

クロージング

ランディングページのクロージングとは、ユーザーを購入や問い合わせといったコンバージョンへと誘導する部分です。商品やサービス導入への後押しとなり、具体的な行動を起こしてもらうための流れを提示します。

• よくある質問：購入などに対する不安や疑問を取り除く目的があります。
• 特典や魅力の再提示：特典や魅力を再度アピールすることでコンバージョンを促します。
• 限定性や希少性を訴える：期間限定や数量限定、初回限定などのフレーズを使い、今購入しないと次はもう購入できないかもしれないという心理を引き出します。

場合によっては、競合他社との比較をボディではなくクロージングにいれることもあります。クロージングに説得力がないとコンバージョンにつながらないリスクがあります。A/Bテストを行うなど検証を繰り返すことで、より魅力的なクロージングにすることをこころがけましょう。

CTA

ランディングページでは、ユーザーへ次の行動を促すCTA（コール・トゥ・アクション）を戦略的に配置することが重要です。「今すぐ購入」や「会員登録」、「お見積もり」、「無料体験」など、ランディングページの目的に合わせた具体的な行動を促し、明確でわかりやすく、リンクやボタンであればパソコンやスマホでも押しやすい位置に表示する必要があります。

ユーザーが見落としたりランディングページ内で探したりしないで済むように、CTAはファーストビュー、ボディ、クロージングの各段階ごとに繰り返し配置するのが効果的です。配置場所によってクリック率が変わることもあるため、デザインやレイアウトは慎重に検討する必要があるでしょう。

ランディングページの作り方

1. 目的の明確化と目標設定をする
2. ペルソナ設定をする
3. ランディングページに入れる要素をリストアップする
4. ペルソナが抱える悩みや不安、購買障壁をリストアップする
5. レイアウトを決める
6. キャッチコピーや画像など必要な素材を準備する
7. デザインをする
8. ランディングページを作成する
9. ランディングページを公開し、改善を重ねる

1. 目的の明確化と目標設定をする

最初に、ランディングページを作成する目的を明確化し、達成したい目標を設定します。メルマガ登録や商品の購入を促すのか、サブスクの登録を勧めるのかなど、ユーザーにどんなアクションをとってほしいかが、ランディングページの目的となります。

目的の明確化ができたら、次に目標設定を行います。例えば、期間限定のキャンペーンを行う場合、KGI（重要目標達成指標）は主に会員登録数や商品販売数などのコンバージョン数を設定し、これを達成するために必要となる訪問者数などをKPI（重要業績評価指標）に設定します。ランディングページを長期的に運営していく場合、月間売上金額をKGIに、月間訪問者数や月間コンバージョン率をKPIに設定することもできます。

2. ペルソナ設定をする

効果的なランディングページ作成には、ターゲットとするユーザーを具体的に想定するペルソナ設定が重要です。年齢や性別、居住地、職業、使用SNS、興味関心などのユーザー像を設定し、その人物に向けたアプローチを考えます。具体的な人物像を想定することで、キャッチコピーやデザインの方向性の指針となり、ページの訴求力を高めることができます。

3. ランディングページに入れる要素をリストアップする

目的や目標、ペルソナに合わせて、ランディングページに入れ込むべき要素をリストアップします。この段階では、取りこぼしがないよう思いつくものを全てリストアップしていきましょう。商品やサービスの魅力や特徴といった自社から見たアピールポイントだけでなく、ユーザーから見た場合のメリットや魅力にも着目すると良いでしょう。

4. ペルソナが抱える悩みや不安、購買障壁をリストアップする

次に、ペルソナが抱える悩みや不安、コンバージョンの障壁をリストアップしていきます。これにより、どのような情報を与えることで悩みの解決や不安解消に役立つのかを具体化します。

5. レイアウトを決める

設定したペルソナと目的に合わせて、リストアップした情報のレイアウト（ワイヤーフレーム）を決めていきます。ファーストビューにはユーザーの要望や悩みの解決を期待させる情報、ボディではその具体的な解決策として商品やサービスの詳細、クロージングにCTAやフォームへのリンクを配置する流れが基本となります。

6. キャッチコピーや画像など必要な素材を準備する

ランディングページで実際に使用するキャッチコピーや文章、画像、装飾などの必要な素材を準備します。特にランディングページ上部で使用する画像やキャッチコピーは、ユーザーが閲覧を続けるかページを離れるかを数秒で決定するため、インパクトがあり、わかりやすいものを採用する必要があります。

7. デザインをする

ワイヤーフレームをもとに、より詳細なデザインを作成していきます。「デザインカンプ」や「モックアップ」と呼ばれるこのデザインは、実際のランディングページの完成見本となります。デザインができるツールには、以下のようなものがあります。

• Figma（フィグマ）
• Adobe Photoshop（アドビフォトショップ）
• Adobe Illustrator（アドビイラストレーター）
• Canva（キャンバ）

8. ランディングページを作成する

デザインに沿ってランディングページを作成します。Shopify（ショッピファイ）で作る場合には、以下の3つの方法があります。

• Shopifyの使用中テーマから作る：ストアの管理画面からページを追加し、現在使用しているテーマと同じデザインのランディングページが作れます。
• Shopifyアプリで作る：ランディングページ作成用のアプリを使ってランディングページを作れます。
• ソースコードをカスタマイズする：コーディングの知識がある場合には、HTMLやCSSを使ってカスタマイズをすることが可能です。自由度が高く、独自のデザインを採用できる反面、コーディングに時間と技術力が必要となります。

9. ランディングページを公開し、改善を重ねる

ランディングページを公開したら、解析ツールで効果を測定し改善を重ねていきます。以下のようなアクセス解析ツールを使ってデータを確認・分析しましょう。

• Googleアナリティクス
• ヒートマップ

分析をもとに改善を行うことをランディングページ最適化（LPO）と呼び、これらを繰り返すことでより良いページ実現につながります。

ランディングページの構成で役立つフレームワーク

AIDMA（アイドマ）の法則

AIDMAの法則は、消費者が購入に至るまでの心理変化に合わせて、段階的に情報を提供することでコンバージョン率アップを目指すフレームワークです。

• Attention（注意喚起）：ファーストビューでインパクトのあるコピーや画像を使用します。
• Interest（興味関心）：ボディで商品・サービスの特徴やメリットを簡潔に表すことでユーザーの興味関心を引き出します。
• Desire（欲望）：ボディで商品・サービスから得られるベネフィットやお客様の声、ビフォーアフターなどを掲載し「欲しい」という欲望をかきたてます。
• Memory（記憶）：ボディやクロージングでユーザーの記録に残りやすいよう、競合他社の商品との比較やよくある質問を掲載します。
• Action（行動）：各所にあるCTAボタンやクロージングで行動を促します。

新PASONA（パソナ）の法則

新PASONAの法則とは、ユーザーの潜在ニーズを明確化し、行動へとつなげていく文章やセールストークを構成するためのフレームワークです。

• Problem（問題提起）：ユーザーが抱える問題や悩みを具体的に言語化します。
• Affinity（親近感）：問題や悩みに対して寄り添う態度を示し、親近感を与えます。
• Solution（解決策）：問題や悩みに対する解決策を提案します。
• Offer（提案）：商品・サービスを通して具体的に実現可能な解決策を提案します。この際、実際に問題や悩みを解決した人の体験談や口コミを活用すると説得力が増します。
• Narrowing down（絞り込み）：購入者特典や期間限定、特別価格など購入に踏み切りたくなる提案をします。
• Action（行動を促進）：よくある質問を活用して購入の際の不安や疑問を解決したり、限定性や希少性を再度提示することでコンバージョンを促します。

BEAF（ビーフ）の法則

BEAFの法則とは、消費者の購買意欲を高める流れを法則化した、コピーライティングのフレームワークです。ネットショップの商品ページで活用されています。

• Benefit（利益）：商品がもたらす利益やメリットを伝えます。
• Evidence（論拠）：データや専門家の意見、実績などを掲載します。
• Avantage（競合優位性）：競合他社商品との比較し、自社商品の優れている点をアピールします。
• Feature（特徴）：商品のより細かな特徴や機能を説明します。

短いステップでユーザーが必要とする情報を順序立てて伝えることで、コンバージョンに繋げることができるようになります。

ランディングページのデザイン例

RISU（リス）算数

算数に特化したタブレット教材のRISU算数は、ファーストビューに親子の画像を使用しており、子ども本人だけでなく学習を支える親の気持ちに寄り添っていることがみて取れます。サブコピーや使用する装飾で、学年よりも先の学習ができている子どもの割合として75%という具体的な数字を使い説得力を持たせ、さらに「先取り教材No.1」や「全国模試1位続々」など権威付けとなる要素も目立つ位置に配置しています。

LPのメインの目的となる「サービスお申し込み」のCTAは他のボタンよりも大きく、色と矢印で目立つ工夫がされている点もポイントの一つです。

SuiSui（スイスイ）

後付けできる自動水栓SuiSuiのファーストビューは、水のイメージにある青を背景にしたり、メリットとなる「低コスト」「短工期」を大きく表示するなど、閲覧者に内容が伝わりやすい工夫がされています。

最初に、訪問者として想定しているターゲットオーディエンスの施設運営者が抱える悩みをリストアップし、それに対する解決策として商品の魅力と特徴をアピールしています。取り付け手順といった文字だけでは説明が難しい項目は、ボディに写真と動画といった視覚的要素を取り入れて解説しています。

さらに、ランディングページ後半では、一般的な自動水栓取り付けにかかる工数や費用との比較、国が認定する「はばたく中小企業・小規模事業者300社」や「地域未来牽引企業」に選ばれている点も伝え、信頼獲得に努めています。画面下部には、常に表示されるフローティングバー型のCTAを採用しており、コンバージョンの機会損失防止に役立てています。

Propo（プロポ）プロテイン

ターゲット層となる30〜40代の女性の写真をファーストビューに採用したPropoプロテインは、商品パッケージと同じ色を使ったランディングページで親しみやすさを表現しています。最初に悩みを提示するだけでなく、考えられる原因と、解決策となりうる自社商品の紹介というスムーズな流れを作り出しています。よくある質問やクロージングでは、定期コースに対する「回数の縛り」がないことを明記することで、購買障壁を取り払う工夫がされています。

まとめ

ランディングページ（LP）は、商品の購入や会員登録などの特定の行動を訪問者へ促すための専用ページのことです。ホームページとは異なり、情報は1ページに集約され、要所にはCTAが配置され、特定の目的達成に特化した構成が特徴となります。

ランディングページを作るには、まず目的の明確化と目標設定を行い、それに併せて理想的な顧客像となるペルソナを設定します。ペルソナの気持ちに寄り添いながらワイヤーフレームを作成し、キャッチコピーや画像、文章などを反映させていきます。ワイヤーフレームをもとに、より詳細なデザインを作成し、実際にランディングページを制作・公開しましょう。公開後は最適化を行うことで、より効果の高いページへと改善することができます。

効果的なランディングページを作成するには、AIDMAの法則や新PASONAの法則、BEAFの法則といったフレームワークを活用することができます。ランディングページを作る際には、LPデザイン例の記事もぜひ参考にしてください。

文：Masumi Murakami