LPOにおけるLPのデザインとは?改善のポイントやデザイン参考事例・まとめサイトを紹介

サイト訪問者にサービス・商品をPRする上で、重要な立ち位置を占めるLP(ランディングページ)。しかし、「LPのデザインをどうやって決めればいいのか?」とお悩みの方や、「LPに適したデザインとは?」「LPO(ランディングページ最適化)においてデザインの影響がどの程度あるのだろうか?」など、デザインのルールや基本的な部分に関して疑問を持っている方も多いのではないでしょうか。

LPOにおいて大切なことは、効果の上がるLPを作ることです。ユーザーを考えさせたり悩ませたりせずにCV(コンバージョン)へと導くためには、外部とのリンクを極力排除したり、情報提供は必要最小限にとどめるなど、構成やデザインにおいても他とは違うルールが存在します。
本記事では、LPOにおけるLPのデザインについて、基本となるルールや改善する際のポイント、デザインの参考となるまとめサイトについて、分かりやすく紹介します。

効果的なLP作成のための基本ルールとは?Webサイトとのデザインの違いや構成要素を知ろう

LPOとは?質の高いLP作成のために事前に押さえておきたいこと

LPOとは、「Landing Page Optimization(ランディングページ最適化)」の略語であり、LPをユーザーのニーズに合わせて最適化し、ページのCVR(コンバージョンレート=成約率)を上げるマーケティング手法のことを指します。LPOを行う上で大切なことは、以下の2つだといわれています。

  1. 効果の上がるLPをつくること
  2. ユーザーごとにパーソナライズされたLPを用意すること

上記の条件を満たすLPをつくるためには、検証(テスト)が必要といわれており、検証用のサンプル作成の際には、デザイン性やクリエイティビティにこだわり過ぎず、極力合理的に行うことが大切だといわれています。
デザインというと、感性や創造性を優先させがちですが、LPOにおいては個人的な感情は排し、合理的に検証・分析を行う必要があります。
その上で、検証後に決まったLPに対して、デザインなどの完成度を高めていきます。

また、デザインする前に、LPが本来どのような特徴を持ったフォーマットなのかということをよく理解しておく必要があります。

LPを訪れるユーザーは、商品購入や無料サンプル請求、会員登録など、明確な目的やアクションを起こす意欲を持っている層であり、即時決断の可能性を持っていると考えられます。
そのため、「LPが原因で購入などアクションに至らなかった」という機会損失をいかに防ぐかが重要です。

ユーザーをLPから離脱させず、考えたり悩ませたりせずにCVにつなげるために必要な工夫を、以下に紹介しましょう。

  • 流入元の広告と連動したメイン画像やキャッチコピーを使用する
  • 選択肢を増やしてユーザーが迷わないよう、一つの問いに対する「Yes or No?」だけを問う
  • 過剰な情報提供はNG!ユーザーが即断即決できる環境をつくる
  • 自社サイトを含め、分岐や外部とのリンクを極力排除し、ユーザーをLP内に閉じ込める

提供する情報は必要最小限にとどめ、シンプルで、かつユーザーが直感的に理解できるものが望ましいといえます。

より詳しいLPOの解説はこちら

LPと通常のWebサイトの違いは?目的が違うからデザインも違う

LPは、狭義の意味では、リスティング広告やバナー広告など主に広告のリンク先となる「1枚の縦長のWEBページ」を指します。各ユーザーのニーズに最適化し、必要な情報をダイレクトに伝えることに特化したページになっており、ユーザーをCVまで導くことを目的としています。

一方、通常のWebサイトの場合、SNSや検索サイトを含めると、無数の経路があり、ユーザーのニーズを特定することが困難です。そもそもWEBサイトの目的は、企業や製品の情報を伝えることにあります。そのため、1枚で完結するLPと違い、複数のページで成り立つデザインが一般的です。

LPとWEBサイトのデザインの違いについて、以下にまとめてみました。

LP
WEBサイト
  • 縦長の1枚完結型
  • 申し込みリンク以外を貼らず、離脱を防ぐ
  • ユーザーの目線は上から下に向かう
  • 統一性よりも飽きさせないデザイン(フォントの大小やレイアウトの工夫)
  • メニューを設置し、複数のページの回遊が前提
  • ユーザーの目線は上から下だけとは限らない
  • 一定のフォーマットを作成した明確なルール設定(レイアウト・見出し・フォントなど)

LPのデザインで大切なページ構成の基本

LPのデザインを考える際、ページ構成の基本となるルールはあるのでしょうか。

商品が売れるロジックとLPOを用いた実践方法を解説した書籍「マーケッターとデータサイエンティストが語る売れるロジックの見つけ方」(発行:宣伝会議)では、主に4つのユニットに分けることができると紹介しています。それぞれのユニットについて、詳しく見ていきましょう。

1. キャッチユニット(ファーストビュー)

ユーザーが、LPを訪問し、初めて目にする部分です。
主に、キャッチコピーと画像で構成されています。
ユーザーが求めている情報があることを訴求します。そのためには、流入元となっているインターネット広告や検索キーワード、広告文などどの整合性を図ることが大切です。また、キャッチコピー周りには、誰に対する商品、サービスであるかを明確に記載します。
メイン画像はインパクトがあるものを選びます。中でも人物写真は目を惹くため、効果的とされています。商品写真そのものや、その商品やサービスを利用することで得られる効果をイメージさせる画像などもよいでしょう。
この部分に、ユーザーのアクションを促すための一つ目のコンバージョンボタンを置く場合もあります。

2. 説得ユニット

ファーストビューからスクロールすることで表示されるエリアです。
このユニットの役割は、ユーザーをつなぎ留め、説得することです。キャッチユニットの情報を裏付け、ユーザーが直感的に商品やサービスの魅力を感じられるように、商品・サービスのメリットやその理由などのほか、製造工程や成分内容の解説などを分かりやすい言葉(テキスト情報や写真、図表など)で説明します。
PRしたい情報を一方的に述べたり、説得に熱心になるあまり情報量が増えて難解になったりすることは避けた方がいいでしょう。

3. 安心促進(購買リスク解決)ユニット

このユニットは、ユーザーをCVに導くために、安心させる役割を担っています。ユーザーの不安や疑問を解決するために、商品やサービスの品質保証、製品保証、公的機関による分析結果などの情報をテキストやビジュアルを用いて説明します。ユーザーの共感を呼ぶために、メディア掲載情報や実際の利用者の声などを写真入りで掲載するのもおすすめです。

4. 申し込み回りユニット

LPの最後の部分になります。 ここでは、購入の理由づけを行います。「今すぐ買いたい」と思わせることで、CVにつなげられる確率が高まります。例えば、「2ステップで購入完了」「メールアドレスを入力するだけ!」のように購入の簡便性を伝える方法や「期間限定」「先着●名様限定」など緊急性を煽るもの、「限定プレゼント」「サンプルプレゼント」のようにプレミアム感を出す手法を用いることでCV向上を目指します。

LPの質を高めるためには、ユーザーが知りたい情報を知りたい順序で伝えることが大切だといわれています。LPのデザインにおいては、ユニット単位でとらえ、全体の流れや順序、組み合わせ、ボリュームなどについて試行錯誤を重ねながら、検証を行います。

LPOにおける効果の上がるLPのデザインとは?検証、改善によりCVにつなげる

デザインを改善(リデザイン)することでCVに影響が出るケースも

デザインを変更することは、LP以外にもウェブサイトやECサイトなどにも影響を与えます。デザインを効果的に改善するポイントや、どのような変更を行うことがより効果的に改善できるのか、具体的な例を踏まえて説明しましょう。

改善事例1:ウェブサイト

インパクトがあり直感的なデザインのサイトが、必ずしもよいパフォーマンスをするとは限りません。サイト改善を担当者の感覚だけに頼った結果、CVがダウンしたといった事例はよく耳にします。
デザインの改善は、ユーザーリサーチを行い、理想的な状態を構築し、分析や検証を行うといった戦略的に行うべきものです。戦略的にデザインを行うことで、失敗するリスクは軽減するでしょう。
より詳しい事例に関しては、下記ページをご参照ください。
ウェブサイトのリデザインを失敗しない方法 エビデンスに基づいた戦略

改善事例2:ECサイト、eコマース(電子商取引)

いつでもうまくいくサイトというのは存在しません。特にオンラインショップであるECサイトなどでは、常に分かりやすく不便のない状態でなければ信頼が得られにくいでしょう。ユーザビリティを大切にするためにも、多くのユーザーテストを行ってインターフェースに問題がないかチェックをすることはとても重要です。
サイトパフォーマンスを改善するためのA/Bテストのアイデアをまとめましたので、ぜひ、ご覧ください。
UXリサーチで裏付けられた16のA/Bテストアイデアとは?

改善方法1:画像変更

キャンペーンを打ち出す場合、広告画像によって効果が大きく変わることもあります。人がまず注目するのは、キャッチコピーではなく画像でしょう。広告効果をより高め、改善を行いたいのであれば、まずは複数の画像をA/Bテストで検証することが効果的だと考えられます。
より詳しい画像に対する人の行動については、下記ページをご参照ください。
LIG×データアーティスト共同企画 -広告画像を変えることでどれだけ人の行動が変わるか?

改善方法2:ビジュアルキュー

ビジュアルキューとは、矢印やカプセル化、強調、人の画像などを用いて、特定のどこかに視線を誘導したり、メッセージを伝えたり、アクションを誘導したりする技法のことです。効果的なLP実現のために、ユーザーの注目先の改善は重要です。しかし、視覚情報は複雑なためこれさえあればといった正解はなく、検証を行うことが必要不可欠になります。
ビジュアルキューの効果については、下記ページをご参照ください。
有益な価値提案の例と、その作成方法

効果的なLP作成のためには検証が必要

LPで想定していた効果が出ていなければ、検証を行い分析することで改善を行いましょう。CVRを大幅改善したいのであれば、検証要素が多い多変量テストを実施するべきです。
先で紹介した書籍では、ユーザーリサーチを行い、ニーズに対する改善案を積み重ねることでCVRが1.2~2倍以上にUPした事例を紹介しています。まさに、LPOの効果が出た事例といえるでしょう。

検証して効果的なLPを見つけ、デザインを完成させる。LPOツールの活用も

LPOとは、継続的にPDCAサイクルを回して効果を発揮する対策です。効果的なLPを見つけデザインを変更しても、ユーザーニーズは常に変化しているため、いつまでも同じ成果があるとは限りません。
とはいえ、手作業でPDCAサイクルを継続するには時間や費用がかかりすぎるため、あまり現実的とはいえないでしょう。検証用のサンプルの自動生成や必要な検証サンプルの選別、検証結果の分析など、LPOツールを活用することで、より精度が高く、コストや時間をかけずに行うことが可能になります。

LPOの参考になる、LPデザインまとめサイトの紹介

LPOのデザインや改善、検証の重要性について理解を深めたところで、実際にLPOのデザインを行う上で参考になるまとめサイトを紹介します。

Web制作担当者必見!LPのデザインを作る際のポイントと国内外のまとめサイト11選

スマホ向け、トレンドが知りたい方向け、縦長ページのデザイン向けなど、細かな解説があり、自社に必要なサイトを検索することができます。
ランディングページのデザインまとめサイト11選!デザインを作る際のポイントとは| 東京上野のWeb制作会社LIG

LPを作る前に!デザインや構成の参考にできるまとめサイト10選

初めてLPを作成する方にも分かりやすい、丁寧な説明で書かれているサイトです。
ランディングページを作る前に!参考にしたいデザインまとめサイト10選|ferret

サイトからの離脱率をおさえてCVを高めるWebデザイナーのためのLPリンク集

公開から10年以上が経過。カテゴリ別のランディングページがまとめられており、同業他社のデザインチェックも可能。
ランディングページ集めました。

まとめ:LPOにおけるLPのデザインの重要性

効果があり、ユーザーごとにパーソナライズされた質の高いLPの作成や改善には、感性や創造性を優先させたデザインではなく、完成度を高めるために合理的な検証や分析が必要となります。
さらに、LPを訪れるユーザーは、即断即決の可能性が高いので離脱させずCVにつなげる工夫が必要です。デザインは目的により変わります。

デザインの改善はさまざまな影響を与えるため、効果的なLP作成には検証が必要不可欠です。
また、LPOは継続的にPDCAサイクルを回すことで効果が発揮する対策ですが、時間やコストを考えると手作業で行うのはなく、ツールを活用することがおすすめです。

安定した運用や豊富な活用事例があり、WEBサイト全体のパフォーマンスアップが期待できるDLPOのLPOツールは、大手企業サイトを中心に延べ700社以上のCVR改善を実現してきました。CV向上につながるパーソナライゼーション機能やページ単位(A/Bテスト)、要素単位(多変量テスト)での検証などを搭載しています。
ぜひ、お問い合わせください。
DLPO お問合わせ