LP ノウハウ

条件指定
×閉じる

キーワード

検索範囲
カラー
× 閉じる
カテゴリ

× 閉じる
イメージ
× 閉じる
LP アーカイブ

LPのデザインに関して

2019.1.9

ランディングページのデザインが浮かばない時に見直したいポイント

見る人が最後まで読みたいと思えるように、ランディングページを制作する必要があります。ユーザーを惹きつけるために気を付けたいポイントは様々ありますが、「デザイン」は特に重要となります。

デザインが重要とは言っても、どのようにデザインすればよくなるのかわからない方も多いと思います。そこで以下をメインにデザインを見直すポイントをご紹介します。

・ランディングページにおけるデザインの重要性。
・デザインをする上での注意点やポイント。

デザインの重要性

デザインはランディングページの印象やコンバージョンにも大きく関わってきます。
惹きつけるようなキャッチコピーを考え、ユーザーの手間が掛からないように最適化を行うことが大切です。
ユーザーにとって第一印象である「良い」「悪い」を判断する材料の1つになります。背景色や画像の使い方、配置の仕方など、少しでも違和感を覚えると離脱してしまう可能性もあります。

また、ユーザーが初めに目にするファーストビューへ気を配って下さい。
ファーストビューはユーザーの離脱率に影響する可能性が高い箇所となります。
どんな内容であればユーザーは興味を持ってくれるのか、ファーストビューのデザインは意識して制作するよう心がけて下さい。

ほかに、デザインは文章を引き立てる役割もあります。女性をターゲットにした美容ページは、ピンク系の背景色を使うことで好感度を上げ、画像を使うことでイメージを沸かせることができます。見やすく、イメージ通りのデザインに仕上げることで、文章がより目に留まりやすくなり、最後まで積極的に見てもらえやすくなります。

デザインの基本要素

商品のイメージにあったランディングページのデザインを、すぐに思い浮かぶ方は少ないのはないでしょうか。作業をするなかで何度も改善を行い、納得のいくまで時間をかけて制作するものです。
今すぐに思い浮かばないからといって、焦る必要はありません。

まずは、ランディングページのデザインで必要とする主な要素を解説します。

カラー

フォント・背景色・オブジェクトカラーなど、様々な箇所で用いられます。
ランディングページでは、「メインカラー」「サブカラー」「コンバージョンカラー」が3つの戦略として重要視されています。

メインカラーはブランドカラーとも呼ばれ、ブランド・商品のイメージを伝える役割があります。
ビジネス関係なら真面目なイメージを与えるブルー、柔らかい雰囲気を出すならベージュなどを採用し全体の基調になるカラーを決めます。


サブカラーは、全体のデザインにメリハリをつける役割があります。
高級感、POPな印象、柔らかい雰囲気など、ランディングページの世界観に合う色を考えましょう。バランスを崩さないように、メインカラーと近い色味が望ましいでしょう。

コンバージョンカラーは、最終目的である購入や登録など、アクションを起こしてもらうための重要な役割があります。ボタンと分かること、またブランドのイメージを崩さない色味を選んで下さい。

フォント

文字の種類やサイズ、文字数などもデザインの1つです。
簡潔に伝えることがベストのため、文字数は少ない方がおすすめです。

商品の情報や伝えたいことが多いと、文章量が増えることもあるかもしれません。
そんな時は、文字の太さ・カラー・字間などを変更し、見栄えを整えて下さい。
画像フォントやデバイスフォントを差別化して、視認性を向上させる工夫もおすすめです。

画像

どの画像を使用するか選定し、サイズや色味、加工などをしていく作業になります。
画像を沢山使用する方が、見栄えもよくユーザーがイメージしやすいです。
読み込み速度が遅くならないように、画像の最適化を行うなど注意して下さい。

客観的な検証

このように、複数の要素を掛け合わせることで、全体のデザインのイメージを仕上げていきます。デザインはイメージだけでなく、ユーザーの視点に立つことも大切です。
「分かりやすいか」「イメージと合っているか」など客観的に見て、ようやく分かることも沢山あります。

・商品やサービス、ターゲットに合ったデザインか
・読みやすいか
・CVボタンの設置場所が分かりやすいか、操作しやすいか
・ページが重くないか
・簡潔で瞬発的に理解できるか

細かくチェックしていくことで、コンバージョン率向上に繋がることもあります。
完成した後も、随時確認を行うことで、より良いデザインに仕上げて下さい。

デザインが思い浮かばない時のヒント

ファーストビューのデザイン

ランディングページの中で、ファーストビューのデザイン案の優先度が高いです。
単一ページで仕上げられているため、下までスクロールして読んでもらえるかのきっかけ部分になります。

キャッチコピーのデザインは、シンプルでダイレクトに伝わるように意識して下さい。
そのため、無駄な装飾はない方がおすすめ。

次に、画像の使い方です。商品やターゲットに合った画像を選定します。
女性向けなら、女性の画像を用いるなどユーザーがすぐにターゲットを誰にしているのか読み取れることが大切です。

その他に、過去の実績やお客様の声を目立たせるバッジなども、目立つ部分に配置しておくと、ユーザーの判断材料になります。

CVボタンのデザイン

最後までスクロールして読んでくれたユーザーに、購入・申込・登録などをしてもらうためのクリックボタン。ボタンの場所が分かりにくい場合や、デザインが地味だとクリックしてもらえない可能性があります。

ボタンと分かりやすい形状を選ぶこと、また背景色に合わせたカラーにすることがポイント。ランディングページで一般的に使われるボタンの形状は、角丸の長方形です。
目に付きやすく、クリックしやすいことが特徴。立体感やグラデーションを加えると、よりボタンらしいデザインに仕上げることができます。

カラーには、それぞれイメージがあります。例えば、赤は危険、緑は安心感を与えるなど、色彩によって違ってきます。また、白や黒、グレーなどのモノトーン色は目立ちにくいためボタンカラーには向いていません。イメージや視認性を考慮して、カラーを選ぶことが大切です。色味に決まりはないので、どのカラーを選択しても問題はありませんが、背景色と同一色ではないか注意して下さい。

入力フォームのデザイン

面倒な入力作業は、離脱の原因になります。CVボタンを押してもらっても、入力する部分が多いなど、ユーザーにとってマイナスな点が1つでもあれば、コンバージョン率を下げる可能性も。そうならないように、デザインの工夫と最適化は忘れないようにして下さい。


まず、入力フォームはできるだけ最小限なサイズに仕上げ、名と性を分けるなど、余分な分割は避けて下さい。また、記入例を表示させることや、「半角/全角」「任意/必須」などの情報も分かりやすく記載しておくことがおすすめ。

必要事項だけの入力、入力の順番など最適化も心掛けて下さい。

まとめ

ランディングページのデザインは、ユーザーの視点になることが大切です。
何度も改善を繰り返し、納得のいくランディングページに仕上げて下さい。

まずは、ファーストビュー・CVボタン・入力フォームのデザインに集中して下さい。
ランディングページの要であり、コンバージョンを上げるか、上げないかの分かれ道になります。今回ご紹介したポイントを参考に、ぜひ効果的なデザインを見つけ出して下さい。

ランディングページの参考デザイン


LPデザインを探す方法

リスティング広告やディスプレイ広告のリンク先は、ランディングページデザインの場合が多く、かつ最新のデザインで制作されている事が多いので参考になる場合があります。

キャッチコピーを一覧確認

現在表示されているデザイン一覧のランディングページで使われているメインのキャッチコピーを一覧で確認する事ができ、キャッチコピー作成時の参考としてご利用頂けます。

次へ

お気に入り登録が可能!

このサイトのランディングページデザインをフォルダ毎に分けて自分が参考になるデザインだけを集めて利用する事ができます。

ランディングページ制作.jp
「伝わる」×「欲しくなる」を目指した結果の出るランディングページ(LP)のデザインに特化
どんなLPを作ったらいいかわからない…そんな状態でも一度ご相談のご連絡を頂ければ構成などもお手伝い致します
ライン
電話番号
営業時間:10時~18時(土・日・祝日定休日)
【大阪本社】〒541-0053 大阪府大阪市中央区本町1-7-7 WAKITA堺筋本町ビル2階
【東京支社】〒107-0062 東京都港区南青山2-4-15 天翔南青山ビル3階
【福岡支社】〒812-0011 福岡県福岡市博多区博多駅前3-27-25 第二岡部ビル9階
ライン
Copyright © 2019 ランディングページ制作.jp
All Rights Reserved.