ランディングページのデザインのコツは?依頼の仕方や費用相場も紹介

ランディングページは、インターネットで売上げをアップさせるための重要な要素とも言われ、ポイントを押さえたデザインを行うことで売上が大きく変わることもあります。ランディングページのメリットや、デザインのコツを紹介します。

Offers」は、時代の変化や環境にあわせてスキルを磨きたい、そんな人にぴったりのサービスです。「副業・複業」で、本業では経験できない、新しい環境/開発スタイルを経験しよう!

→「Offers」をもっと詳しくみる! かんたん60秒で副業を始めてみる

ランディングページのメリットとは

ネット広告や商品リンクをクリックすると、商品詳細などが書かれた縦長のページにジャンプします。これがランディングページと呼ばれるものです。その必要性や意味を考えてみましょう。

ランディングページの必要性

ランディングページは多くの場合、複雑なリンクがなく縦に長い形式となっており、ページの移動がなく特定のユーザーに最適化した情報を届けるためのツールです。

ランディングページは、実店舗を持たないインターネット販売での『接客』に当たると考えられています。つまり、その商品にニーズのある読者に対して、商品やサービスの説明やメリットを丁寧に説明し、最終的に購買につなげるものなのです。

離脱を回避し訴求力を高める

ランディングページは、広告やリンクをクリックした先にあるページです。長くシンプルなページ構成にすることでページ移動がなく、リンク先も少ないため離脱が少なくなります。

また、ECサイトのように不特定多数のユーザーが流入せず、特定の情報に興味があるユーザーのアクセスが集められるため、より深くてニッチな情報を盛り込むことができるのです。

デザイン面でも制限がほとんどなく、自由にクオリティの高いデザインを作れます。インパクトのある画像やデザインを採用することで、ユーザーに対して訴求力の高いページになるのです。

情報の集約と理想的な順序での伝達

ランディングページでは、商品についてあらゆる面から説明します。商品の便利さを裏付けるデータや、実際に使用している有名人の感想など、ユーザーが知りたいと思う情報がすべて網羅されていると言えるでしょう。

ページそのものがシンプルな構造であるため、それらの情報を理想的な順序で伝えられることも魅力の一つです。

テレビの通販番組などを何気なく見ていて、最初は興味がなかったのに、徐々に引き込まれて最終的には欲しくなったという経験はありませんか?ランディングページを読むことは、インターネット上で、そのような優れた営業トークを聞いているようなものなのです。

情報を正確に伝え、信頼できると思わせ、購入に至らせるのがランディングページの目的です。

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

実際にランディングページを作るにはどのようにしたらよいのでしょうか。『良いランディングページ=集客ができる』という点を念頭において、作り方を紹介します。

ターゲットやゴールを明らかにする

ランディングページは、最終的にユーザーに購入ボタンを押してもらうことなどが目的です。ユーザーが「欲しい」「使ってみたい」「信頼できそう」「買ってみよう」などと思うように、デザインや情報の順序を練らなければなりません。

そのためには、まず商品を売りたいターゲットを明確にしましょう。ターゲットが20代女性であれば、お洒落でかわいいイメージにしたり、ターゲットが40代男性であれば、高級感のあるクールなデザインを考えたりと、ターゲットにあわせてデザインや盛り込む情報を設定していきます。

構成の項目と定義

ランディングページの構成には、主な項目と定義があります。全体の構成の一例としては、以下のようなものが挙げられます。

  • ファーストビュー(キャッチコピー、メイン画像、実績や表彰経験など)
  • 問題提起(共感)
  • 行動喚起・1回目(注文ボタンや入力フォームなど)
  • 商品紹介
  • ベネフィット(ユーザーが商品から得るメリット)
  • 行動喚起・2回目
  • 購入者の声
  • 行動喚起・3回目
  • 実績、○○受賞、○○No.1などの提示
  • 行動喚起・4回目
  • Q&A
  • 行動喚起・5回目

このように、途中に何度も行動喚起、つまり購入ボタンなどを挟みながら、長い1ページが構成されています。何度も行動喚起を挟むことは単純にクリックの機会を増やすだけでなく、購買意欲を掻き立てる狙いもあります。

このようなランディングページの大枠の構成を把握しておきましょう。

参考サイトなどデザイン集をヒントに

ランディングページはデザインの違いで大きく成果が変化するという特徴があります。効果の高いデザインのページを作成するには、成功している事例などを見ながらヒントにするとよいでしょう。参考となるサイトをいくつか紹介します。

『LPアーカイブ』はランディングページをカラーやカテゴリー、雰囲気などの条件で検索できるサイトです。実際のデザインを起こす前に、クライアントへのプレゼンテーションにも活用できるでしょう。

LPアーカイブ

『LP advance』は、ランディングページをカテゴリーやメインビジュアル、タイプなどを掛け合わせて検索可能で、さらにキャッチコピーも検索できるサイトです。コピーで困った時にも参考になるでしょう。

LP advance

ランディングページデザインのコツ

ランディングページはごくわずかな違いで成果が大きく変動します。より効果の大きなランディングページを作るためのコツを押さえておきましょう。

コンバージョンの定義

コンバージョンとは、購入に至った数という認識だけではありません。ランディングページによって最終目的が異なるため、必ずしも購入がコンバージョンとはならないからです。

顧客のどのようなアクションをコンバージョンとするか定義することで、ランディングページ作成の目的をはっきりさせましょう。資料請求、会員登録、予約など、直接利益が発生しない項目であっても、ランディングページのゴールとして定めることができます。

コンバージョンを定義する場合、コンバージョンのハードルの高さと利益創出のバランスがポイントとなります。デザインを考える最初の段階でしっかり考えておきましょう。

ファーストビューやアクション導線

『ファーストビュー』とは、ユーザーがページにアクセスして最初に目にする部分のことです。ランディングページは1ページで作られているため、ページの最上部ということになります。

このファーストビューによってユーザーが離脱するか、読み進めるかが決まります。ユーザーが求めている情報を絞りながら、効率よく掲載することがポイントとなりますので、作成の際は以下の点に注意しましょう。

  • キャッチコピーにニーズに応じた情報を盛り込む
  • 大きな文字で、短くわかりやすいキャッチコピーにする
  • キャッチコピーと連動したメインビジュアルを選ぶ
  • 具体的な数字を入れた権威付け(ランキング1位、○○賞受賞、○○人突破など)

また『アクション導線』についても考慮しましょう。これはユーザーがアクションを起こすように誘導する仕組みであり、購入や入会申込みなどのアクションへ誘導することがねらいです。

ファーストビューで見える範囲に『購入ボタン』や『資料請求ボタン』などを入れるだけでなく、コンテンツの合間にいくつか挟み、色やデザインを工夫して目立たせることが必要となります。

ボタンはクリックできることがわかるデザインにし、お得感や無料お試し、返品可能などの顧客が安心できる一言を入れましょう。キャンペーンなど期限を区切るのも購買意欲につながります。

スマホページの注意点

現代ではWebページの閲覧の50%以上はスマホからといわれており、スマホ版のランディングページのニーズが高まっています。スマホページの注意点は、スマホユーザーの視点で考えるとよく見えてくるでしょう。

PCでページを閲覧するときとの最も大きな違いは、画面サイズです。小さなスマホ画面でも読みやすいよう、文字のサイズや改行を適切に入れるだけでなく、読みやすい文字量の調節が求められます。

また、画面が縦長であることを意識し、必要であれば画像の差し替えなども行いましょう。表示させる画像は大きすぎないものを選択するほか、軽量化されていることが望ましいです。

ランディングページデザインの依頼方法

ランディングページの制作を依頼するにあたって、どのようにポイントを押さえればよいのでしょうか。ランディングページをより良いものにするために、考えてみましょう。

デザインのイメージを明確にする

ランディングページのゴールは、ユーザーに購入や申込みなどのアクションをさせることです。デザイン性のみを追求し、格好よく美しいランディングページをデザインしたからといって、必ずしも目的が達成できるわけではありません。

ランディングページのデザインを行うWeb制作のプロは、商品知識やその分野のマーケティングには疎いことがあります。依頼する側が商品知識やマーケティングのほか、売るための仕掛けなどを研究し、デザイン依頼先と共有する必要があるのです。

すり合わせをしっかりと行うことでイメージを明確にでき、共通の認識を持ってランディングページ制作に取り組むことができます。

依頼先を決める

ランディングページの制作過程は、大まかには以下のようになります。

  1. 商品についての共有
  2. 構成案の作成
  3. ページデザイン
  4. コーディング・実装
  5. テストと改善

ランディングページの制作にあたって、どの部分の制作を依頼するのかによって依頼先や費用が変わってきます。戦略設定の最初の部分から最後まで依頼するのか、制作の部分だけなのかなど、予算やスケジュール、依頼先の規模やスキルなども見極めながら検討しましょう。

予算があるので安心して任せられる大企業を探す、ある程度ノウハウがあってフットワークのいい中小企業に任せる、クラウドソーシングなどでフリーランスを募集するなど、幅広い依頼先が考えられます。

制作やデザイン費用の相場

ランディングページの制作費の相場はどのくらいなのでしょうか?大体の価格帯で、どこまで請け負ってもらえるかをまとめました。

目的別の費用相場

ランディングページの制作には、さまざまな目的があります。目的別に費用相場を見ていきましょう。格安で戦略設計から公開後の修正までを依頼する場合は、フリーランスに発注することで10万円以下の予算に抑えることができます。

また、デザインにこだわりたい場合はフリーランスか中小企業に依頼することで10万〜30万円程度の予算となります。構成やコンテンツにも力を入れ、公開後の改善レポートも受け取りたい場合は中小企業に依頼しても30万〜60万円となるなど、ランディングページの目的によって費用相場も変わって来るのです。

もっと本格的にランディングページを活用したWebマーケティングを行いたい場合は、大手制作会社に企画から運営まで依頼する必要があり、費用相場も60万円以上となります。

出典:LP制作(ランディングページ)の費用と料金相場を徹底解説!【相場早見表・事例あり】

まとめ

ランディングページデザインのコツは、商品理解にはじまり、ターゲットやゴールを明確にすることで、どのようなファーストビューにするか、アクション導線をどうするかなどを設定していくことです。

ユーザーがいかに離脱せず、購入や申込みといったアクションまでたどり着くのかは、ランディングページデザインの構成やコンテンツにかかっています。わずかの違いで成果に大きな差が出る可能性もあるので、ポイントを押さえて魅力的なコンテンツを作りましょう。

Offers」は、時代の変化や環境にあわせてスキルを磨きたい、そんな人にぴったりのサービスです。

いくつもの転職媒体を使って、企業を探し回るのはもう終わり。「副業」から始まる新しい働き方を実現します!

本業では経験できない、新しい環境/開発スタイルを経験しよう!



この記事をシェア

関連記事


副業・フリーランス

プログラミング

インタビュー

シニアレベルを2名採用!現場の負荷を軽減した採用活動、その打ち手がOffersだった

700万ダウンロードを突破し、コスメの口コミアプリとして急成長を続ける「LIPS」。これまで正社員や業務委託問わず、各専門性をもったエンジニアが集うことでグロースを続けてきた。そんな同社のハイス...

インフラとフロントエンドの3名を採用! Hotspringが考える採用方針と旅行サービスの未来とは

旅行予約サービス『こころから』を運営するHotspringは、今後の旅行業界の変化を見据えたプロダクト開発を推進している。これまでリファラルやTwitter採用を行ってきた同社が、なぜOffer...

フロントエンジニアの採用に成功!複業採用の秘訣はコンシェルジュの伴走と、独特な1on1にあった

AIチャットボット市場で圧倒的なシェアを誇る「HiTTO(ヒット)」を展開するHiTTO株式会社。今後さらなる顧客満足の向上に向けて、自社プロダクトの強化を加速していく。そこで重要になるのが開発...

専任CSメンバーがサポート。わずか1ヶ月半で、採用難易度の高いリードクラス2名の採用に成功!

女性限定コミュニティに注力する株式会社SHEでは女性の「自分らしい生き方」の実現を目指し、クリエイティブスクール「SHElikes」に加え、美容領域「SHEbeauty」や金融領域「SHEmon...

デザイン

お金

採用・組織

グルメ