新商品のプロモーションや新たなターゲットに向けたマーケティング施策を行う上で「ランディングページを作りたい」と思うことがありますよね。
ただ、制作に慣れていないと何から手をつければいいのかわからなかったり、どんな情報を集める必要があるのか見当がつかないかもしれません。想定よりも制作費が大幅に膨れ上がってしまったり、納期が厳しく過酷なスケジュールになってしまった……という事態を避けるためにも、制作に入る前の準備をしっかりと行っていくことが大切です。
企業の業態や職種によって対応もさまざまですが、1人でランディングページ制作を完遂するケースは少なく、たいていの場合ライターやデザイナー、コーダーなどの複数人の協力や連携が必要不可欠です。そのため全体を取りまとめる責任者、いわゆるディレクターを決めておいた方が制作をスムーズに進めていくことができます。
本記事のゴールはランディングページの制作のディレクションができるようになることです。今回はコピーライティングやデザインなど実際の制作に入る前に、ディレクターが把握しておきたい情報や確認事項をご紹介します。
目次
制作の目的を確認する
最初にLPの定義について触れておくと、広義的な意味では「最初にアクセスされたページ」全般を指します。本記事においては「ユーザーの行動を促すことを目的にした商品・サービスの紹介ページ」として解説していきます。
ページ数が多くあらゆる情報を載せたWebサイトとの大きな違いは、購入や認知などの特定の目的を達成するために設計されていることです。縦長1ページに情報を凝縮して作るケースが多く、構成やコンテンツの内容、デザインに工夫を凝らすことでユーザーの興味や関心を引きつけたり、コンバージョンを促進させるといった役割を持ちます。
とはいえ「コンバージョンを増やしたいからとりあえずLPの数を増やそう」といったように目的が曖昧なまま作ったところで、かけた手間に対してほとんど成果が得られなかった……という事態になりかねません。LP制作は時間も工数もかかる大がかりなプロジェクトですので、まずは作る目的を明確にしておくことが大切です。
例えばLPを新規で作るタイミングは以下のようなケースが挙げられます。
- 期間限定のキャンペーンを企画しており専用のLPを作りたい
- 現状顕在層向けの内容のLPしかなく潜在層向けのLPを作りたい
- 既存のLPの構成や内容に課題が多くブラッシュアップしたい
今後の施策に合った適切なLPがないときや、LPを改善することで認知やコンバージョンなどの成果に大きな影響が見込めそうなときなど、制作の必然性が高いことを前提に計画を進めていきましょう。
ランディングページの種類を選択する
LPにはたくさんの種類があり、目的に応じて選択するべき形式が異なります。
代表的なLPの種類
ここでは特に使われることが多い5つの型を押さえておきましょう。
商材を紹介する汎用的なLPを指します。たいていの場合最終的なコンバージョン地点となります。
漫画LP
漫画風のLPです。引きが強くユーザーに親しみや興味をもたれやすいことが特徴です。漫画にすることで具体的な利用シーンをイメージしてもらうことができるので、文字だけだと説明が難しい商材にも向いています。商材を使って悩みが解消したエピソードやサクセスストーリーが多い傾向です。
記事LP
読み物型のLPです。ブログのようなシンプルなデザインでテキスト情報が多いことが特徴です。広告感が薄く自然に読み進めてもらうことができます。通常LPと比較するとデザインやコーディングなどの工数が少なく、比較的安価で制作することができます。
アンケートLP
質問形式のLPです。例えば「アンケートに答えるとクーポンがもらえる」といったメリットを打ち出し、誰でも簡単に回答できる設問にすることでコンバージョンに至りやすくなります。
診断LP
診断コンテンツ型のLPです。個人によって悩みやニーズが異なる商材や、バリエーションが豊富でユーザーにとってベストなものを選択するのが難しい商材に向いています。複数ページ作成して質問から分岐させるパターンもあれば、ポイント加算形式を用いて1ページ内で完結させるパターンもあります。
「商材を購入してもらうことが目的なら、商材の情報を詰めこんだ通常LPだけあれば良いのでは?」と思う方もいるかもしれません。たしかに現在LPが1つもない状況なら、まずは汎用的に使える通常LPの制作を検討するべきでしょう。
しかし、LPには検索やSNSなどさまざまな経路からの流入があり、必ずしも興味関心や購入意欲が強いユーザーが訪れるとは限りません。悩みに関するワードで検索していたらたまたま行き着いた、商品を買う気はないけど広告が気になって押してみた……という方もいるはずです。その際にいきなり商品紹介を前面に押し出した通常LPが受け皿になっていると、自分にとって必要なものとして意識してもらえない可能性があります。
そんなときに検討したいのが、その他のLPの種類です。これらはクッションページとも呼ばれることがあります。
クッションページとは?
広告と通常LP(最終的なコンバージョン地点となるLP)の間に挟むページのことを指します。記事LPやアンケートLPは比較的クッションページとして使われる傾向が強く、新規ユーザーに興味関心を持ってもらうための導入として、通常LPからコンバージョンに至るまでの“つなぎ”のような役割を持ちます。
参考例として、貧血症状に悩む方をターゲットにした「鉄分サプリ」があったとします。既存の通常LPは購買意欲が高い顕在層向けの内容になっており、潜在層にとっては説明不足な印象でコンバージョンにつながりにくいことが課題でした。
そこで通常LPの前に「立ちくらみでフラフラする」「顔色が悪い」といった悩みを起点に実際の体験談や口コミを載せた記事LPを設けます。潜在層の漠然とした悩みを自分ごととして認識させ、その解決手段として「鉄分サプリ」を詳しく知ってもらうことで、自然な流れで通常LPへと誘導することができます。
既存LPとの兼ね合い、商材や施策との相性を考えながら適切な種類を選択していきましょう。
要件や仕様を確認する
LPの種類が決まったら、制作費の見積りやスケジュールを算出していくのですが、その前に費用や工数に大きく影響する要素(コンテンツの長さ、レスポンシブの仕様、入力フォームの有り無しなど)を決めておきましょう。テキスト情報だけでは伝わりにくいため、参考イメージも一緒に用意すると良いです。
細部を詰めていくのは制作が確定してからで問題ありませんが、なるべく事前に確認しておきたい項目を以下にまとめました。
参考となるWebサイトやLP
LP制作に携わるメンバー間で完成イメージをすり合わせるために、参考サイトやLPを探しておきます。サイズごとにだいたいの価格帯が決まっているバナー広告とは異なり、LPはコンテンツが長くなればなるほど制作費が高くなります。機能の多さや動きの複雑さによっても金額が変わってくるので、作業のボリューム感や全体のトンマナが伝わる参考があると良いでしょう。ヘッダーやフッターなど既存のLPから流用するコンテンツがあればそちらも共有します。
LPで使われる機能をいくつか紹介すると、スライドショー、ページ内リンク、モーダルウィンドウ、タブメニューなどがあります。Webデザインの動きや機能については以下のサイトが参考になります。
レスポンシブの仕様
ここで言うレスポンシブとは「レスポンシブWebデザイン」のことで、「パソコンやスマートフォン、タブレットなどの各デバイスの画面サイズに合わせて表示を最適化させるWebデザイン」を指します。
近年はスマートフォンからのインターネット利用が多く、スマートフォンでの見え方を優先してLPを制作するケースが増えている印象です。デバイスに合わせた表示をするレスポンシブ有りにすると工数も費用もかかってしまいますが、例えばBtoB商材のようにターゲットの属性や出面を考えたときにパソコンからの流入が多そうな場合や、今後長期的に使用していくリッチなデザインのLPであれば、パソコンでの見え方にも配慮してレスポンシブ有りにした方が良いでしょう。
予算、ターゲットや配信先、商材の種類を踏まえてレスポンシブの有無を決めておきましょう。
実装方法
LPの実装方法は大きく分けて2つあります。1つはHTMLやCSSを使ったコーディングでデザインを再現する方法、もう1つは画像を分割して配置する方法です。
コーディングで再現するメリットとしては、コーダー以外の方でも最低限のHTMLの知識があれば文言変更などの対応がしやすいことです。また画像で配置する場合と比較して読み込みが軽く、テキスト情報がある分SEOの観点から見ても有利です。その反面、実装には時間がかかります。
画像を分割して配置するメリットとしては、コーディングによる再現を気にしなくてよい分、自由度が高くリッチなデザインにできることです。その反面テキスト修正などの作業をデザイナーに依存することになるため、デザイナー以外の方がテストや調整を頻繁に行っていきたいときには不向きかもしれません。また最終的な画像の配置自体はコーディングで行います。ボタンまわりや見出しなど、今後テストしていきたい部分のみコーディングで再現し、それ以外は画像で配置、といった両方を取り入れたパターンもあります。
入力フォームなどの要件
LPの中にお問合せフォームや予約フォームなどを配置したいケースがあると思います。
入力フォームを簡単に作成できるツールを使ったり、WordPressなどCMSのプラグインを利用するといった手段がありますが、オリジナルの入力フォームを1から構築する場合は、PHPやJavaScriptといったプログラム言語を扱える方がコーディングする必要があります。またHTMLやCSSなどのマークアップ言語のみを使った実装と比較すると、工数や費用も大きく変わってきます。なるべく早い段階で入力フォームが必要かどうかを決めておきましょう。
納品形式や対応範囲の確認
LPは最終的にHTMLファイル、CSSファイル、使用画像、JSファイルなどのファイル一式をサーバーにアップロードすることで公開完了となります。
例えば本番URLが「https://anagrams.jp/lp/demo/」 であれば、「anagrams.jp」のドメイン直下にあるサブディレクトリ「lp」フォルダの中にファイル一式を内包した「demo」フォルダをアップロードすると公開されます。
事業会社が自社のLPを作る場合や制作会社がサーバー情報をもらって作業する場合、ファイルのアップロードをもって対応完了となりますが、サーバー情報が付与されていない代理店などの場合は、クライアントにファイル一式を納品し、サーバーへのアップロードはクライアント側で対応することが多い傾向です。
またWebサイトをWordPressなどのCMSで作成していて、LPもその中に組み込んで管理していくケースでは、HTMLファイルをPHP化するなどの組み込み作業まで行う必要があります。
業態や状況に応じて対応範囲が異なってくるため、何をもって納品完了とするのかあらかじめ確認しておきましょう。
不明な情報が多いときは別途ヒアリングの時間を設けて、LP制作に携わるメンバー間で意思の疎通を図り、方向性を固めておくことをおすすめします。
スケジュールと見積もりを算出する
LPの要件が固まってきたら、スケジュールと制作費の見積もりを出していきます。
スケジュールを決める前にまずは各作業の担当者を整理しておきましょう。複数人が携わるプロジェクトをスムーズに進める上で「誰が何を担当するのか」「誰が責任者なのか」を明確にしておくことは重要です。
こちらの記事も併せてお読みいただくと参考になります。
<LP制作の進め方の一例>
- 全体の責任者・ディレクション担当:ディレクター(社内)
- 構成・テキストの原稿制作:ディレクター(社内) 約7営業日
- ワイヤーフレーム:Webデザイナー(外注) 約10営業日
- デザインカンプ:Webデザイナー(外注) 約10営業日
- コーディング::Webデザイナー(外注) 約10営業日
- 納期:○月○日
ここで注意しておきたいのが、余裕を持ったスケジュールを組むことです。各フェーズでの確認や修正が入ることも加味して設定しましょう。長さや内容にもよりますが、LP制作は最低でも1ヶ月〜1ヶ月半は見ておいた方が賢明です。最終的な納期がすでに決まっている場合は、事前にいつから動けばよいのか逆算し、現実的に難しいスケジュールであれば納期を調整する必要があります。
社内のメンバーで制作が完結するケースでは各担当者に相談しながら進めていけますが、今回の例のように外注したり会社をまたぐケースでは、LPの詳細やおおまかなスケジュールを事前に共有し、空き状況の確認や見積もり依頼が必須です。デザインカンプ、コーディングなどの作業に割く日数が想像つかないときは、各担当者や詳しい方に相談しながら決めていきましょう。
金額感やスケジュールについて承認をいただけたら、ようやく制作スタートです。スケジュールに沿って進めていきましょう。外注する場合は発注の手配も忘れないようにしてください。
まとめ
今回はLP制作前の確認事項や情報整理術をご紹介しましたが、実際に制作に入ってからのディレクターの立ち回り方や見るべきポイントについても執筆予定です。続編をお待ちください。
LPのディレクターは複数のメンバーの間に立ち、スケジュールの調整やクオリティ面をうまくコントロールしていく必要があります。なかなか骨が折れる作業ではありますが、大規模なプロジェクトだからこそ完成したときのインパクトや喜びもひとしおです。適切なコミュニケーションで周りをうまく巻き込みながら、チーム一丸となってLPの完成を目指していきましょう。