UI/UXデザイナーが教えるランディングページの効果と作り方!基本編

カテゴリ:Webマーケティング

公開日:2020.06.18 最終更新日:2023.10.16
このエントリーをはてなブックマークに追加

こんにちは!inglowのUI/UXデザイナーです。

早速ですが、あなたは自社の売上アップのために、Webマーケティング施策の一つとして、ランディングページの制作を考えたことはありますか?

最近は、IT企業に関わらず様々な業界で、ランディングページを活用し成果を上げていると耳にします。

もしこれからランディングページを取り入れようとお考えだとすれば、

「何から始めれば良いかわからない…」

「どんなスキル(人材)が必要かわからない…」

「そもそも本当にやるべきだろうか…」

といったことで、頭を悩ませているところかもしれませんね。

当ページでは、ランディングページを活用してみたい!とお考えの担当者様や、ランディングページを個人で勉強してみたいとお考えの方に向けて、ランディングページの効果と基本的な作り方を解説していきます。

今さら…なんて思わず、ランディングページが良いと言われている今だからこそ、ぜひ最初の一歩を踏み出しましょう!

また、弊社ではWebプロモーション成功事例集をまとめた限定資料を無料で配布しています。

Webマーケティングに興味がある方は、下記ページより目を通してみてください。

ランディングページとは?どんな役割があるの?

そもそもランディングページとは、インターネット広告から集客した見込み顧客向けに表示される、1ページだけの縦長のWebページのことを指します。

ランディングページはただ商品を紹介するためだけでなく、その魅力を伝え、本当の目的である、商品購入や申込みまでのアクションを見込み顧客に実行してもらう、ゴールに導くための重要な役割を持っています。

ランディングページが重要とされる理由と効果

Webマーケティング施策において主流ともいえるインターネット広告、いわゆるリスティング広告などは、それ自体が重要視すべきモノではありますが、同様にランディングページの最適化も、年々重要度が高まっています。

その背景には、広告にお金を注ぎ込みどれだけ集客に成功したとしても、実際にアクションを起こしてもらう場であるランディングページで、見込み顧客の心を動かすことができなければ、本来の目的である収益につながることはないという事実が、近年浮き彫りになってきているからです。

実際、サイトを訪れるユーザーの平均直帰率は40~60%であると言われており、せっかく広告やSEO施策などにコストをかけても、その大半の見込み顧客を取り逃してしまっているのでは意味がありません。

このご時世において、中途半端な商品紹介ページや、そもそも集客のためのページが存在しない…なんてことは、もはや論外とも言えるでしょう。

もちろん、ランディングページがいくらあっても、それ自体が上手く機能しないと収益アップも厳しい戦いになってしまいます。反対に、最適化に成功すれば、これまで0件だった成約が100倍になったり、横ばいだったCV率の大幅な改善などが期待できるでしょう。

またwebで集客する方法を別の記事にまとめております。

詳しく解説しているので、web集客について深く知りたい方は、ぜひこちらもご覧ください。

web集客
【2023年更新】Web集客の方法と種類を無料・有料別に紹介!
今回の記事を読むことで、Web集客をして、実際に売上を伸ばすための最適な方法をご紹介します。

必要な情報を集めよう!ランディングページの作り方【準備編】

先ほどもお伝えした通り、いくらランディングページがあっても、それ自体が上手く機能していないと収益アップは望めません。

どんなに美しいデザインにしたとしても、感動的な商品誕生エピソードを語ろうとも、見込み顧客の購買意欲に火をつけることができなければ、ランディングページとしての価値はゼロに等しいでしょう。

そこで大切なのが、ランディングページを作り始める前に決める「構成」です。

ランディングページは何度もテストを重ねる場合もあるので、そのためにも「構成」は必ず決めておかなければなりません。

ここではまず、その構成を決めるまでの必要な準備について、解説させていただきます。

①LPの目的(ゴール)を決める

ランディングページを作成するにあたり、まずは「目的(ゴール)」を明確にしましょう。

目的(ゴール)とは”見込み顧客にやってもらいたいこと(アクション)”です。

例えば、「商品を購入してもらう」や「サービスへの会員登録を増やす」こと、「資料請求」など、ランディングページで達成させたい目的(ゴール)を1つ決めておきましょう。

目的(ゴール)を言語化および文章化しておけば、チーム内で共通認識を持つことができ、施策実行後の検証においても、目的は達成されたかどうか、ブレることなく調査することができます。

②ターゲット(ペルソナ)決める

ペルソナ

続いて訴求軸となる「ターゲット(ペルソナ)」を決めます。ペルソナとは、実際にアクションを起こす見込み顧客の詳細なプロフィールや価値観を具体的にした顧客モデル(画像参照)のことです。

見込み顧客は、どんな人物で、何に悩んでいるのか?どうしたらランディングページでアクションを起こしてくれるのか?といったことを明文化していきます。

これによりターゲット層が明確となり、ランディングページのキャッチコピーやデザイン、打ち出し方などを決定することができます。

③LPの構成(たたき台)を決める

LPの構成(たたき台)を決める

目的(ゴール)とターゲット(ペルソナ)が決まったら、いよいよランディングページの「構成」に入ります。構成とはいわゆる営業・プレゼンテーションのようなモノです。

見込み顧客にアクションを起こしてもらうために、何を話すべきか?どの順番で載せるべきか?アクションを起こしてもらうタイミングはどこか?など、詳細な内容(コンテンツ)と目的(ゴール)までの流れを決定しましょう。

決定した内容は、ワイヤーフレームなどと呼ばれる設計図に落とし込みます。ここまで来れば、たたき台となるランディングページの「構成」の完成です。

形にしよう!ランディングページの作り方【構築編】

ランディングページを作るための構成が完成したら、次は「構築」を行います。構築はデザイン〜公開・運用まで大まかに3つのステップがあります。こちらも順をおって解説していきます。

①構成を元にLPデザインを行う

構成(コンテンツ)が揃ったら、デザインを進めていきます。準備編で行ったランディングページの構成は、とても大切なプロセスですが、デザイン同じく、施策の結果を左右する重要な要素の1つです。

デザインが異なるだけで、見込み顧客の反応は変化しますので、何度もテストすることを前提に、ターゲット(ペルソナ)にどのような見せ方をすれば目的(ゴール)にたどり着いてくれるのか考えながら、最初に試したいデザインを決めましょう。

②デザインを元にコーディングを行う

デザインが完成したら、インターネット上に表示させるためのコーディングと呼ばれる作業に入ります。コーディングは、HTML、CSS、JavaScript、PHPなどの言語を使用します。

コーディングは、デザインに忠実であることだけでなく、パソコン、タブレット、スマートフォンといった様々なブラウザに対応し、見込み顧客にとって使いやすい開発を行うことが大切です。

ページが上手く表示されない、お問い合わせフォームが使いづらいといったことがあると、離脱の原因になってしまいます。コーディングが終わった後は、公開前にチームで使用感などをテストしておくと良いでしょう。

③公開・運用・効果測定を行う

コーディングが終わり、問題なく動作することが確認できたら、いよいよランディングページの公開です。

ランディングページを公開する際には、後々効果測定や改善を行うために、忘れずGA(Google Analytics)などのアクセス解析を設置しましょう。

こうすることで、ランディングページ公開後に、お問い合わせボタンやアクションを起こして欲しい箇所で、見込み顧客がどのような行動をとったかを分析し、ランディングページの改善および収益アップにつなげることができます。

ランディングページにおける忘れがちな3つの注意点

さて、ここまで基本的なランディングページの作り方についてお話ししてきましたが、この項では、ランディングページを作る上で、忘れがちだけど覚えておいて欲しい3つの注意点をお伝えさせていただきます。

①見込み顧客はそもそも”買う気”なんてない

ランディングページ制作時に、ついついやってしまいがちなのが”企業側の視点で物事を考えてしまう”こと。あなたも一度はありませんか?「こんなに良い商品なのに、何で買ってくれないんだ…!」と思ったこと。

しかしそれは見込み顧客にとっては当たり前のことなのです。その商品がどんなに素晴らしいモノであっても、「今すぐ必要だ!」と緊急性を感じていない限りは、その商品を見ても欲しいとは思わないし、買うメリットも感じません。

自分だったどうするか考えてみれば案外わかりやすい筈。ランディングページを作る際は、”そもそも顧客はその商品(やサービス)を欲しがっていない“ということを忘れず、どうすれば「欲しい!」と思ってもらえるのかを、考えながら構成を練ると良いでしょう。

②デザインのメリハリをつける

ランディングページはコーポレートサイトなどと異なり、見込み顧客にアクションを起こしてもらうために特化した”武器”です。購買意欲をかき立て、手を止めてもらうためには、色や形、サイズ、位置といった全ての要素の中で明確なメリハリをつける必要があります。

平坦なデザインでは、訴求箇所やボタンはスルーされてしまいますし、ごちゃごちゃしすぎていると、それがストレスとなり早々に離脱されてしまうでしょう。

キャッチコピーやベネフィット(その商品およびサービスから得られる利益)、お問い合わせボタンなど、しっかり目を止めて欲しいコンテンツと、商品の概要や会社の紹介といったスルーされても問題のないコンテンツに違いを持たせ、わかりやすいデザインを目指しましょう。

③サーバーやURL、メールアドレスを決めておく

初めてランディングページを作る場合に忘れがちなのが、サーバーやURL、メールアドレスに関する準備です。

ランディングページはページを作ればOKではありません。いつでも公開できるよう、以下のモノを前もって準備しておきましょう。

  • LPをアップロードするサーバーの場所
  • LPのURL(https://○○○○○○)
  • LPからお問い合わせがあった時の通知用メールアドレス
  • LPからお問い合わせがあった顧客へ送信するメール文

ランディングページを活用して収益アップにつなげよう!

ランディングページの作り方や効果は、提供する商品やサービスによって様々。自社にとってどれが正解となるかは、やってみなければわかりません。「興味はあるけど迷っていた…」という担当者の方は、この機会にぜひランディングページの施策を取り入れてみてはいかがでしょうか?

Inglowでは、Webキャンペーンの実行から運用までを一気通貫で支援するWebプロモーションも行っています。具体的な内容や料金など、興味がありましたら是非ご相談ください。

それでは、また次の記事でお会いしましょう!








弊社inglowでは、これから広告の運用を考えられている方、あるいはこれから広告代理店に運用をお願いされる方向けに、「業界別Web広告の成功事例」をまとめた資料を無料配布しております。

下記のフォームに入力いただくだけで、無料で資料をダウンロードしていただけます。ぜひご利用下さい。

mihon

    このサイトはreCAPTCHAとGoogleによって保護されています。プライバシーポリシー利用規約が適用されます。

    *毎月先着5組様限定!Webマーケティングの無料個別相談会*

    株式会社inglowでは、WEBマーケティングにおいて課題を抱える企業担当者様向けに、WEBマーケティングのプロに相談できる無料の個別相談会を開催しております。

    日々多くの方からご相談を頂くので、お客様一人一人への対応の質を維持するために人数制限を設けさせて頂きました。

    ▼「Webマーケのことあれこれ相談会」のご予約はこちら!

    Webマーケティング無料相談会の詳細及び申し込みフォーム

    一覧へ戻る