Schooをご利用になるには、JavaScriptの設定を有効にしてください。 →JavaScriptの設定方法（参考）

4/28(Sun)

今日の生放送

21:00 - 21:40

【再放送】実践編 - Excel業務をAIにやらせてみよう第1回

【ランディングページとは？】成果に繋がるランディングページの作り方

2019年9月27日 14:52 更新

――目次――

１、「ランディングページ」とは？

２、成果に繋がるランディングページの作り方

３、「ランディングページ」をさらに学んでみよう！

【ランディングページとは？】成果に繋がるランディングページの作り方。それが、成果の上がるランディングページを作成したいWebデザイナー、Webディレクター、 Webサービスのご担当者にオススメの授業。

かいせつ先輩

Web業界で働いている人は、「ランディングページ」という言葉をよく耳にすると思いますが、一体これが何なのか説明できますか？

「ランディングページ」をきちんと理解し、上手に活用できれば、ビジネスの新たな活路を見い出せる可能性も秘めています。

「ランディングページ」とは？

「ランディングページ」とは、主に本サイトとは異なる１枚完結型のウェブページを指し、ネット広告で集客した見込み顧客を口説き落として目的のゴール（商品購入や会員登録など）へ導く役割を担います。また、一般的なランディングページは、下記の７項目で構成されます。

１、ファーストビュー

２、アクション導線

３、ベネフィットの伝わる商品説明

４、利用者の声

５、実施の流れ（期間・手順）

６、FAQ（よくあるご質問）

７、＋α　フォームの追加

的を絞ったターゲットユーザーを口説き落とすことに特化したページであるため、ポイントをしっかり押さえて作れば、Webマーケティングの成果を上げるための重要な施策となり得るのです。

詳しくは、スクーの授業で先生に教えてもらいましょう。

先生のご紹介

寺島菜緒　ソウルドアウト株式会社／成果改善支援部／部長

日本全国の中小・ベンチャー企業が抱えるさまざまなマーケティング上の課題解決を目指すWebマーケティング支援企業ソウルドアウト所属。リスティング広告のコンサルタントを7年間経験後、2014年より現職。"結果を出す"にこだわりランディングページやWebページの制作する成果改善支援部の部長として、見栄え的に良いランディングページを制作するだけでなく、ユーザー理解や市場調査と組み合わせて考える事で、ランディングページの成果向上を日々目指す。Webマーケティングノウハウメディア「LISKUL」などをはじめ執筆実績多数。

成果に繋がるランディングページの作り方

かいせつ先輩

前述の一般的なランディングページの構成要素である７つの項目について、ひとつひとつ寺島先生の解説をご紹介します。

1.ファーストビュー

寺島先生：具体的なランディングページのポイントを、ひとつずつパーツを分けてご説明します。

まず、「ファーストビュー」ですけれども、そもそもファーストビューとはどこを指すかといいますと、ユーザーがサイトにアクセスして、パッと見た時に目に見える範囲のことを指します。ノートパソコンですと、色々サイズが出てきていますので異なるんですけども、目安としては、デスクトップの場合は、1024×768というのがサイズの目安になっています。

ここがやっぱり一番目につくポイントとして、一番印象に残るので、ここでどれだけ興味を引けるかとか、共感を得られるかっていうのが大事なポイントになってきます。

一番最初は、キャッチコピーですね。ターゲットのニーズの核を突くと記載しておりますが、書いてあると「なるほど、簡単だよね」と思うんですけれども、ここがなかなか難しくてですね。先ほど少しお話させていただきました「USP」＝ユニーク・セリング・ポイントですね。他社と比較して、自分のサイトはどこで勝っていくのかというポイントをきちんと見極めて、大きく記載することが重要です。

大きく書くっていうのが幼稚なように見えて大事でして、紙よりもWebは、可読率っていうユーザーが読む率っていうのが、25％減るといわれておりまして、紙よりもかなり読みやすくする必要があります。

ページの中では、ここが一番大きくなってもいいくらいですね。文字の配置は、左寄せにしてください。なんで左寄せかっていうと、人の視線は左から右に動く修正があるので、一番最初に目につくのが左です。なので、文字ではなく何か写真で必ず喚起したいものがあれば、それを左寄せにするといいと思います。大体、言葉で訴求することが多いと思うので、「左寄せに」という風に書かせていただいてますね。あとは、「短く簡潔に」っていうのは、紙よりも可読性が下がりますので、それに合わせた形でわかりやすく記載してください。

受講生代表：「文字を大きく」ってありましたけど、あまり大きすぎても目立ちすぎちゃうんですかね？

寺島先生：どれくらい目立たせたいかにもよるんですけど、「これで他社よりも絶対に勝てるポイントがある」ということであれば、それだけが書いてあってもいいくらい目立たせてもいいかもしれないですね。

受講生代表：そうなんですね。覚えておきます。

寺島先生：続いてなんですけれども、ビジュアルの部分で権威付けをきちんとしましょう。メインビジュアルって、ユーザーの気を引く重要なポイントになりますので、ページで謳える要素がある場合は必ず盛り込むようにしてください。

よく見かけると思うんですけども、「＠コスメでNo.１でした」とか、「リピート率99％です」とか、そういった何か訴求できるNo.１とか、パーセンテージが大きいものをぜひ使ってみてください。

ポイントとしては、王冠とかメダルとか、パッと見た時にすごそうだっていうのがわかりやすいものを使うのがポイントなのと、あとは具体的に数字を使えるものがあれば、数字で訴求するようにしてください。実績があれば、さっきお話しした通り、「No.１」とか「満足度90％」とか、こういったところを具体的に載せてください。メディア掲載実績があれば「これは何に載りましたよ」とか、「誰々さんが使ってます」っていうのは信頼性につながりますのでぜひ記載してください。知名度の高いロゴなどで載せられるものがあれば、これもぜひ載せてください。

よく転職サイトとかで、「こんなにすごい会社に転職しました」みたいな、大手さんのロゴがページの中に記載されているケースがあるかと思うんですけれども、ああいうのも信頼性とか安心感につながりますので、そういった権威付けができる場合は、ぜひお試しいただければと思います。

2.アクション導線

続いては、アクション導線の部分ですね。ここ、結構サラッとボタンひとつで、「資料請求はこちら」とか「申し込みはこちら」とか、済ませてしまう人も多いんじゃないかと思うんですけれども、結構重要でして。アクション導線っていうのは、一番申し込みに近いパーツなんですね。なので、ここできちんとユーザーのモチベーションを上げたりですとか、不安を払しょくしてあげるということができると、コンバージョンレートは上がりやすくなりますね。

ポイントとしては、まずひとつ目は、ファーストビューに入れ込むというのがあります。すでにサービスを知っていて、申し込みだけをしに来た人もなかにはいますので、そういう人をまず取りこぼさないように、入ってきた瞬間に導線がわかるように設置するっていうのはとても重要なことになります。

あとは、クリックできるかどうかが、見た目できちんとわかるようにする。たとえばこの場合ですと、ボタンがちょっと浮いて見えるような形になっていて、クリックできるパーツなんだなというのがわかるかと思うんですけれども、ただただ真っ平にしていると、ユーザーがわかりづらかったりするので、“ここはボタンである”ということが明確に見えるようにしましょう。

あとは、申し込みへの心理的ハードルが下がる文言を入れるということですね。たとえば「入力は簡単1分」とか、時間的落差を想起させるような文言を入れたり、「無料」っていう文言を入れて気持ちのハードルを下げるということが重要ですね。

期限を設けて焦らせてみるというのも、有効です。たとえばうちですと、「限定5社」と謳っているので、「もしかしたらなくなってしまうかもしれない」とか、そういったような気持ちにさせる感じですかね。

あとは、背景を鑑みて、目立つ色を使うようにしてみてください。水色背景に青いボタンですと、やっぱりちょっと同系色になってしまいますので、目立ちにくかったりしますね。なので、なるべく反対色に近い色だったり、目立つようなことっていうのを考えてみてください。

3．ベネフィットの伝わる商品説明

次のポイントとしましては、「商品説明」なんですが、ここが「ユーザーベネフィットが伝わる情報を」というような形で記載しています。ここすごく重要です。なので、ちょっと細かくご説明させていただきますね。

ユーザーのベネフィットなんですけれども、ベネフィットというのはメリットではなくて、まあメリットなんでしょうけれど。「これを利用すれば自分にとってこんなに」っていうことがイメージできるように仕向けることがとっても重要です。

たとえばなんですけれども、ここに記載させていただいている例「美容液成分90％配合」というのをよく見かけられるんじゃないかなと思います。これはこれでメリットだとは思うんですけども、その美容液成分が90％配合されていることによって、ユーザーが得られるものって何だろうということを考えていただきたいなと思っています。これの場合は、「朝付けて夜までしっとりが続く」という風になると、ユーザーのメリットが明確に伝わるんじゃないかなと思います。

他にも例を挙げさせていただくと、掃除機とかで「スゴイ特許を取得しました」と書いてあっても、それが自分に対してどうやって返ってくるかとか、どういうメリットがあるかとかわかりづらかったりするので、「99％ホコリが除去できますよ」といわれると、「すごそうだな」とわかっていただけるんじゃないかと思います。

受講生代表：具体的なメリットが一瞬でわかると「欲しいな」って思ったりするかもしれないですね。

寺島先生：企業側が伝えたいメリットというのが、言葉にしたときにユーザーにきちんと価値として伝わっているかどうかを考えていただくっていうのが、重要かなと思います。

ポイントとしては、そのままなんですけれども、「ベネフィットを提示する」っていうところをわかりやすく３～５個くらいにまとめるのが重要ですね。この時に、箇条書きにすると読みやすくなりますので、ぜひ文章で長々と書くのではなく、あまり文字の塊にならないようにユーザーの読みやすさに気を付けて書いていただければと思います。

4.利用者の声

寺島先生：「利用者の声、信憑性のある口コミでプラスの印象を」ということですけれども、これもネットのページではよく見られるパーツだと思います。説得要素のひとつが第三者の口コミになってくるんですね。信憑性があればあるほど、ターゲットに良い印象を与えます。

まずうちの場合ですと、「具体的な数字を載せることで信憑性を上げますよ」とか、うちの場合は実写真ないんですけれども、「利用者の写真を載せることで信憑性を増しますよ」と。年齢とか住所とか居住地とか、本人に関する情報を載せるっていうのも有効です。見出しが名前とか、年齢とか、住所になっているものが記載されているページって多いんですけれども、ここはせっかくなので、見出しは一番印象深い言葉を選んで、一番大きく載せてみてもらえればなと思ってます。

ポイントとしては、補足なんですけれども、実写真とかの情報って、載せられるもの、載せられないものがあると思うので、イメージ画像でも構いません。個人名とか企業名とかが難しい場合は、イニシャルでも構いません。とにかくリアリティが感じられる文章を凝らすことが重要なんですね。ここの目的としては、自分と近しい人、ユーザーと近しい人をユーザーボイスに載せることで、「自分と近しい悩みを持った、自分と近しい年齢のこの人が悩みを解決できたのであれば、自分もきっと悩みを解決できそうだな」とか、共感を得ることが一番の狙いになってくると思いますので、そういったような使い方を心掛けていただければいいんじゃないかなと思います。

5.実施の流れ

「実施の流れ」のパーツですね。ここは、事前に手順を提示して安心させることが必要です。たとえば、まあ資料請求くらいのライトなものであれば必要ないかと思うんですけれども、何か申し込みをしたりとか何か購入したりとかっていう時に、サービスが自分に届くまでどのくらいかかるのか、自分がこれからどういうアクションをしなければいけないのか、そういったところを事前に提示するとユーザーは安心して、購入に進むことができます。工程がいくつかある場合は、わかりやすい図を用いるとわかりやすくなりますね。

あとは、各工程でどういうことをすればいいのかっていうのを明記することもいいかと思います。最後に各工程でどれくらいの時間がかかるのかを記載しておくと、ユーザーの中で心構えができますので、いいかと思います。

6.FAQ

続きまして、「FAQ」ですね。FAQについてなんですけど、ここではユーザーの不安や疑問点をすべて解決してあげるというのが狙いになります。不安や疑問に対して明確に回答するとか、あとはよく寄せられるであろう質問項目を最初からここに記載しておくこと。質問に対する回答でプラスの印象を与えるということが重要ですね。

FAQのパーツでの目的というのは、もちろんユーザーの質問に回答してあげることになるんですけど、もうひとつ考えていただきたいのが、やっぱりユーザーって最後まで読み込んでいいなと思っても、気になることがあるとまた別のところで調べるために離脱してしまったりとかするので、なるべく改めて調べるとかそういったことがないようにこのページ上で解決してあげることが、コンバージョンレートを高めることにつながるかなと思います。

7.＋α　フォーム

パーツの説明としては、ここで最後になるんですけれども、フォームで簡単に入力をできる工夫を凝らすことが重要です。フォームは、ユーザーに一番ストレスがかかる項目になりますので、いかに簡単に短くできるかというのは、重要なポイントになってきます。

ここで、後から電話かけて聞くのでなるべく情報を知っておきたいとか、そういう考えがあって、モリモリと質問項目を入れたりするフォームがあるんですけど、入力フォームは最小限まで減らした方がユーザーの負担は軽くて済みます。入力も必須なのか、任意なのかを明確にわかるように記載しておくようにしましょう。

入力ボックスには、記入例を用意しておくとユーザーが迷いづらいので良いかと思います。入力エラーはリアルタイムに表示するとか、入力中の項目は色を変えるとか、こういったところも重要ですね。エラーとか、入力項目の色を変えるっていうのは、色々ツールとかも出てますので、そういったものを導入してもいいんじゃないかと思います。

フォームのところについての補足になるんですけども、商品購入とか会員登録とか費用見積もりとか、そういったフォームをユーザーに記入してもらう必要がある場合は、別のページに遷移させずに、ランディングページ内にフォームを入れ込むだけでも成果が上がるっていうことがありますので、こういった工夫も是非してみてください。