長文キャッチコピーをランディングページでデザインにするにはどんな構成がいい?




キャッチコピーは端的に商品イメージを伝えてユーザーに「ピン」とくるキーワードとデザインで纏めるのが良いかなと思っています。


画像はMUNOAGEエイジングケアクリーム

デザイン構成もそれに合わせたテンプレをデザイナーさんも用意しているのでは?
でも、長文キャッチコピーで依頼があった場合はテンプレから文字がはみ出でいる、文字が小さくなるなど思い通りにいかないですよね。

この様な問題は構成案を用意してもらった時によく起こるのでは思います。
構成からデザイナー側で制作する場合は、デザイン構成を考慮してキャッチの文字数や見出し、画像イメージが準備できるからこのような問題はあまりおきません。

「じゃあ、構成をやり直してもらえばいいじゃん」って思いますか?
それはちょっとわがままかなと私は思います。
※デザインする側がクリエイティブ全体をコントロールできる立場なら直す方がいいです

ではどのような構成なら良いクリエイティブ作りに繋がっていくのでしょうか?

くそ長いキャッチコピーの新・構成を考える

新・構成は大げさですが、ネット広告の勝ちクリエイティブはどんどん変化(進化?)しているのでデザイナー側は常にテンプレのアップデートをしておくのをおススメします。

今回のケースなら、長文に対応できるテンプレを追加しておけば対応できる幅が広がるのでメリットはあると思うのです。以下の長文コピーをランディングページのファーストビューで構成される場合で考えてみましょう。

キャッチコピー例

Before
長文キャッチコピーをランディングページで訴求をしっかりして、バランスが良いデザインにするにはどのような構成がいい?

修正したキャッチコピー例

After
長文キャッチコピーを
ランディングページで訴求をしっかりして、
バランスが良いデザインにするには
どのような構成がいい?

改行して訴求部分はボールドしてみました。すでに4行使っていますww

次はデザイン構成です。
ファーストビューならキャッチと商品画像とその商品の訴求ワードや訴求イメージ画像も入ります。


画像はスマホデザインの構成です

これなら、長文を上手く改行してバランスよくおさまります。
あとは、優先したい物を上にもってくるとか微調整してデザインをおこせば完成です。

なぜキャッチコピーが一番下なのか?

これはスマホの解像度を活かしているからです。iPhone Xならh:1624px、iPhone8でもh:1334pxで、PCより縦が長いですよね。
※解像度の数値はGoogle Developer Toolsでスマホ端末切り替えしたものこのページにアクセスしても十分キャッチコピーは確認できます。

デザイナーとしてひと味違うランディングページ(LP)構成案の制作方法

2018.04.01

デザイン構成の一案にどうぞ。

この記事はここまで!

ここからはよく読まれる記事をまとめてご紹介します。
ひとあじ違うデザインノウハウに出会えるかもしれません。

【化粧品・コスメ】乾燥肌訴求のランディングページ(LP)デザイン5選

2018.09.23

【たった1問】遷移型アンケートページの構成とデザインを調べてみる

2018.09.01

【男性編】薄毛・育毛・増毛商材向けランディングページ(LP)デザインについてまとめてみた

2018.08.05

ランディングページ(LP)にエディトリアルデザインを取り入れる。ふきだし装飾編

2018.07.08

【年齢訴求別・5選】健康食品(ダイエット)のランディングページ(LP)ファーストビューとCVエリアデザイン

2018.06.17

CVエリアデザインのポイント。改善できればランディンページ(LP)は強くなる。

2018.05.27

電通グループが開発したAIのバナー自動生成ツールADVANCED CREATIVE MAKER β版のプレスで感じた事

2018.05.20

ランディングページ(LP)にエディトリアルデザインを取り入れる。マーカー編

2018.05.04

デザイナーとしてひと味違うランディングページ(LP)構成案の制作方法

2018.04.01

いつのまにか「Font Awesome」が新しくなってたので調べてみた

2018.03.11

動画ランディングページ(LP)効果改善への道は映像業界を理解する事からはじまる

2018.01.14


お気に入りの情報
が無かったでしょうか?
この記事の最後には、今までのデザイン情報やノウハウをレコメンド形式でご紹介しています。

お求めの記事に出会えますように。



スポンサード広告 by google