ランディングページと聞いて「楽天でよく見るページね！」とか「あの長〜いWebページでしょ？」といった印象を持つのではないでしょうか。
当社はEC運営で必要になるのはもちろん、クライアントからのランディングページ制作依頼もあります。コーポレートサイトを含むBtoB向けのサイトとは違う性質があり、それもまた提案するのが楽しくもあるサイトです。
ランディングページには主にどんな内容で構成されているのか、またデザイン制作時の注意点をご紹介いたします。
【目次】
（１）ランディングページ（Landing Page）の特徴
（２）ランディングページの構成要素
（３）ランディングページデザイン時の注意点
（４）公開後の検証
ランディングページ（LP）の特徴
一般的に「ランディングページ」というと、狭義で「訪問者に期待するアクション（コンバージョン）をしてもらうよう誘導したページ」を指し、以下のような特徴があります。
・サイトからの離脱を抑えるため他ページへのリンクが少なく、独立したページである
・内容が多く、縦長のレイアウトである
・訪問者のアクションを期待するため、ボタンが大きい
・デザインの自由度が高く、エモーショナルな訴求が可能
また、ランディングページを分類するとざっくりと4つに分けられます。
（１）商品またはサービス紹介
（２）店舗または施設紹介
（３）イベントキャンペーンまたはセミナーなどの予約
（４）求人または学生の採用募集
それぞれの目的に応じて構成される基本要素が変わっていきますが、今回は特に需要が多い「商品の注文やお問い合わせ」に焦点をあてていきます。
ランディングページの構成要素
ランディングページを構成するものには、以下の要素が含まれています。
（１）商品紹介（写真・スペック）
（２）信頼要素
（３）安心要素
（４）使用メリット・問題提起（訴求）
（５）実証・結果
（６）リアルタイム（ニュース）感
（１）商品要素（写真・スペック）要素
ランディングページで見てほしい、一番の情報です。
写真は大きく使ってインパクトを出し、訪問者の目を留まらせる役目もありますので、最初に目にするファーストビューに使用する写真はできるだけ大きく綺麗なデータを使用しましょう。
商用フリーの素材でもいいのでは？と思うかもしれませんが、オリジナリティや訴求力に欠けるので離脱しやすくなります。
最近はスマートフォンでもかなり綺麗な写真が撮れるので、きちんと写真を用意したいところです。
（２）信頼要素
「これって本当に効果あるの？」「大げさに見せているだけは？」と初めて見るモノ・サービスには不信感が湧いてしまいます。
そこで以下のような「客観的な評価をもらっている」ことを表記し、不信感を拭ってもらうようにします。
・第三者からの評価を得られるもの（教授、先生、専門家からの写真付きコメント等）
・創業年数
・メディア掲載履歴
・ブランド
・受賞履歴
・取得免許 etc…
（３）安心要素
「買ってみて失敗した！」「自分には合わなかった・・・」といった、実際に使ってみないとわからないことや、配送方法やお支払い方法などの不明点がWebサイトですと多くなります。
そういった購入前に知りたいと情報を載せ、お互いの認識違いをクリアにすることが、コンバージョンへのハードルを下げます。
・品質保証書
・アフターフォロー
・返金システム
・原産国
・生産国
・製造者
・製造方法
・万全な配送方法
・お支払い方法（種類の多さが購買層を広げる） etc…
（４）使用メリット・問題提起（訴求）
訪問者の抱えている問題や「こうなりたい！」という想いを解決できる商品であることを訴えます。
訪問者は買う理由を常に探しているので、それにそった内容を掲載します。
様々なタイプの人でも２、３つは当てはまるよう、項目として出す場合は最低５つ以上必要になります。
（５）実証・結果
訪問者が商品を購入した後に得られるメリットを、結果としてイメージしやすいように表現します。
視覚的にパット見て解りやすい数字やグラフで表示し、細部まで読み込まなくても情報が頭に残るようにすることも大切です。
・使用例
・グラフ、データ
・口コミ、お客様の声
・商品の機能や利点
・価格的メリットなど etc…
（６）リアルタイム（ニュース）感
人の気配が感じられにくいWebサイトは、ガラガラの店舗に入りづらいのと同じように、中々興味を持ってもらいづらいです。
そこで「今売れている」「新着情報」など人の気配があり、にぎやかに感じられる情報や「期間限定」「送料無料」などニュース感を出すことで、ページに興味を持ってもらえるようにします。
・売り上げ
・ランキング
・新着情報
・限定販売
・期間限定
・送料無料など etc…
ランディングページデザイン時の注意点
（１）全体
様々なタイプの訪問者の心に響くようにするため、構成は可能であれば複数人で考えましょう。
多角の視点から見ることによって、訪問者がどのような状態でも、フックとしてひっかかるページを作ることができます。
また、情報の読みやすさも考慮し、ごちゃごちゃっと複雑にしないように配慮が必要です。
イメージを伝えやすい画像や、商品の情報を極端に少なくしないようにしましょう。
基本的にランディングページは広告からの流入を想定し作成するものが多く、そういった場合は検索キーワードなど（SEO）の優先順位を下げても問題ありません。
訪問者は、商品についての知識ゼロの状態で入ってくる場合もありますので、掲載する情報は要点のみ絞って簡潔に表現しましょう。
どうしても入れたい情報は商品説明の補足説明として入れてもいいと思います。
ランディングページは上から下へ順に目線が下がっていくため、訪問者の気持ちの動きに寄り添った「今知りたいこと」から順に流していくのが失敗の少ない方法です。
（２）テキスト
テキストは、1行が長すぎると読みづらくて疲れてしまいますし、サイズが小さくても大切な情報を読んでもらう機会が減ってしまいます。
以下を目安にして、読みやすく、疲れにくいページを目指しましょう。
・横に長すぎないように（1列35文字くらいまで）
・３行以上は左揃えで、文字数が多い場合、中央揃えは使わない
・テキストサイズは小さい14px以下の文字は避け、基本サイズ16px以上を主軸に
・テキストだけ多すぎても読みとばされる（画像付近に配置した文字は読んでもらえる）
・行間を適度にあける（3行書いたら1行あけるなど、内容によって適切な間をとる）
（３）メイン画像
訪問者が最初に目にするメイン画像は第一印象を決める大事なパーツの一つです。
訪問者は「このサイトは何のページか」「自分が興味のある、見る価値のあるページか」を最初に判断します。
ここで興味を持ってもらえれば、「どんな内容かもう少し見てみよう」と思ってもらえますので、まずはメイン画像で「何を売っているのか」がひと目で分かるようにしましょう。
イメージ写真だけですと具体的な商品イメージが湧かない場合もありますので、最近では商品写真をメインに扱い、サブ的にイメージ写真を扱うことも多くなっています。
（４）コンバージョン（購入・お問い合わせなど）ボタン
ボタンにページ全体の色味の補色・反対色を使用し、コントラストで目立たせたり、サイズを大きくしたりして、クリックしやすいように配慮します。
アニメーションなどを使って、「押してみたい！」と思ってもらえる工夫をするのも良いのではないでしょうか。
また、ページを1回見ただけで購入までつながる場合もあれば、何回かページを訪れて、納得してから購入する場合もあります。
そのためページを再度訪れた時、すぐ購入できるように「購入ボタン」をページ上半部に設置するのも効果的です。
ボタンをたくさん配置するのはちょっと・・・というのであれば、ボタンのスクロール追従などの技法で解決する方法もあります。
（５）写真
メイン画像に通じる部分もありますが、商品のイメージが湧く写真を使って、効果的に商品の良さを伝えていくことが大切になります。
必要であれば適切な写真補正をし、実際に目で見たイメージとの相違が少なくなるようにしましょう。
・泣いている写真は心理的にインパクトが強く、心理的に揺さぶられる
→例：時計をプレゼントされ、喜んで泣いている祖母の写真→「こんなに喜んでもらえるほどなんて、きっと素敵な時計なんだろう」という気持ちが湧く
・唾液を分泌させることで、美味しさを伝える
→例：ご飯の上に梅干しや新鮮な卵をのせたシズル感のある写真を使う
・商品を使用している写真（着用等）を撮る（自分を投影化させて共感してもらうように）
公開後の検証
Webサイトは公開してからがスタートであり、アクセスなどを見ながら適宜改善・改修を行い、育てていくものです。
「コンバージョン率が低い」といった場合、広告がうまくターゲット層にヒットしていないなど、外部要因も考えられますが、ページ内の原因としては以下が考えられます。
・アクセス人数が少ない
・商品の情報（質）が足りていない
・お客様が商品内容、価格に満足していない
・レビューがついていない
時にはページを作り変えたり、A・Bテストなども必要になってきます。
「絶対に正解」というものはないので、都度実験し、訪問者の心に届くようケアをしていきましょう。
