ランディングページ(LP)とは？設計方法や成果を出すコツを解説

近年、EC市場の拡大やスマートフォン利用者の増加に伴い、インターネット広告市場は拡大し続けています。2023年のインターネット広告費用は、1兆7,589億円までに成長しており、地上波テレビ広告費の1兆7,848億円に迫ってきています。

インターネット広告市場が拡大しているということは、広告の受け皿となるランディングページのニーズも当然ながら高まっているといえます。

広告費をつぎ込み集客ができたとしても、集客先であるランディングページが魅力的でなければ、コンバージョンには繋がらず売上にはインパクトしません。

インターネット広告を効果的に運用していく上で、ランディングページはとても重要です。インターネット広告と合わせてランディングページは最適化していくことで、より効果を高めることができます。このランディングページ最適化のことを、LPOといいます。

本記事では、効果を高めるためのLP制作について説明します。

※編集部注：この記事は、2020年1月に公開された記事を加筆・修正したものです。

ランディングページとは

ランディングページ（LP）とは、検索結果やWeb広告などを経由してサイト訪問者が最初にアクセスするページを指します。

下層ページを持つWebサイトの場合、ユーザーが最初にアクセスしたページがトップページであればトップページがランディングページとされ、企業情報ページに最初にアクセスしたのであれば、企業情報ページがランディングページとされます。

しかし、上記は広義の意味でのランディングページで、一般的に使われている「ランディングページ」は、インターネット上で配信されている広告を経由して訪れたユーザーの着地先である縦長レイアウトの一ページ完結型サイトのことを指します。

一般的なWebサイトはトップページから複数の下層ページに分岐しており、情報の抜け漏れがないように網羅的に構成されています。一方ランディングページの場合は、通常サイトのような下層ページは存在しません。ページの目的に合わせて必要な情報だけを厳選し、一ページで問い合わせ・資料請求・購入を促すことができるように構成されています。

以下の図が、サイトとランディングページの違いを表した図です。ぜひ参考にしてみてください。

ホームページとの違い

ランディングページはWebサイトの最初のページであり、ユーザーが最初に訪れるページです。ホームページは、Webサイトの全体的な概要を示すページです。

ランディングページはWebサイトの最初のページとして、ユーザーを惹きつけるようなコンテンツを提供することが重要です。サービス内容や特徴、数値などを明確に伝えた上で商品を販売することが目的です。

一方ホームページには、会社の特徴を記載します。サービス内容や特徴、数値などを紹介するだけでなく、ユーザーがサービスを使用して何ができるのかをより詳しく伝えることが重要です。

ランディングページの目的

一般的なWebサイトには、様々な目的を持ったサイトが存在します。例えば、企業の顔として自己紹介の役割を持つ「コーポレートサイト」や、企業や商品の世界観を伝えるための「ブランディングサイト」、人を採用することを目的とした「採用サイト」などがあります。

そのようなサイトと比べると、ランディングページの目的としては広告を経由してページに訪れたユーザーに「お問い合わせ」や「資料請求」などのコンバージョンを得ることが挙げられ、非常にシンプルです。

ランディングページの特徴

階層式のコンテンツと遷移（リンク）で成り立っている一般的なホームページの構成とは違い、LPは1ページ完結型の構成になっていると解説しました。

LPはCVに必要な情報のみを厳選して掲載し、ページ遷移によるユーザーの離脱を防ぐ仕組みで、購入を後押しするために情報がどう配置されるかが重視されます。

LPの特徴として、以下が挙げられます。

リンクが一か所のみである

一般的なホームページの場合、リンク先を複数設定し導線を作ることでユーザー滞在時間を伸ばすことができます。一方で、ランディングページ内のリンクは入力フォームの一か所しかありません。

縦長で縦にスクロールする形式である

問い合わせや購入などを促すため多くの情報を提供する必要があるため、コンテンツのボリュームが増えます。またページを分割するとユーザーが離脱してしまう可能性があるため、ランディングページは縦長で縦にスクロールする形式で構成されています。

画像を多用する

ランディングページはページを読みやすくするため、画像を多用するのが一般的です。一方で流し読みされやすいとデメリットがあるので、画像中心で構成するとしてもユーザーにじっくり読ませたい部分はテキストで補足するとより良いです。

購入を後押しするような形で情報が配置・デザインされている

キャッチコピーや権威性を示すメディア実績などが目立つようにデザインされ、ユーザーの興味関心をかりたてる形に設定されています。

ボタンサイズが大きく、ページの複数箇所に設置されている

ランディングページは、コンバージョンとなるお問い合わせや購入を獲得するために特化したページです。そのため、ユーザーにコンバージョンポイントとなる問い合わせや購入ボタンは視覚的に目立つよう、大きな形で赤や緑などの認知しやすいカラーを使われていることが多いです。また、ユーザーがコンバージョンしやすいようにページの複数箇所にボタンが配置されています。

良いランディングページとは

ランディングページを制作をする際は、コンバージョンをより多く獲得するためにはどうすればよいかが重要です。いくら格好良いデザインであっても、いくら情報整理ができているページであっても、コンバージョンがとれなければ良いランディングページとはいえません。

ランディングページには広告を目にして、広告の内容に興味を持ったユーザーが流入します。つまりユーザーは表示された広告に惹かれて、商品やサービスについて詳細を知りたいと思っています。

その知りたいという要求に応えた内容をランディングページ上に準備できているかどうかが、良いランディングページかどうかを判断する基準の一つとして挙げられます。

ランディングページ制作の流れ

ランディングページを制作する時に行き当たりばったりで進めてしまうと、作業の効率が悪くなるだけでなく、効果の出ないランディングページが出来上がってしまいます。

LPO※を行うことで効果を出していくことは可能ですが、折角ランディングページを制作するのであれば、設計段階から効果を出せるように考えることが大切です。そのためには、全体の流れを把握しておく必要があります。

※LPO（Landing page optimization＝ランディングページ最適化）…ランディングページの効果を高めるため、ページのデザイン・レイアウト・テキストを調整すること

先ほど述べたように、ランディングページの目的はページに訪れたユーザーにコンバージョンをしてもらうことです。その目的を達成することを念頭に置きながら、全ての工程を進めていく必要があります。

以下が一般的なランディング制作の流れです。各ステップについて詳しく説明します。

1.戦略設計（要件定義）

戦略設計ではプロモーションする商品やサービスにとって、どのようなランディングページが必要なのかについて考えます。以下のポイントを中心に考えるのがおすすめです。

また、競合となりうる商品やサービスのランディングページがどのような訴求をしているのか、どのようなコンバージョンポイントを用意しているのかを調査する必要があります。競合を調査することは自社のランディングページを制作するための参考にするだけでなく、競合と自社を差別化をするためにも必要です。

競合他者が、どのようなユーザーに対して、どのような施策を行なっているのかをあらかじめ頭に入れておきましょう。

ユーザー目線で競合と自社を比較することで、今まで気がつかなかった自社の商品やサービスの魅力を発見することにもつながります。

2.情報設計（ワイヤーフレーム作成）

情報設計では、ランディングページを作る上で必要な情報を整理します。戦略設計で想定したユーザーやコンバージョンポイントに合わせて全体のストーリーを設計し、そのストーリーに必要なコンテンツの情報を具体化し、最終的にその内容をワイヤーフレームに落とします。

ストーリーを設計する際は以下のユーザーに伝えるべきポイントを洗い出し、それらをどういった順番で提示するかを決めます。

この際重要なのは、ユーザー目線で考えることです。どのような順番で情報を提示すればユーザーが欲しい情報にリーチでき、コンバージョンにいたるのかを考えます。

提示する順番が決まったあとは、コンテンツごとに見出しや本文などのテキスト内容を決めます。

テキストを考えた後、それを基にレイアウトを検討しましょう。この際に検討するレイアウトとは、情報の強弱をつけたりグループ化をしたりして情報を整理することを指します。

次にワイヤーフレームを作成します。ワイヤーフレームはデザインの設計図で、この際テキスト以外のグラフやイラストに必要な数値データも用意します。

3.デザイン

ワイヤーフレームが出来上がったら、いよいよデザインです。

ワイヤーフレームで全体の流れを理解した上で、デザインのトンマナやレイアウトなどの全体的な方向性を考え、完成イメージが浮かんでから作業に入りましょう。

ワイヤーフレームに書かれている情報をよりわかりやすく表現するためにどのようなデザインにするか考える際は、手書きでデザインラフを描くのがおすすめです。

4.コーディング

デザインが完成したら、コーディング作業に入ります。

コーディングのクオリティは、ランディングページ全体の品質に影響します。コーディングを行う際は、以下のポイントで確認しながら進めましょう。

ランディングページをデザインする際のポイント

ランディングページについて基本的な理解ができたところで、ランディングページで効果を出すためにどうデザインすればよいかについて解説します。

ここからは、コンバージョンに大きく影響すると言われている「ファーストビュー」「コンバージョンエリア」「フォーム」の3つにおいて、デザインをする際に気をつけるポイントを説明します。

ファーストビュー

ファーストビューとはページに訪れたユーザーがはじめにみる画面を指し、ユーザーの心を掴みファーストビューから下のコンテンツを読んでもらうためのきっかけを作ります。

デザインをするときは、訪れたユーザーが一目見て何のサイトなのかがわかるようにしましょう。一般的には、ファーストビューに載せる要素を最低限にした方が効果が出やすいといわれています。

少ない情報で伝えたい内容を正確に伝えることが重要なので、キャッチコピーのみせ方や掲載する画像にはこだわりましょう。

コンバージョンエリア

コンバージョンエリアとは、コンバージョンを促すためのテキストやボタンを配置するエリアを指します。

デザインをする際は、他のどの要素よりも目立たせるようにしましょう。

ランディングページは他のWebサイトと比べて情報量が多いため、コンバージョンエリアが目立たないとユーザーの目に留まらず読み飛ばされてしまうことがあります。

他の部分より目立たせる方法として、以下が挙げられます。ぜひ参考にしてみてください。

エントリーフォーム

ユーザーがランディングページでコンバージョンする際、コンバージョンボタンを押した後エントリーフォームに記入する必要があります。

最後でユーザーを離脱させないために、エントリーフォームのデザインは非常に重要です。

ユーザーにストレスを与えないエントリーフォームとなるように、気をつけながらデザインしましょう。

またユーザーにストレスを与えないためには、システムの工夫も必要です。システムを以下の観点で確認してみましょう。

ランディングページを制作する際のポイント

次に、ランディングページを制作する際のコツを4つ紹介します。

ユーザーを惹きつけるアイキャッチを心がける

ランディングページを制作する際には、ユーザーを惹きつけるアイキャッチを設定するよう心がけましょう。アイキャッチとはユーザーを惹きつける要素であり、そのページのテーマを表すものです。

アイキャッチは視覚的な要素、タイトル、キャッチコピーなどを組み合わせて作成します。例えば「あなたの夢を叶えるために、私たちができることをご紹介します」というキャッチコピーと、それに合った画像を使用して夢を叶えるイメージを強く演出するものがアイキャッチです。

ユーザーの視点を忘れない

ランディングページを制作する際、ユーザーの視点を忘れないようにしましょう。ユーザーが最初に見るのはランディングページのデザインやコンテンツなので、それらをわかりやすく見やすく興味を引くようにする必要があります。

また、ユーザーが目的を達成できるようなコンテンツを提供することも重要です。例えばユーザーが購入を検討している場合、商品の詳細情報や特徴を明確に伝えることで購入意欲を高めたり、ユーザーが検索している情報を提供することで信頼性を高めたりすることができます。

ユーザーの視点を忘れずに、わかりやすく見やすく信頼性の高いランディングページを制作するよう心がけましょう。

入力フォームを最適化する

使いやすい入力フォームを作成することで、ユーザーの体験を向上させることができます。

必要な情報を最小限に抑えることで、ユーザーが入力を完了するまでの時間を短縮できます。

またユーザーが入力する必要のある情報を明確にするために、入力フォームの各項目に適切なラベルを付けましょう。

加えて入力フォームの各項目のフォーマットを提示することで、ユーザーが入力する情報を正しく入力できるようになります。例えば電話番号を入力する際には、「(###) ###-####」のフォーマットを提示することで、ユーザーは電話番号を入力すればいいのだと視覚的に理解できます。

他にも入力フォームの自動補完機能を搭載して、ユーザーが入力する手間を省くのもよいでしょう。

定期的に更新を行う

ランディングページを定期的に更新することは、ユーザー体験を向上させるために非常に重要です。最新の情報を常に提供することで、ユーザーが最新の製品やサービスを知ることができます。

また新しい機能を追加したり既存の機能を改善したりすることで、サイトの利便性を向上させたりSEO対策を行ったりすることが可能です。

参考資料を多数用意する

複数の参考資料を用意することで、ランディングページを作成する際に必要な情報を収集したり検証したりすることができます。

参考資料として扱えるものとして、企業のミッションステートメントやビジョン、ターゲット顧客の調査結果、コンテンツマーケティング戦略などが挙げられます。

またユーザーがどのような行動をとるか知るために、ユーザーエクスペリエンス（UX）デザインなどの専門家からのアドバイスも参考資料として活用することができます。

参考資料を用意することで、ユーザーのニーズに応えるようなデザインを作成することが可能です。

ランディングページを制作する際の注意点

ランディングページを制作する際は、いくつか注意すべきポイントがあります。目的を達成できるランディングページを作り出すために知っておくべき注意点について、解説します。

目的からブレずにライティングを行う

ランディングページを制作する際は、商品の販売促進や集客、お問い合わせの増加など何かしらの目的があるはずです。ライティングを行う際は目的に沿って構成を行い、最後まで一貫して訴求を行うことが重要です。

しかし商品のよさをアピールしたい気持ちからつい熱が入り、どのような人に向けて何を伝えたいのかわからない内容になってしまうケースも少なくありません。

常にユーザーファーストで作ることや、ユーザーのベネフィットを優先的に伝えることを意識したライティングを行うことが重要です。うまく伝えられない場合は、ランディングページを専門とするライターに執筆依頼することも検討するとよいでしょう。

適切な表現をする

ランディングページに限った話ではありませんが、商材やサービスを紹介する際は適切な文言が用いられているか確認することが大切です。特に化粧品や健康食品などで効果効能などをうたう場合は、より厳重な注意とチェックが必要です。

ランディングページを広告として出稿する場合は、薬機法に触れる記述があると広告出稿審査が通らない場合もあります。また内容によっては、薬機法違反など処罰の対象となることもあります。

ユーザーの興味を引く表現は、ランディングページのコンバージョンを高める上でとても重要です。しかし、その表現や文言が適切か確認したうえで公開することも大切です。記述内容に問題がないか、誇大広告になっていないかなどチェックしてくれるサービスもありますので、自信がない場合には相談してみるとよいでしょう。

見た目の華やかさにこだわりすぎない

ランディングページでは多くの画像を用いて、インパクトを持たせたり印象付けたりすることが多いです。しかし見栄えの良いページを作ろうとデザインにばかり気が向いてしまうと、本来伝えるべきことがユーザーに伝わりにくいページになってしまうことがあります。

また多くの画像や過度なアニメーションなどを取り入れることにより、表示速度が低下することもあります。特にスマホでアクセスしている場合は、表示速度が遅いとユーザーが離脱してしまう可能性があるため注意が必要です。

ターゲットや商材、アクセスするデバイスなどにあわせてデザインするよう意識しましょう。

まとめ

効果的なランディングページを制作する上で一番大切なのは、ユーザーの目線に立つことです。

本記事の内容を参考に、成果の出るランディングページを作りましょう！