2025.11.22 学習記録 ~LPについて~

用語

  • LP(Landing Page)
    検索結果や広告などを経由して訪問者が最初にアクセスするWebページ。
  • ワイヤーフレーム
    Webページのレイアウトを決める設計図。
    印刷業界では「デザインカンプ」とも呼ばれる。
  • キラースペース
    ユーザーの視線を最初に強く引きつけ、成約率に直結する最重要エリアのこと。
    LPでは一般的にファーストビュー(スクロールせずに見える範囲)が該当する。
  • コピーライト
    著作物に対する「著作権」を示す表記。
    ©マークと発行年、著作権者名を記すことで、その作品の権利者を明確にし、無断使用や転載を防ぐ役割がある。

LPレイアウトの流れ

①掴み

まずはお客さまを掴んでいく「掴み」が大事。
企画全体の意味する事をしっかりと伝えていく!
キラースペースとも呼ばれる部分。しっかりとお客さまを掴めるようにする。

キラースペースである事
Webページで最も見られる場所であるここは「キラースペース」とも呼ばれる。
そのページの象徴となる文言・写真を使って作成する。

キャッチコピーを考える
キラースペースに掲載する文言である為、最も効果的で魅力的な「キャッチコピー」をつける。
SEOとして検索キーワードになる事も想定しておく。

写真・イラスト等で効果的に
キラースペースの写真となるため、目的への印象を与えられるような写真やイラスト等を利用する。

※キラースペースのイメージはバナー広告からの誘導になるので、デザインは親和性(繋がり)考える。

②説明

前の①で掴んだお客さまに、詳しく説明をしていく。
ビジネスの基本の5W1H(When、Where、Who、What、Why、How)を意識する。

  1. When … いつ(時間)/ Where … どこで(場所)
    最初にWhen(いつ)Where(どこで)を伝えることで、時間と場所が明確になり、その先の内容が頭に入りやすくなる。
  2. Who … 誰が(主体)/ What … 何を(物・行動)
    次にWho(誰が)とWhat(何を)を伝えることにより、結果が明確になる。
    次に説明する過程の前に結論を持ってくる。
  3. Why … なぜ(理由)How … どのように(手段)
    最後にWhy(なぜ)、How(どのように)で、その結果に至った理由や過程を説明する。

例:8月から(When)都内各所(Where)で、
  タレント○○さん(Who)の主演映画(What)が公開します。
  彼の半世を描いた映画ですので、ファン(Why)の皆さんは是非映画館で見てください。(How)

③魅せる

②の5W1Hの説明が出来たら、売り込みをしてアピールする。
3つぐらいアピールをして、欲しいと思ってもらえるように作る。

自信のあるもの
自己発信の、自分が主語として考えた「売り」。
自己満足になってしまわないよう注意は必要だが、自信を持つことは大切。様々な角度から分析して魅せる。

実績があるもの
周りの評価や過去の実績。
主語を相手に変え、意見を貰う事や、評価される「受賞歴」「資格が必要」「達成したもの」などの実績を魅せる。

メリットと感じれるもの
お得と感じれるもの。
単純に「安い」「早い」「上手い」などを魅せていく。

例:ぐるなびでランキング上位になり、評価も高い、レビューも多いのであればそれはアピールポイントになる。
  更に、ユーザー(お客さま)に対して、お得な特典が付くとなると興味は高くなり、注目される。

④目的

TELやメールでの「問い合わせ」、「カートシステム」への誘導で購入なのか、SNSならフォロワーに、イベントや実店舗への誘導なのか?
目的に合わせて、しっかりと案内(アテンド)を行う。
ここのミスは特にクレームに直結するため、快適かつ親切にご案内が出来るようにしっかりと考えて作成する!

  • TELやメール(お問合せ)
    電話番号の掲載・メールフォームの作成・専用サイトへのリンク、実際の経営体制や予算・企画規模等を考えて準備する。
  • カートシステムの利用
    外部リンクなのか、自社カートで埋め込みなのかで、技術的、経営的な問題が出てくるため、しっかりと確認・準備をしておく。
  • SNSでのフォロワーや専用アプリのインストール
    SNSへ誘導し、フォローして頂いたら1ドリンクなどの場合や専用アプリへ誘導しインストールの場合、
    その説明ページが必要になる場合があるため、きちんと準備をしておく。
  • イベント会場や実店舗へのご案内
    アクセスマップ。しっかりとお客さまをご案内できるように作成する。

ワイヤーフレーム作成の準備

準備① 情報を整理する

様々な状況を想定して、情報を整理し必要な項目をまとめておく。
ワイヤーフレームにその必要な情報を配置してストーリーを整える。

「掴み」「説明」「魅せる」の後に、TELやメール等のお問合せや、カートシステムで購入なのか、
イベントなら会場、直接対面での販売が必要なら実店舗などの最終的な「目的」が必要。

その「目的」に必要な電話番号、メールアドレス、WebサイトならURL、
SNSならアカウントカートシステムなら埋め込みなのか外部リンクなのか、
イベントなら会場、直接対面での販売であれば、アクセスマップや住所の案内が必要。

スマートフォンを利用するお客さまがターゲットになるのか?
とにかく会員にする事が重要なのか?
現在の告知なのか? 未来の告知なのか? 過去の議事録(実績紹介)なのか?

また、説明不足によるクレームなどが起こらないよう「対策」も考える。

「写真」を収集しどう使っていくかを考える。
※実務では、撮影に立ち会う事もデザイナーの仕事。実際に自分で撮影する人もいる。

準備② 目的を逆算する

情報の整理後、ストーリーを考えるために「目的」を逆算する。

準備③ 目的への誘導

それを「必要としている」方「利用したいと思っていた」方「使ってみたい」方など
興味のある「優良顧客」と呼ばれるお客さまをどうやって掴む・獲得出来るか考える。

まず入り口で、多く人を集めて、掴みで説明を聞いてもらう。
次の説明をしっかりすることで該当しない方は離れてもらう。
更に次の魅せるで、アピールポイントに対して合わないユーザー(お客さま)には更に離れてもらう。
最終的に目的に近い優良顧客を確実に掴む。

入り口(広告バナー等)>掴み(LP)> 説明 > 魅せる > 目的

LPレイアウトの注意点

後から変更は困難
後からあれこれ追加できないと思って漏れや抜けが無いように考えること!
実務での現実問題として、企業はここでしっかりと企画をまとめる事が出来る人材を求めている。
後からの変更は「無駄」「無理」「無料」の仕事になる場合が多いため安易に考えない。

文字やコンテンツのサイズ感を正確に
文字サイズやデバイス画面のサイズを意識すること。
Webページにしたら「文字が大きい??」「写真が変??」「なんか見にくい??」となることも多い。
実際のWebページを「スクリーンショット」等して、サイズバランスを確認しておくこと。

「対策」フォローアップを想定する
前提としてクレームになるのは絶対NG。ただし万が一の場合に備え、「注意書き」や「適切な説明」をしっかりと行っておく。
類似したサイト等の注意喚起の内容を見ておくと良い。

権利の記載について
書いても意味はないものの、無断利用への抑止力となるので記載しておく!
※ただし、コピーライトの記述はあってもなくても、勝手に人のものをコピーしたら違法。

備考・メモ

コピーライトを書く理由
・著作権者を明記し主張することで、無断利用への抑止力となる。
・そういう慣習になってしまっているから。

コピーライトの書き方
© 最初の発行の年 著作権者の氏名(例:©2018 Samplesdl Inc.)

「つながり」を意識する!バナーと内容やイメージがつながっているように作る。
(誘導元…Webページ、検索、メルマガやSNS、動画コンテンツ)

長すぎに注意!説明は長すぎると疲れる。
簡潔に解り易く、要約する事も考える必要がある。

バナーと同様、「真似をする」ことが上達への近道。

SANKOU!のサイト集からデザインやレイアウトを参考にするのも良い。

サイズはPC基準で。規格は世の中のサイト例を参考にする。

メインイメージなどはブラウザの横幅いっぱいでも良いが、文章などのコンテンツ幅は960〜980px程度に収める。

余白を意識し、サイズバランスもWEBサイトの完成形と同じにする。(実務ではpxピクセル単位で仕上げる)

ワイヤーフレーム作成の前に、掲載が必要な内容(情報)を先にまとめる→情報の順番づけ→レイアウトを考える

その他資料・リンク

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です