LP(ランディングページ)の作り方が分からない。


どうせ作るならおしゃれなデザインのLPを作りたい。


売上の上がるLPを作りたい。

 

 

僕がデザイン会社に転職して、最初にLP作成を任された時、このような悩みを抱えていました。



どのような準備をして、どんな手順で作業を進めていけばよいんだろう?
手探りで作成してみたものの、ダメ出しをされ、何度も作業の手直しを繰り返しました。
せっかく作ったLPも全く成果が出ず、悩む日々が続きました。



あなたも同じような悩みを抱えてはいないでしょうか?
でも安心してください。

現在では数多くのLP制作に携わっている僕が、効率よくおしゃれなLPを作るコツを説明していきます。


LPの具体的な作成方法がすぐに知りたいって人は、ここから(ページ内アンカーリンク)読み始めてください。

 

LP(ランディングページ)とは?

疑問を持つ女性

 

LP(ランディングページ)とは、(検索エンジンや広告などから訪問してくれた)見込み客を購入や申し込みなどのゴールへと導くためのウェブページです。
あなたも一度は見たことがあるであろう、縦に長い例のあれです。



1ページ内で商品の魅力を伝えて、購入(申し込み)までのアクションを起こさせなければいけないので、どうしても縦に長くなってしまいます。
LP(エルピー)という略称で呼ばれることが多いです。
 

LP(ランディングページ)作成前の準備

チェックリスト
 
LPを作成する前の事前準備として以下のような作業があります。

目的をしっかり把握しているか?

LPを作成する以上、必ずそこには目的(ゴール)が存在するはずです。
その目的が会員登録なのか?商品購入なのか?資料請求なのか?まずはしっかりと把握するようにしましょう。

ターゲット(顧客)を明確にする

あなたの商品を必要としている人を明確にしましょう。
ターゲットを定めないまま、作成に取り掛かっても、成果の出るLPを作れることはまずありません。

ターゲットが「どんな悩みを抱えているのか?」「その悩みに対してどのようなワードで検索したのか?」「どう解決したいと思っているのか?」
などを把握しましょう。


場合によっては具体的なペルソナを設定しても良いでしょう。
ペルソナとは、商品・サービスを利用する顧客の中で最も重要な人物モデルのことです。

ペルソナの例をあげましょう。
ここまで具体的に設定することになります。
 
荒木三郎
45歳
男性
営業職
都内に住む
妻、長女(15歳)、長男(12歳)両親と同居の6人家族
寺社仏閣巡り、筋トレが趣味
Instagramやツイッターでお寺、神社系のアカウントを日頃チェックしている
自身でも筋トレブログを開設
プロテインの情報収集には余念がない

 

LPは作成した後、何度も修正を繰り返す必要があることが一般的。
その際にペルソナの目線でLPを見直します。

 

ペルソナの荒木さんならどう思うだろうか?
ちょっと押しが強いと思ってページを閉じちゃうかも?
あるいは逆に興味を惹かれて読み進めていくだろうか

 

など、様々なことが見えてくると思います。
これは正にペルソナが設定されているからだといえるでしょう。

LP(ランディングページ)の構成を決める

LP

ファーストビューに盛り込む要素を決める

ファーストビューとは、Webサイトにおいてユーザーが訪れた際に最初に目に入る部分のことです。
ユーザーはファーストビューを見て「役に立たない」と判断したら、即座にサイトを閉じます。判断する時間は平均約3秒と言われています。

ファーストビューでいかにユーザーの心を掴むことができるか?

これが成果を出せるLP(ランディングページ)を作れるか否かのカギを握っているといっても過言ではありません。
それではファーストビューにはどのような要素を盛り込めば良いのでしょうか?
 
 
まずはこの順番でファーストビューのワイヤーフレームを作ってみてください。
 
  1. キャッチコピーを決める
    ユーザーの心を射止めるキャッチコピーを作成してください。
    ユーザーの悩みを解決に導き、且つあなたの商品を端的に表現するものがベストです。
     
  2. メイン画像を決める
    商品のイメージとマッチした、ユーザーの目を惹く画像を選びましょう
     
  3. 権威付けを挿入する
    初めてみる商品やサービスなどには誰しも警戒してしまうもの。
    ユーザーの警戒感を解き、信頼感を引き出すテキストなどを挿入しましょう。
    例としては「会員数〇万人突破」とか「〇〇(雑誌など)に紹介されました」「○○(著名人)も愛用」などです。
     
  4. アクションボタン
    アクションボタンとは、サッカーで言えばゴールポスト。
    目的を達する為に設置するお申し込みフォームなどのボタンとなります。
    LPでアクションボタンを複数設置するのが一般的ですが、ファーストビューでひとつは設置しておきたいところです。
     
  5. ロゴ、メニューなど
    キャッチコピーや権威づけにばかり目が行きがちですが「そもそもあんた誰?」みたいなことにならないように、きちんと何者なのかを名乗っておく必要があります。
    ロゴやメニューなどで、サイト名や商品名をしっかり明記するようにしましょう。

ボディに盛り込む要素を決める

ファーストビューに続くのがボディになります。
LPで最も大きな面積を占めることになり、アクションボタンも適宜設置することになります。
 
 
上の画像はボディ部分の一例です。
次にこのような順番でファーストビューのワイヤーフレームを作りましょう。
 
  1. 導入部分でユーザーの関心を喚起させる
    まずはつかみの導入部分です。
    ここでユーザーの悩みに寄り添って、困っていることに共感するようなテキストで、関心を高めていきましょう。
     
  2. メリットを伝える商品説明を
    商品説明では、その商品を利用することでいかにユーザーに利益をもたらすか、悩みが解決できるかを盛り込んでいきましょう。
    ユーザー目線で説明文(テキスト)を考えるのがポイントです。
     
  3. 利用者の声
    ここまで読み進めてくれたユーザーは、徐々に商品への興味が高まってきているはずです。
    もう一押ししてゴールへと導いていきましょう。
    実際に利用してみた人の評価(口コミ)はやっぱり気になりますよね?
     
  4. よくある質問
    商品説明で解消できなかった疑問や不明点をここで全て解消してしまいましょう。
    回答はポジティブな内容で、明確に回答するようにしましょう。

効果的なCTAでCVを高めよう

 
LPの最下部まで読んでくれたユーザーは、恐らくかなり購入に前向きになっているはずです。
しっかりとクロージングすることで、CV率は高まります。

最下部に設置するのは、一般的にはアクションボタンやエントリーフォームとなります。
入力フォームは、可能な限り最低限に絞り、ユーザーの煩わしさを軽減させることも心掛けましょう。
記入例を設けたり、入力エラーはリアルタイムにお知らせするなど、工夫を凝らしユーザーのストレスを最大限に軽減させることが重要です。

入力を何度もやり直ししてくれるほど、ユーザーは辛坊強くありません。
入力フォームで離脱してしまうことも大いにあるということを認識しましょう。

LP(ランディングページ)作成の際に気をつけたい5つのこと

5
 
  1. ユーザーの信頼を獲得しよう
    せっかくサイトに訪れてくれたユーザーも「何か怪しい」と少しでも感じたらすぐにサイトを離脱してしまします。
    ユーザーの信頼を獲得する為にも、まずはあなたが何者なのかを知ってもらう必要があります。
    会社概要や自社の業務内容などのコンテンツを目につく場所やアクセスしやすい場所に設置すべきです。
     
  2. 分かりやすい構成に
    ユーザーがぱっと見て分かりやすい内容にして、要点を簡潔に伝えるようにしましょう。
    見出しで区切る、箇条書きを用いる、行間を工夫する、フォントサイズなどに気を配り、内容を見やすく整理しましょう。
     
  3. コンテンツの流れにストーリー性を
    LP(ランディングページ)は縦に長いページ構成です。
    読み進めるにつれて商品に興味を持たせることが不可欠となります。
    その為にはユーザーがページを見てどのような感情を持つのかを意識して、コンテンツの順番や構成などを組み立てていくことが重要です。
    コンテンツの流れにストーリー性(起承転結)を持たせることで、ページから離脱せずに読み進めてもらうこと確率が高まります。
     
  4. 見やすいデザインに
    ユーザーにストレスのかからない見やすいデザインにしましょう。
    いくら構成が優れていてもデザインの悪いサイトは、ゴールまでユーザーを導くことはできません。(逆もまた然りです)
    構成とデザイン共に優れているLP(ランディングページ)を作成することを心がけましょう。
     
  5. テストで何度も改良を繰り返す
    LP(ランディングページ)は作って終わりではありません。
    例えばヒートマップなどの分析ツールを使って、ユーザーが離脱した場所が特定出来たら、その原因の究明して修正を繰り返すことが必要です。
    ここでは詳しく触れませんが、A/Bテストなども有効です。

どうせならおしゃれなLP(ランディングページ)を作りたい

 
おしゃれなLP(ランディングページ)を作りたい。
でもどうデザインしていいか分からない・・

そんな時はおしゃれなLP(ランディングページ)を紹介しているギャラリーサイトを見てみましょう。
良質なLPをいくつも見ることは、デザインのアイディアが閃いたり、構成やキャッチコピーの参考にもなります。

また数多くのLPを目にすることで、今はやりのデザインや構成の法則性が見えてくることもあります。
おしゃれなLP(ランディングページ)の参考になるギャラリーサイトを紹介しましょう。
 

ランディングページ集めました

 
http://lp-web.com/

サイト名通り、様々なLP(ランディングページ)を集めたサイトです。
2009年より運営しているということもあり、掲載サイト数が多いですが、2020年2月以降の新規掲載はなくなっています。

LPアーカイブ

LPアーカイブ
 
20,000件近くの掲載サイト数の多さと、カラーやカテゴリーなどだけじゃなく「爽やか系」などイメージから検索できるのも便利。
サインインすることでお気に入り機能を活用することもできます。

イケてるランディングページデザインまとめ

イケてるランディングページデザインまとめ
 
 
LP制作会社のギャラリーサイトです。
カラー、イメージ、ジャンルから検索が可。
最近は更新メンテがなされていないみたいで、リンク切れやサイトの追加などがない点が残念。

LANDING PAGE BOOKMARK

LANDING PAGE BOOKMARK
 
 
こちらは色やイメージではなく、タグで絞り込みが可能です。
例えば「しょうが」とか「発毛」などで検索できます。全体的には健康・美容系のサイトが多い印象です。

Web Design Clip

Web Design Clip
 
 
メインカラーとサブカラーで検索が可能。
またLPではありませんが、国内や海外のおしゃれなウェブサイトも紹介しています。

LP advance

LP advance
 
 
カラー、タイプ(かわいい、かっこいいなど)、メインビジュアル(人物、テキストなど)の掛け合わせで検索できるのが便利。
またLPのキャッチコピーも見ることができる点でも重宝しそうなサイトです。

Land-book

Landbook
 
 
海外のギャラリーサイトも紹介しておきましょう。
LPごとに閲覧数やお気に入り数などが表示されているので、人気のあるデザインを把握するのに便利です。

SUNDAYPROJECT APPLICATIONS DESIGN ARCHIVE

SUNDAYPROJECT APPLICATIONS DESIGN ARCHIVE
 
 
おしゃれなLPやコーポレートサイトのウェブデザイン集
デザインやカラーで絞り込むことが可能です。

まとめ

まとめ
 
ここまでおしゃれなLPの作り方を解説していきました。

LPは作っておしまいというものではありません。
本当に成果の出るLPを作るには複数のパターンを準備しておいてA/Bテストを繰り返し、修正を繰り返していくことも大事です。
また公開した後にも思ったような効果が出ない場合などは、アクセス解析やヒートマップなどのツールを活用しながら、改善していく運用が求められてきます。

「どうやって商品の魅力を伝えたらいいのかわからない」
「LPを作る技術も時間もない」
「プロにお任せしておしゃれで成果の出るLPを作りたい」

という人はSUNDAYPROJECT APPLICATIONSにお任せください。