ホームページ

ランディングページのデザインのコツ!重要なことは○○だった!

ランディングページを作ろうとしたときに、

・どうやったら成約率のいいサイトができるのか

・どんなサイトだったら見てもらうことができるのか

・他のサイトをマネしてもうまくいかない

など、悩みは尽きませんよね。

せっかく作るのであれば、きちんと成果を出したいと考えると思います。

成果を出すために重要なことは、ペルソナの設定と目的をしっかりと決めることです。

どうしてこの2点が大事なのでしょうか。

そのほかの大切なことは何があるのでしょうか。

この記事を読んでいただければ、ランディングページを作ることのハードルが下がります。

ぜひ参考にしてみてください。

ランディングページとは?

LP

そもそもランディングページとは、検索結果の画面や広告などをクリックして、最初に出てくるwebページ全般のことを言います。

広い意味でランディングページを考えた場合、ホームページなども含まれてきます。

しかし今回ご紹介するランディングページとは、もっと狭い意味のランディングページのことで、縦長のサイトのことを指し、サイトに来てくださった訪問者がアクションを起こしていくためのサイトのことです。

アクションとは、商品を購入したり、応募や申し込みなど、何かしらの契約を行うことを言います。

そのためランディングページでは、訪問者がアクションを起こしやすい環境を提供していくことが大事になります。

ホームページとの違い

PC 画面

ホームページとの大きな違いは、訪問者の動きです。

ホームページでは、いろんなページを見てもらい、さまざまな情報を提供していくことが多いのですが、ランディングページでは上から下に流れるように見てもらうことが大切になります。

そして最終的にアクションに繋げていくのです。

つまり、ランディングページでは、いかに上から下へうまく誘導していけるかが大事となってきます。

ランディングページを作る上で大事なこと

+と手

ランディングページを作る上で大事なことは、

・この商品を提供した場合、どのような結果を得ることができるか

・どうしてその結果を得ることができるのか

の2点を説明することです。

ただ漠然と、その商品の良さを説明したからといって、訪問者は関心をもってくれないからです。

この結果と理由が明確にわかることで、訪問者は共感してくれて、アクションを起こしてくれます。この結果が、自分に必要だと思ってもらえなければ意味がありません。

例えば、痩せている人に、どんなに良いダイエットサプリを進めても買ってくれることはないでしょう。

つまり、必要な人に必要な価値を提供することが大事なのです。

そのためにもランディングページを作る前に、まず考えないといけないもっとも大事なことをお伝えします。

ペルソナ設定

「 このランディングページは誰に向けて作るのか 」をまず考えましょう。

この「 誰に 」について考えることを、ペルソナを設定すると言います。

このペルソナは、細かく設定するほど、適切な情報を提供していけるようになるため、できるだけ細かく設定します。

・年齢

・性別

・住まい

・職業

・家族構成

など、できる限り細かく設定することで、ランディングページが作りやすくなってきます。

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

ペルソナが決まれば、次は目的です。

「 何を届けるためのランディングページなのか 」ということです。

ここが定まっていないと、いくら細かくペルソナを設定しても、届けたい情報があやふやになってしまいます。

しっかりとランディングページの目的を決めていきましょう。

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

ペルソナの設定と目的が決まれば、後はその目的に向かっての流れを作ってあげるだけです。

どうすれば、訪問者は目的まで達成してもらうことができるのか、ということを常に頭の中で考えながら作っていきます。

順番に確認していきましょう。

キャッチコピーを作る

簡潔に伝えたいことを表現することができるので、キャッチコピーは大切です。

検索キーワードを意識しがら、考えていきましょう。

またこのとき、専門用語などの難しい言葉を使うと、訪問者に伝わらないため、わかりやすい言葉を意識します。

例えば、かっぱえびせんのキャッチコピーは「 やめられない とまらない カルビー かっぱえびせん 」です。

一度は耳にした方も多く、メロディーまで頭に浮かんでくる人もいるでしょう。

このキャッチコピーを聞くだけで、とまらないぐらい美味しいだろうなと伝えることができますし、子供でもわかるような簡単な言葉でできています。

このように簡単な言葉で魅力を伝えられるものがおすすめです。

読者の共感部分を作る

訪問してくれた人は、商品に興味を持って訪問してくれています。

しかし、サイト内で共感部分が少ないと、思っていたのと違ったと感じ、サイトを離れてしまいます。

そうならないためにも、商品について共感できる部分はたくさん作っておきましょう。

例えば、売りたい商品が栄養ドリンクだとします。

このとき共感部分として考えられることは

・からだが疲れている、だるい

・朝起きた瞬間から疲れている

・疲れが溜まってやる気が起きない

・今すぐ取りたいからだの疲れがある

・頑張らないといけないのに元気がでない

など、実際に栄養ドリンクを必要としている人が、どのような状況にあるのかを想像しましょう。

ここに当てはまる人は、共感してくれますし、これを解決するにはどうしたらいいのかと関心を持ってくれるようになります。

そしてここで活躍していくのが、最初に決めたペルソナの設定です。

細かくペルソナを設定しているので、共感部分も浮かんできやすくなります。

もしぶれてしまうのであれば、しっかりとペルソナを設定し直しましょう。

紹介した商品を提示する

共感部分を作ったら、商品をアピールしていきます。

文字だけで説明しても、伝わることには限界があります。写真や動画など、視覚からの情報も活用しながら商品について書いていきましょう。

商品の説明文を書く

商品についてアピールするときは、写真などに合った説明文を載せていくようにします。

言いたいことをただ並べるだけでは、写真などと合わなくなることもあります。

全体を見ながら、違和感がないか確認しながら説明してきましょう。

アクション導線をつくる

アクション導線とは、サイトの訪問者が自分の意思で購入を決めてもらえるように、流れを作っていくことです。

「 買って 」というアピールばかりをするのではなく、訪問者自らが「 買いたいな 」と思うように持っていくのです。

例えば、商品の魅力を順番にアピールしていくのはどうでしょうか?

売りたい商品がダイエットサプリだった場合、ダイエットはもちろんおすすめのポイントだと思いますが、それ以外のおすすめポイントを順番に紹介していきます。

・美肌成分が入っている

・不足しがちな栄養が入っている

など、プラスαの魅力があると、訪問者は「 そんなことも解決していけるのか 」と思ってくれます。

その感情が募っていくと、「 買いたい 」という気持ちに変わってくると思います。

今一度、自分なら、この商品のどこを見て買いたいと思うのか考えてみてください。

そこがアピールポイントになっていくかもしれません。

そうすることで、最後の入力フォームですんなりと入力してもらえますし、目的を達成することができるのです。

もちろんこのアクション導線は、上から下に流れるように作っていくことが大事です。

一番力を入れるのは「 ファーストビュー 」

PC画面

サイトを訪れて、1番最初に目につくのが、ファーストビューと呼ばれるサイトの最初の画像です。

ここの画像を見て、この先を読むかどうか決める人が多いため、すごく大切な画像となっています。

ただ目立てばいいというわけではなく、先ほど決めたペルソナが目的に向かって進んでもらえるような画像となっているかがポイントです。

関係のない画像を使っても意味がありません。

しっかりと届けていきたい内容を簡潔にまとめるようにしましょう。

キャッチコピー

わかりやすく訪問者に届くような言葉を簡潔に表現します。

ここには検索キーワードが入っていると、なおいいでしょう。

インパクトのある、伝わりやすい言葉を選んで作ってみてください。

例えば、イナバ物置の「 やっぱりイナバ、100人乗っても大丈夫 」のキャッチコピーは、100人という人数にインパクトがあります。

耐久性のアピールもしっかりできますし、インパクトがあるため、覚えやすいと感じる方は多いのではないでしょうか。

メインビジュアル

メインビジュアルは、インパクトがあるだけではなく、訪問者に関係がある写真を使うと、自分と当てはめて考えてもらいやすくなります。

そうすることで、次が見たいと思ってもらいやすくなるのです。

商品とペルソナに関係のある画像を用意しましょう。

キャッチコピーでも例にあげたイナバ物置で考えた場合、実際に100人乗った画像を提供し、耐久性を証明しています。

物置に実際に乗る方はいないですが、雪の多い地域など、耐久性を求めている方には、「 探していた耐久性のある物置だ 」とアピールすることができます。

その他のビジュアル

ごちゃごちゃするような写真などは不必要です。

しかし、伝えたいことを簡潔にまとめたものを使うと、訪問者に伝わりやすくなります。

実績やお客様の声など、信用に繋がる部分をアピールするのもいいと思います。

成約の決め手となる入力フォームのデザイン方法

ウェブデザイン

この入力フォームは、最後に訪問者がアクションを起こしてくれるところです。

ここで、面倒くさいと感じたりすると目的にたどり着くことができません。

以下のことに注意しながら、入力フォームを作ってみてください。

必要な項目のみ入力してもらう

入力する項目が多いと、面倒くさいと感じたり、こんなに入力するならやめておこうと思われてしまいます。

訪問者の手間を1つでも省くためにも、入力する項目は1つでも減らしていくようにしましょう。

また入力する際、項目を細かく分けすぎてしまうことも、面倒くささを感じる要因になってしまいます。

簡潔に、かつ簡単に入力できるように工夫しましょう。

倫理的な順番で入力してもらう

タイピング

倫理的というと難しく感じますが、人が抵抗なく入力しやすいような順番を心掛けるということです。

個人情報を入力するときに、いきなり住所から入力するところはあまりないですよね?

名前から入力していくものがほとんどだと思います。

一般的な入力フォームに沿ったもののほうが、抵抗なく入力してもらえやすくなります。

自己紹介のような流れに沿って入力フォームを作っていくといいでしょう。

必須か任意かわかるように表示する

入力フォームには必須のものと、任意のものがわかるように表示するといいでしょう。

そうすることで、面倒くさい方、ここまで入力したくない方のサイトの離脱を抑えることができます。

最低限の情報だけでも入力してもらえたOK!というように考えていきましょう。

記入例を明記しておく

入力するところに、記入例を表記しておくと、スムーズに入力しやすくなります。

少しの違いですが、訪問者がアクションを起こしやすくなるので、ぜひ取り入れてみてください。

送信ボタンのテキストは意思表示にする

入力がすべて終わったときにクリックするボタンですが、「 送信 」と書くのではなく、「 この内容で申し込む 」のように、訪問者に決めてもらうような表示にします。

最後の最後まで、自分で考えて選んで購入したと思ってもらうことで、満足感もアップします。

ベネフィットを提示する

積み木で橋を作る人

ベネフィットとは、この商品を買ったことで得られる利益のことです。

例えば、痩せるといわれているダイエットサプリを飲んで、実際に痩せたとします。

このサプリにとってのベネフィットは痩せるということです。

つまり、この商品を買うことによって得ることのできるいい未来がベネフィットと考えることができます。

サイトでは、このベネフィットがわかるように表記していきましょう。

そうすることで、さらに商品に対して、興味や関心を持ってもらうことができます。

また自分もそのベネフィットを得たいと思ってもらいやすくなります。

視覚を刺激する

ウェブデザイン

文字ばかりだと飽きられてしまったり、情報が多すぎて理解されなかったりするので、グラフなどを使いながら、情報をうまく伝える必要があります。

また色使いなどにも工夫することで、読みやすさも違っていき、アクションを起こしてもらいやすくなります。

グラフを利用

グラフは一目見ただけで情報を伝達することができ、印象にも残りやすいため、活用することがおすすめです。

さまざまなグラフがあるため、伝えたい情報に合わせて、グラフの形を選ぶようにしましょう。

・円グラフ…100%中の構成比を表すときに用います。

特に目立たせた項目があれば、それを協調するように作るとさらにわかりやすくなります。

・棒グラフ…前後の比較に利用します。

前後で強弱をつけると目立ちやすくなります。

・比較表… 競合店と比較したり、サービスの違いを表現するとわかりやすいです。

たくさんのものを比較すると、伝えたいことが伝わらなくなるので、主要なことのみ記載します。

自社の商品が目立つように記載しましょう。

色味の統一

絵具と筆

色味が統一されずに、たくさんの色が使われていると、ごちゃごちゃとしたサイトに見えてしまったり、目立たせたい情報が目立たなくなります。

できるだけサイトのカラーを決めて、統一感を持たせることが心掛けましょう。

また目立たせたいところは、サイトカラーの補色の色を使うと効果的です。

補色とは、色相環という色のグラフで、正反対の位置にある色のことで、この色が1番お互いを目立たせることができると言われています。

レイアウトの工夫

サイトカラーが統一されているため、レイアウトに変化をもたらさないと、わかりずらい印象になってしまいます。

上から順番に読んでいく中で、変化をもたらせたほうがいいところなど、前後のコンテンツと比較しながら、レイアウトにも変化をもたらせることです。

そうすることで、わかりやすく、飽きることなく読み進めていくことができます。

想定される質問は先に提示して解決する

SOLUTIONを取る人

よくある質問などは、先に書いてサイト内で解決したほうが、訪問者が目的まで行きやすくなります。

小さな疑問を抱えることによって、サイトを離れることや面倒くささを感じたり、不安の原因になったりします。

先に解決できるところはすべて解決しておきましょう。

こういったところまで気を遣うことで、信用を得られやすくなります。

例えば、美容サプリの「 リブランコート 」という商品の公式サイトには、よくある質問という項目があります。

そこには

・他の美容サプリとの違いは?

・1日何粒飲めばいいですか?

・毎日飲まないといけないですか?

・成分の安全性に問題ないですか?

など、いくつかの質問が掲載されており、返答も載っています。

公式サイトを読んだだけではわかりにくいことに答えていくと、安心してもらえ

やすくなります。

実際の声を掲載して信用を獲得していく

握手を交わす二人

人は疑いをもってサイトを見ています。

・本当にこんな結果を得ることができるのだろうか?

・私も同じ結果が手に入るのだろうか?

など、さまざまな疑問があります。

そこで実際の声を掲載していくことで、疑いから信用に変えていきます。

これをもっとも身近で体験しているのが通販サイトです。

気に入った商品が見つかったとき、口コミで最終判断することはないですか?

それまで気に入ってても、口コミが悪かったら、購入を辞めてしまったりすることもあると思います。

それほど、人は実際の声を信用します。

ランディングページでも実際の声を掲載していき、信用を積み上げていきましょう。

まとめ

LP サイト画面

いかがでしょうか。

ペルソナと目的を設定することができたら、後はいかに満足してもらえるかを考えながら作っていきます。

デザインに関しても、見やすさ、わかりやすさを重視していき、アクションが下に流れやすくなるように意識していきます。

常にサイトを訪問してくださったお客様目線です。

そうすることで、他社との差別化にも繋がり、目的を達成しやすくなります。

今新型コロナウイルスの影響により、ネットで買い物をする方も多くなってきていますし、企業自体もたくさん参入してきています。

ここでどれだけ他社との違いを生み出すことができるかが大事となってきます。

ランディングページを作る際は、ぜひ参考にしてみてください。

Her'sにお任せください!

Webコンサル

Web集客に特化した弊社には優秀なエンジニアやマーケターが多く在籍しているためHP/LP製作、広告、コンサルを1社で完結させることができます!

Wantedly運用代行

Her'sには「WEBx採用」に特化したWebマーケターが多く在籍し、Wantedlyの運用を行っています。会社ランキング6位になった実績を持つ弊社が責任を持って運用します!

MEO対策

MEO対策は、SEO対策より短期間で上位表示が可能で集客効果が高いです。費用もリーズナブルですのでぜひHer'sにお任せください!

            お問い合わせはこちら

Her'sにお任せください!

Webコンサル

Web集客に特化した弊社には優秀なエンジニアやマーケターが多く在籍しているためHP/LP製作、広告、コンサルを1社で完結させることができます!

Wantedly運用代行

Her'sには「WEBx採用」に特化したWebマーケターが多く在籍し、Wantedlyの運用を行っています。会社ランキング6位になった実績を持つ弊社が責任を持って運用します!

MEO対策

MEO対策は、SEO対策より短期間で上位表示が可能で集客効果が高いです。費用もリーズナブルですのでぜひHer'sにお任せください!

お問い合わせはこちら


Facebook


Twitter


LINE


はてなブログ


RSS