「通販サイトのLPを作ろう1」お題・ターゲット・バナー・商品を確認して構成を考えようランディングページ制作テクニック「通販サイトのLPを作ろう1」お題・ターゲット・バナー・商品を確認して構成を考えようこのレッスンではお題に沿ってPhotoshopを使ってランディングページを作成していきます。最初はお題やターゲット等の確認をします。今回の題材はバナー制作テクニックの「通販サイトのバナーを作ろう(前半)」と「通販サイトのバナーを作ろう(後半)」にあるお題やターゲットを扱います。今回作成するページの構成についても確認していきましょう。公開日:2019/09/25最終更新日:2019/09/25目次1.お題を確認しよう2.ターゲットを確認しよう3.バナーを確認しよう4.商品について確認しよう5.ランディングページを構成する要素を知ろう6.ファーストビューを意識しよう1.お題を確認しようお題はこちらです。「無農薬野菜の配達サービスでお試しキャンペーンを実施するので、そのキャンペーンの登録を促すランディングページを作成してください」また、このランディングページはバナー制作テクニックの「通販サイトのバナーを作ろう」で作成した以下のバナーから遷移することとします。2.ターゲットを確認しようでは次はターゲットを確認しましょう。これはバナーレッスンと同様のターゲットとします。バナーと同様のターゲットでない場合、見当違いなランディングページになってしまう可能性があり、キャンペーンの登録に繋がらなくなってしまいます。3.バナーを確認しよう制作するランディングページの遷移元であるバナーを確認しましょう。ランディングページを作る際はバナーの印象(色・フォント・素材)が同じになるように意識してみましょう。意識することによりバナーからランディングページへの自然な繋がりを作ることができます。4.商品について確認しよう商品の仕様は以下のようなものとします。・期間限定の価格で送料込で¥5,000・野菜は9種類、また子供用のレシピが特典として含まれる次のレッスンでは構成について考えていきましょう。5.ランディングページを構成する要素を知ろう今回は以下のような構成でランディングページを作っていきます。各要素について説明します。キャッチコピーキャッチコピーはターゲットに響く言葉を選びましょう。バナーにある言葉やバナーを作成する際に出したキーワードを盛り込むのも良いでしょう。バナーを作成する際に出したキーワードについてはこちらビジュアル商品の写真を載せる場所です。商品が魅力的に見えるよう写真を選ぶ必要があります。アクションキャンペーンに申し込むアクションをするための要素です。申し込みへ進むリンクを貼ったボタンを設置するところです。アクションに繋がるプラス要素を盛り込む場所としても使います。アクションはページ内に複数設置します。ランディングページを見た人が欲しいと思ったタイミングですぐ申し込みができるようにするためです。乱用は見た人に単調さやしつこさを与えてしまうので、区切りの良いタイミングでアクションを入れると良いでしょう。導入・ベネフィットターゲットが商品について知るきっかけを作るところです。「ベネフィット」とは、商品を購入したことによって受けられる体験を意味します。商品のメリットをどのように体験できるかを示すことでターゲットに商品をアピールします。商品の具体的な説明をするところです。商品の仕様や商品画像など、詳細について記載しましょう。商品を利用した方の声を載せるところです。見た人が実際にキャンペーンを利用するとどんな体験ができるのかを伝えることができます。あるご質問これまでの説明で疑問や不安を解消できていない場合に使うところです。実際にこれまでよくお問い合わせを頂いている内容がある場合は、その内容を記載するのも良いでしょう。疑問や不安を取り除くことで、購入への一歩に繋げます。6.ファーストビューを意識しよう構成画像にありますピンクの領域は「ファーストビュー」と呼ばれるエリアです。これは、ブラウザでランディングページを開いた時に最初に表示される領域を示しています。この中にキャッチコピー・ビジュアル・アクションの要素を入れることでスクロールすることなく申し込みへと進むことができます。これらの要素は必ずファーストビューに入れるようにしましょう。見た人の心理の流れを意識し、構成や流れを作ることでランディングページへの離脱を防ぎ、魅力的な商品であることをアピールすることに繋がります。次は具体的なビジュアルを作成するフェーズに入ります。