ランディングページの作り方を紹介！手順から注意点、ツールまで解説

「ランディングページの構成の作り方やルールはあるのか」
「LP作成ツールにはどのような機能があるのか」

ランディングページは、ポイントを押さえた作り方ができているかどうかで、その成果に大きな差がつきます。

この記事では、企業のWEB担当者やマーケティング担当者に向けて、ランディングページの作り方について解説します。

■合わせてよく読まれている資料
→ランディングページ作成の入門書

ランディングページ（LP）とは？

ランディングページとは、商品詳細ページやサービス紹介ページなど、ユーザーのアクションを誘導することが目的のページのことです。

1ページに情報を網羅することで訴求力を強め、ユーザーに資料請求や問い合わせなどのアクションを取ってもらえることが特徴です。成約を獲得しやすく、事業に貢献する重要なコンテンツとなります。

広義では、ブラウザの検索結果やWeb広告などを介して、ユーザーが最初に訪れたページを指しますが、ここではリスティング広告などで誘導する、訴求に特化した1ページの意味で使用します。

▼「そもそもLPとは？」という方は、こちらで詳しく解説しています。
ランディングページ（LP）とは？作り方とBtoBで活きる構成



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

まずはランディングページの作り方を手順ごとに紹介します。

1. 目的を定める
2. ターゲット、訴求決定
3. 構成作成
4. ライティング
5. デザイン作成
6. コーディング
7. 公開、効果測定

1.目的を定める

ランディングページの設計や内容は、「目的」によって変化します。BtoBのランディングページの目的としては、以下が一般的です。

• サービス資料請求
• メルマガ登録
• ホワイトペーパーダウンロード
• 問い合わせ

2.ターゲット、訴求決定

ランディングページでは、読者の興味・関心を引き、コンバージョンにつながるような訴求をしなくてはなりません。

ターゲットを具体的にすることで、より強い訴求方法やデザイン、構成を作ることができます。ターゲットとなる顧客を具体的にイメージしてください。

ターゲットに対して、自社の魅力を最もアピールできる訴求方法を決めましょう。

3.構成作成

目的とターゲットが明確になったら、ランディングページの構成を考えていきます。構成とは、「何をどのような順番で伝えるか決める」こと。

商談やプレゼンテーションでは、相手が理解しやすいように順序立てて必要事項を話すと思います。同じように、ランディングページでもユーザーが情報を把握しやすいようにページを構成することで、より成約につながりやすくなるのです。

ランディングページの構成が出来たら、ワイヤーフレームを作成します。ワイヤーフレームとは「WEBページの設計図」のことで、構成をより具体的にWEBページの形に落とし込んだもののことです。

ワイヤーフレームによってコンテンツの整理やレイアウトの設計ができるだけでなく、メンバー同士で認識を擦り合せることができます。

4.ライティング

ランディングページに掲載する文章を準備します。ユーザーの興味を最初に惹きつける重要な部分である「キャッチコピー」は慎重に考えましょう。

キャッチコピーは、文章の説明を端的にあらわしたものです。画面上でも大きく表示されますし、目を引きます。キャッチコピーで興味や関心を惹くことができれば、ページの内容をより読んでもらえるのです。

以下のような、キャッチコピーを作成する際のポイントを押さえておきましょう。

• 問題点を指摘する
• 数字を使って具体的に表現する
• 意外な事実で興味を持たせる
• 問題解決後の未来を想像させる

ユーザーの関心を惹き、コンテンツを読みたくなるようなキャッチコピーを作成するのが重要です。

また、テキストコンテンツでは文字数が多くて見にくかったり、強引に説得するような印象が強かったりすると、ユーザーが離脱しやすくなるので注意しましょう。

5.デザイン作成

ペルソナ、構成、コンテンツを元にデザインを作成していきます。
デザイン作成ではユーザーの動線を考えて、コンバージョンが得られる設計にする必要があります。

ランディングページ作成のポイントは以下となります。

• 視線誘導を意識する
• ファーストビューでユーザーを惹きつける
• 1ページにまとめる
• イメージや画像を挿入して分かりやすくする
• 申込ボタンは目につく場所に配置する
• 必要以上に画像、文字を配置しないでメリハリを付ける
• 無駄に余白を入れない
• テーマに合ったテキストスタイルを選ぶ
• 適切な横幅サイズを把握しておく

6.コーディング

コーディングとは、デザインまでで出来上がったものを、ブラウザで見られるようにする作業です。スマートフォンやタブレットなど、さまざまな端末や環境で正しく表示されているかを確認しましょう。

ランディングページは運用するなかで改修をしていくので、修正のしやすさも確認しておいてください。

ちなみにLP作成ツールを使用すれば、HTMLなどの専門的な知識が必要なく、直感的にLPを作成・運用することができます。

7.公開、効果測定

ランディングページを公開した後には、Googleアナリティクスやヒートマップツールなどのアクセス解析ツールを利用して、効果を測定しながらPDCAを回していきましょう。

ランディングページは改善を重ねていくことで、さらに成果を得られます。

ランディングページ（LP）の構成の作り方

ランディングページは構成次第でランディングページの成果が大きく変化します。ここからは、構成の作り方において注意すべきポイントを解説しますので、ぜひチェックしてください。

1. ファーストビュー
2. 興味・関心
3. エビデンス
4. 信頼
5. クロージング

①ファーストビュー

ファーストビューとは、ランディングページを開いたときにユーザーが最初に目にする部分のことです。ファーストビューでは「何のサービスなのか読み手に伝わるか」が重要となります。

ファーストビューで表示する内容としては、主に以下の3つです。

• キャッチコピー
• CTAボタン
• メインビジュアル画像

メインビジュアル画像やキャッチコピーではユーザーの注目を集め、画像は一目で何のサービスや商品か伝わるものを選ぶ必要があります。

CTAボタンもファーストビューに入れることで、成約率の向上を狙うことが可能です。

②興味・関心

興味・関心を惹きつけることでLPを読み進めてもらいやすくなります。興味・関心を引くために必要な要素は、主に以下です。

• 得られる結果
• こんな方に／こんなお悩み
• 気づき
  
  

A.得られる結果

サービスや商品を利用することで、どのような効果が得られるか分かりやすく伝えます。事例を見せるのも一つの手段です。

B.こんな方に／こんなお悩み

無形商材やソリューションサービスを提供する場合や、競合と差別化を図りたい場合は、ユーザーに「自分ごと化」してもらうことが大切です。

そのためには、ユーザーの悩みや課題に寄り添うような内容で共感を獲得することが重要となります。

C.気づき

競合が多く差別化を図りたい場合、ユーザーが想定していなかった新事実を提供することで興味を持たせます。ユーザーに「新発見」を提供し、興味のきっかけを与えるようにするとよいでしょう。

③エビデンス

ユーザーにサービスがどれだけ効果的か「納得」してもらう必要があります。ユーザーは半信半疑の状態でWEBページを閲覧しているからです。

ユーザーに信用してもらうには、証拠となるエビデンスが大事です。成果の得られる根拠やサービス詳細、活用例などを組み合わせて構成していきましょう。

A.実績

数字でメリットを伝えるのが効果的な場合、「実績」で信憑性をもたせましょう。数字を使用することでユーザーが具体的にイメージしやすくなります。例えば広告メディアの場合、広告主にとってはユーザー数の多さや知名度の高さがポイントになります。

B.機能

機能が画期的で競合と差異化が図りやすいときは、機能の強みや魅力を伝えるのが効果的です。見るだけで明らかに競合より使い勝手が良いのが伝わるため、コンバージョン獲得に繋がります。

C.専門知識

コンサルや無形商材で専門知識を要する場合には、専門知識をアピールすることは有効な手段です。
例えば、有名な専門家が監修している場合など説得力があります。図や表などを用いて具体的にアウトプットを見せるのもよいでしょう。

D.活用例

有形商材やツールなどの場合、活用例を見せることで課題解決のイメージに繋がります。
活用例によってユーザーが新たな気づきになることもあり、興味を持たせる要素になるのです。

④信頼

「信頼」は、ユーザーが抱いている不安や疑問を払拭するのに効果的です。会社や品質などを信頼しなければ、ユーザーは購入することがありません。
第三者の評価や、よくある質問などを組み合わせて、サービスや商品の利用前に安心してもらうことが大切です。

A.顧客の声

導入したメリットや運用状況をイメージしやすくなります。だからこそ、これまでの顧客の声を掲載するのが効果的です。
顧客の声はストーリー性のある内容にすることで、ユーザーの共感を獲得できます。

B.〇〇さんもオススメ

業界や業種の中で支持を集めている人の名前を使用することで、ユーザーの信頼度を高めることができます。「〇〇さんもオススメ」のように、本を出版する際に著名人の感想を帯に掲載するのと同じ戦略です。
これによって、著名人の信頼性や影響力をサービスにも活かすことができます。

C.料金表

ユーザーが商材の導入を本格的に考え始めたとき、料金は重要な判断材料になります。競合と比較して価格に優位性がある場合、料金表を掲載しましょう。
価格帯が比較的高かったり、料金体系が複雑だったりする場合は、まずは問い合わせや資料請求に誘導するのが効果的です。

D.よくある質問

FAQ、よくある質問は、ユーザーの疑問を払拭するのに役立ちます。
疑問点が解決されないとアクションに繋げられないため、ユーザーが疑問を持つようなポイントは事前に解説しておくようにしましょう。

E.開発者の声

「開発者の声」は、サービスや商品の開発を行うきっかけや想いを伝えることで、好感度や信頼性を高めることができます。
BtoBで顧客の声の掲載が難しい場合などに、開発者の声を利用すると効果的です。

⑤クロージング

クロージングとは、ユーザーに契約や問い合わせなどの行動を促す場所です。期間限定、スピード対応、特典など、ユーザーにアクションを促す情報を提供しましょう。

ただし、クロージングの部分で今すぐ買わなければならない理由などを述べる際、押し売り感が出ないように注意が必要です。ユーザーのベネフィットを意識した訴求を行いましょう。

ランディングページの制作手段

ランディングページの構成やポイントがわかったところで、実際に制作をする手段を3つ解説します。

フリーランス

クラウドソーシングサービスなどを介して、フリーランスのデザイナーにランディングページを依頼することが可能です。
単価は低めですが、デザイナーのクオリティやレベルに差があるのが懸念点です。
キャッチコピーや構成などが不得意など、人によって得意不得意があるので注意が必要です。

WEB制作会社

WEB制作会社に依頼することでランディングページを作ってもらうと、デザインや構成が優れたものが期待できる一方、費用が高めです。

ランディングページを運用していくなかでも、逐一変更を加えるのに依頼をする必要があるため、費用や時間がかかります。

ランディングページ作成ツール

ランディングページ作成ツールとは、画像とテキストを挿入するだけで簡単にLPが作成できるツールです。HTMLやCSSなどの専門的な知識は必要ありません。

ランディングページ作成ツールを利用することで、素早くPDCAを回すことができ、制作会社に支払うコストを抑えられます。

無料のものから有料まで幅広くありますが、顧客管理・広告運用・アクセス解析などの機能を持ったものもあり、施策の実行から効果検証、改善まで実行可能です。

BtoB向けのランディングページの制作・運用なら「ferret One」

弊社のferret OneはBtoBに特化したWebサイトを、その後各社がマーケティングしやすいCMSで納品します。​​​​​​BtoBマーケのプロがサイト運用者の視点で開発した圧倒的に使いやすいCMSが魅力です。

• BtoBに特化したWebサイトを作りたい

ferret Oneは長年の事業運営と1000社以上の導入実績から、リード獲得・育成の成果実証済みの成功の型でWebサイトを制作します。

• ノーコードで、とにかく簡単に、ページ作成・更新したい

「Wordpressや他社のCMSより断然使いやすい」との声を多くいただいています。

サービスサイトやLP、セミナー集客、資料ダウンロードなど、BtoBのノウハウを反映したテンプレートも多数用意されていますので、新規作成も簡単です。

成果の出る構成案がわからないとお悩みの方も、まずテンプレートからはじめて、PDCAを回しながら自社にとって効果的なランディングページにしていくことができます。

>ferret Oneサービス紹介資料のダウンロード【無料】はこちら

ランディングページ作成もできる「ferret One」の制作事例

ランディング制作もできるマーケティングツール、「ferret One」を実際に導入した事例を紹介します。

制作スピードが大幅に向上した事例

企業のギフトキャンペーンの支援事業を提供するSBギフト株式会社では、LPの作成や運用に時間と経費がかかってしまうことに課題を感じていました。

しかし、「ferret One」を利用することで、1行もコードを書くことなく簡単にLPの作成・修正ができるように。外注していた頃は1~2カ月かかっていたLP制作が、2週間でできるようになりました。

引用：https://ferret-one.com/cases/voice020_softbankgift

リードの受注率/単価ともに高い水準となった事例

離職防止アプリを提供する株式会社テガラミルでは、Webからの問い合わせ数が少なかったことと、施策を改善するためのPDCAを回せていなかったことに課題を感じていました。特に、LPの質に特に大きな課題を抱えたいたとのこと。

チーム内でも改善が必要と感じていたものの、改善に必要なノウハウや時間的余裕を持った人がいなかったため、ずっと浮いた課題となっていました。

そこで、操作性と更新性の高い「ferret One」を導入することで、定量的なパフォーマンス数値を見ながら細かく改善することが可能になりました。

Webから獲得したリードは受注率もとても高く、20%を超えてきており、良質なリードを獲得でき始めているとのことです。

引用：https://ferret-one.com/cases/027-tegaramill

まとめ

ランディングページの作り方の手順は以下の通りです。

1. 目的を定める
2. ターゲット、訴求決定
3. 構成作成
4. ライティング
5. デザイン作成
6. コーディング
7. 公開、効果測定

特に、構成がポイントです。ランディングページは、ユーザーの心を動かす構成を取り入れることで、離脱を防ぎ、検討度を上げていくことができるため、構成次第で成果が大きく変化するのです。

また、ランディングページ作成後には、データを取り、PDCAを回しながら改善していくことが重要です。この度紹介した構成例をもとに、運用していき、より成果の出るランディングページに調整していきましょう。

もしも、素早くPDCAを回すために必要な環境が整っていない場合は、ページの改修がしやすく、データ収集しやすいツールを導入するなど、環境整備から取り掛かることをおすすめます。

BtoBのランディングページ作成にお悩みでしたら、弊社の「ferret One」もぜひご検討ください。

BtoBマーケティング支援を続けてきたマーケティング会社が開発しているツールのため、ノウハウを詰め込んだテンプレートで成果の高いランディングページの作成をサポートします。

ご興味のある方はぜひ資料をご覧ください。

>ferret Oneサービス紹介資料のダウンロード【無料】はこちら

▼あわせて読みたい「BtoBマーケティング」についての記事
立ち上げ初期のマーケティング組織、まずやるべきことは？戦略立案からスケールを目指すまで

Webサイトは優秀な営業マン！ リード獲得のための4つのステップ