電話受付中 平日10:00~19:00 03-5919-0055

日本最大級のホームページ制作会社検索サイト

お急ぎの方はお電話で !( 平日10:00〜19:00 )

03-5919-0055

無料でWeb発注相談 ! 24時間受付中 !

メールで相談する

ランディングページの作り方をわかりやすく解説 !おすすめの無料ツールや成果を上げる7つのコツも紹介

マユ

Written by

マユ

ランディングページの作り方をわかりやすく解説 !おすすめの無料ツールや成果を上げる7つのコツも紹介

「ランディングページの作り方を知りたい」
「初心者でも簡単に作れる方法はある?」

上記のような悩みや疑問をお持ちではありませんか?ランディングページは商品の購入や問い合わせなど、ユーザー行動を促すことを目的として活用されています。

適切に制作すればコンバージョン率の向上が見込めるランディングページですが、成果を上げるにはWebマーケティングに関する広い知識が必要です。

そこでこの記事では、ランディングページの作り方や成果を上げるためのポイントをわかりやすく解説していきます。初心者でも扱えるLP制作ツールや、外注した場合の費用相場もご紹介していますので、ぜひ参考にしてみてください。

ランディングページの制作を検討している方は、以下の記事もおすすめです。

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

ランディングページは、以下7つの手順に沿って作成します。

  1. 目的設定
  2. ペルソナ設定
  3. 構成作成
  4. ライティング
  5. デザイン作成
  6. コーディング
  7. 公開・効果測定

    1つずつ順番に解説していきます。

    目的設定

    まずは目的を決めて「ユーザーにどのような行動をとってもらいたいのか」を明確にします。具体的な目的には、以下のようなものがあります。

    • 商品の購入
    • サービスの申し込み
    • 資料請求
    • 問い合わせ
    • メルマガ登録 など

      目的を定めると、必要なコンテンツが絞り込めます。たとえば「商品の購入」を目的とした場合は、画像を多く取り入れる、お客様の声を載せるなど、購入後の自分をイメージさせるコンテンツが必要になります。

      また、目的は1つに絞ることが大切です。「資料請求はこちら」「購入はこちら」など複数の選択肢があると、ユーザーは迷った末に離脱してしまう可能性があります。目的を1つにして選択肢を絞り込めば、コンバージョンにつながりやすくなります。

      ペルソナ設定

      ペルソナとは、商品やサービスを利用する架空の人物像のことです。ランディングページでは「誰に伝えるのか」を決めます。

      以下は、ペルソナ設定の一例です。

      • 30代 女性
      • 既婚
      • 夫と2人暮らし
      • 都内在住
      • 〇〇大学 卒業
      • 金融営業職
      • 年収〇〇〇万
      • 旅行が趣味 など

        詳細にペルソナを設定すれば、ユーザーの悩みや疑問を考えやすくなり、デザインや構成、キャッチコピーなどを最適化できます。

        一方でペルソナを設定せずに作った場合、ユーザーが自分ごととして捉えにくくなり、コンバージョン率の低下を招きます。

        訴求力の高いランディングページを作るためには、目的とペルソナを設定し「誰にどういった行動を起こして欲しいのか」という方向性を定めておくことが重要です。

        構成作成

        次に構成を作成し「何をどのような流れで伝えるのか」を明確にします。

        ランディングページは「ファースビュー」「ボディ」「クロージング」の3つで構成され、それぞれのパートには、以下の要素が配置されます。

        ファーストビュー
        • キャッチコピー
        • アイキャッチ画像
        • CTAボタン など
        ボディ
        • 導入文
        • 商品やサービスの特徴
        • ベネフィット
        • お客様の声 など
        クロージング
        • 申し込みフォーム など

        ランディングページで大切なのは、伝える順番です。いきなり商品の説明や金額を提示しても、購入したいと思うユーザーは少ないでしょう。ユーザーの心境に寄り添い、悩みや課題を解決する手段として商品を紹介すると、自然な流れで購入まで誘導できます。

        ペルソナのニーズやランディングページにアクセスしたときの心理状況なども考慮し、必要な情報を適切な順番で配置しましょう。

        ライティング

        続いて、文章を作成します。ランディングページのライティングは、書く場所によって以下3つに分類されます。

        • キャッチコピー(ファーストコピー)
        • ボティコピー
        • クロージングコピー

        キャッチコピーは、ランディングページを読み進めるかどうかを判断する重要な要素です。簡潔かつインパクトのある表現でユーザーの興味を惹きつけましょう。

        ボディコピーでは、ファーストビューで興味を持ったユーザーに商品やサービスの魅力を伝え、より関心を高める役割があります。キャッチコピーよりも文章量が多くなるため、見出しを使う、重要箇所に装飾を施すなど、ユーザーが飽きずに読めるような工夫が必要です。

        クロージングコピーには、ユーザーのアクションを促す役割があります。「今なら送料無料」「期間限定10%OFF」など、今買うべき理由を伝え、迷っているユーザーの背中を後押しします。

        どのコピーを書くときにも共通しているのは、ペルソナを意識するということです。万人受けを狙っても、ターゲットに強く刺さる文章は書けません。誰に向けた文章なのかを明確にし、ペルソナの心理を考察した上でライティングをすれば、共感を呼び、読み進めてもらいやすいランディングページが作れます。

        デザイン作成

        デザインを作る際は、ペルソナと視線誘導を意識することが重要です。30代男性と60代女性では、魅力的に感じるデザインは異なります。ペルソナの好みや伝えたいメッセージに合わせてデザインを選びましょう。

        視線誘導とは、ユーザーの視線の動きをコントロールする手法のことです。ランディングページでは「Z」の字を描くように視線を誘導するZ型がよく使われています。Z型では、左上に最も目立たせたい情報を、終点の右下にCTAボタンを配置します。読んでいくうちに、自然とCTAボタンまでたどり着くようなレイアウトが理想的です。

        コーディング

        HTML、CSS、JavaScriptなどを用いてデザインを実装します。ランディングページは公開後も分析・改善を繰り返すため、改修を前提としてコーディングしましょう。

        コーディングの技術がない場合は、後述するLP作成ツールを使えば、マウス操作でランディングページの作成ができます。

        公開・効果測定

        ランディングページが完成したら、パソコンやスマホ、タブレッドなど、どの端末でも正しく表示されるのかを確認し、公開します。

        公開後は、Googleアナリティクスやヒートマップなどのツールを使用して効果測定をします。ランディングページはすぐ成果が出るものではないため、分析と改善を繰り返して成長させていくことが重要です。

        効果的なランディングページ(LP)を作る6つのポイント

        ランディングページの効果を高めるポイントは、以下7つです。

        • ファーストビューで惹きつける
        • ユーザーファーストを意識する
        • 押したくなるCTAにする
        • 集客方法まで考慮する
        • 継続的に改善する(LPO)
        • 誰でも更新できるようにする

          1つずつくわしく解説します。

          ファーストビューで惹きつける

          ランディングページでは、ファーストビューの直帰率が70%以上と言われています。読み進めてもらうためには、ファーストビューでいかにユーザーを惹きつけるかが重要です。

          キャッチコピーと画像は、ペルソナや流入経路に合わせて最適化し、訪れたユーザーが「悩みが解決できるかも」と感じるようなファーストビューにします。「満足度98%」のように、具体的な数字で実績を載せ、権威づけするのも有効です。

          また、CTAボタンはファーストビューにも設置し、気になったときにすぐ購入へ進めるようにしておきます。

          ユーザーファーストを意識する

          ランディングページを作るときは、全ての工程においてユーザーファーストを意識しなくてはいけません。

          どんなに優れたコンテンツを作っても、表示速度が遅い、CTAボタンがどこにあるのかわからないようなページでは成果につながりません。ユーザーにとっての見やすさ、使いやすさを最優先で作りましょう。

          ライティングをするときにも、ユーザー目線を意識します。商品説明では、自社が売り込みたい情報を全面にアピールするのではなく、ベネフィットを伝えることが大切です。ベネフィットとは「ユーザーが商品を使用したときに得られる利益」のことです。

          たとえば、乾燥機付き洗濯機の特徴は「洗濯から乾燥まで自動で完結できる」ですが、ベネフィットは「空いた時間で好きなことができる」です。

          機能や特徴だけでなく「この商品を使うとユーザーにとってどんな良いことが待っているのか」まで伝えると、より効果的に商品の魅力を表現できます。

          押したくなるCTAボタンにする

          CTAボタンのデザインや文言、配置は、コンバージョン率に大きな影響を与えます。よく使われる色は、赤、オレンジ、緑です。ページ全体との調和も考慮しつつ、目立つ色を選択してください。

          さらに、以下の点にも留意し、ユーザーがクリックしたくなるようなCTAボタンを設置しましょう。

          行動を促す文言にする
          • カートに入れる
          • 無料で試してみる
          • 今すぐ会員登録する 
          マイクロコピーを添える
          • 初回限定
          • たったの◯分で完了 
          目につきやすい場所に配置する
          • ファーストビュー
          • スクロールに追従させる
          • ヘッダーやフッダーに固定する 

          集客方法まで考慮する

          ランディングページを作っても、アクセスしてもらえなければ意味がありません。そのため、予め集客方法まで検討しておく必要があります。

          集客方法には、メルマガなど自社のリソースを活用する、SNS広告やリスティング広告と組み合わせるなどの手段があります。

          どの手段においても注意したいのが、流入元とランディングページの内容が乖離しないようにするということです。ふと広告をクリックして訪れたランディングページで、広告のキャッチコピーとは違う内容が表示されると、ユーザーはすぐにページから離れてしまいます。

          ファーストビューのキャッチコピーや画像は広告と揃えるなど、集客手段とのつながりを考慮して設計することが大切です。

          継続的に改善する(LPO)

          ユーザーのニーズに合わせてランディングページを改善することを、LPO(ランディングページ最適化)といいます。

          ランディングページにアクセスされているのにコンバージョンが増えないのは、何か原因があるはずです。公開後は必ずLPOを実施し、ランディングページの効果を高めていきましょう。

          LPOは、以下の手順で進めます。

          1. 課題を把握する
          2. 仮説を立てて対策を考える
          3. 対策を実行する
          4. 効果を検証する

            実際の例を挙げてみましょう。

            1. 課題:ファーストビューの離脱率が高い
            2. 仮説:ファーストビューに問題がある?
            3. 対策:キャッチコピーを改善する
            4. 効果検証:A/Bテストの実施

              A/Bテストとは、ランディングページの複数のパターンを同時に試し、効果を検証することです。

              ユーザーの反応を見ながら改善を繰り返し、ランディングページをブラッシュアップしていきましょう。

              誰でも更新できるようにする

              ランディングページは継続的に改善することで効果を高められます。エンジニアやデザイナーしか更新できない仕様では、改善に手間がかかってしまいます。

              ノーコードツールを使用する、知識を共有するなど、専門知識がないメンバーでもスピーディーに改善ができる運用環境を整えておくことが理想的です。

              初心者でも簡単に作れる無料のランディングページ(LP)作成ツール4選

              自社に専門知識のある人材がいなくても、LP制作ツールを使用すれば、ドラッグ&ドロップなどのマウス操作で手軽にランディングページが作れます。

              以下は、初心者におすすめの無料プランつきのLP制作ツールです。

              • ペライチ
              • Wix(ウィックス)
              • Jimdo(ジンドゥー)
              • WordPress

                1つずつくわしく解説します。

                ペライチ

                ペライチの公式HP

                出典:ペライチ

                使い方動画やページ添削、無料個別相談などサポートが充実しているため、初心者の方も安心です。さらに、国産で日本人にとって使いやすい仕様になっているのも魅力の1つです。

                「フリープラン」では、無料で1ページのWebページを公開できます。また、予約や決済、メルマガ機能なども使用できる「ビジネスプラン」を1ヶ月無料で試すことも可能です。

                Wix(ウィックス)

                Wixの公式HP

                出典:Wix

                900種類以上のテンプレート、2万点以上の写真・動画素材を自由に使って、デザイン性の高いランディングページが作れます。

                ノーコードで手軽に作ることも、コーディングを使って高度なカスタマイズをすることもできるため、初心者から上級者まで幅広いユーザーに支持されています。

                Jimdo(ジンドゥー)

                Jimdoの公式HP

                出典:Jimdo

                ナビ通りに進めていくただけで、AIが最適なWebページを自動生成してくれます。初心者はもちろん、レイアウトや配色を考えるのが苦手な方、時間を書けたくない方にも最適なツールです。

                ドイツ製ですが、日本人スタッフによるサポートを受けられるため、もしものときにも安心です。

                WordPress

                WordPressの公式HP

                出典:WordPress

                世界中で利用されているCMSツール「WordPress」でも、ランディングページが作れます。ランディングページ専用のテーマ(テンプレート)もしくはプラグインを活用すれば、プログラミングの知識がない方でも手軽に作れます。

                ただし、別途サーバーやドメインを用意する必要があるため、既に利用している方や、これから導入する予定がある方におすすめです。

                ランディングページ(LP)を外注する場合の費用相場

                自社にリソースがない場合、機能やデザインにこだわりたい場合は、外注するのも1つの方法です。

                費用相場は10〜60万円程で、依頼内容や依頼先などによって金額は大きく変わります。以下に相場ごとの特徴をまとめましたので、参考にしてみてください。

                ランディングページ制作の費用相場についてくわしく知りたい方は、以下の記事も参考にしてください。

                ランディングページ(LP)制作の費用相場│料金事例や内訳、節約方法まで徹底解説

                10万円以下

                コストを抑えて最低限の工程のみを外注するなら、10万円程度で作れます。多くの場合対応してもらえるのはデザインやコーディングのみで、他の工程は自社で対応する必要があります。

                機能やデザインにこだわらず、できるだけ低コストで手早くランディングページを作りたいという方に向いている価格帯です。

                10〜30万円

                10〜30万円は、最も一般的な相場です。構成・デザイン・コーディングの工程を任せられ、独自性の高いデザインも作れます。戦略設計やライティング、公開後の運用は自社で対応することが一般的です。

                コストを抑えつつ、ペルソナに合わせて最適なデザインを作りたいという方におすすめの価格帯です。

                30〜60万円

                高品質なランディングページを作りたい場合は、30〜60万円程度をみておきましょう。戦略設計からプロに任せられるため、手間を掛けずに完成度の高いランディングページが制作できます。公開後のサポートの有無は、依頼先によって変わってきます。

                任せる工程が多い分、制作会社による品質の差が出やすいため、実績を見る、相見積もりをとるなどして、よく吟味した上で依頼してください。

                60万円以上

                ランディングページに関するWebマーケティング全般の支援を受けたいなら、60万円以上を想定してください。戦略設計から公開後の改善まで依頼できるケースもあり、サポートが充実しているため、成果にこだわる方におすすめです。

                30〜60万円の相場と同様、依頼先による品質の差が大きい為、自社に合った制作会社なのかをしっかりと見極めてから依頼する必要があります。

                ポイントを押さえて効果的なランディングページを作ろう!

                今回は、ランディングページの作り方を解説しました。ランディングページを作るときは、予め目的とペルソナを設定し「誰にどのような行動を促すために作るのか」を明確にすることが大切です。

                制作工程では、ユーザーファーストの姿勢も欠かせません。企業の伝えたいことを全面に押し出すのではなく、ユーザーの心境に寄り添った構成やライティング、わかりやすいデザインになっているかまで配慮する必要があります。

                本記事でお伝えしたポイントを参考に、ランディングページでコンバージョン率向上を目指しましょう。

                この記事を書いたライター

                マユ

                マユ

                IT企業で12年勤務。現在は2人の子を育てながらWebライターとして活動中。スイーツやインテリアなど、幅広いジャンルを執筆。読者に寄り添った、分かりやすく、丁寧な文章を心がけています。趣味はパン屋さん・ケーキ屋さん巡り。

                このライターの記事一覧

                この記事を監修した人

                藤澤 尚也

                藤澤 尚也

                優良WEB編集長・JetB株式会社メディア事業部SV。前職の大手IT企業の同僚から誘いを受け、2018年に営業として入社。その後Webディレクターに転身し、3年以上経験を積む。多様な経験からくる幅広いWebリテラシーと持ち前の文章力を買われて優良WEBの編集長に抜擢。ベースとラーメン二郎をこよなく愛する。

                この監修者の記事一覧

                Share

                関連記事

                Share