過去:なんかLPって縦に長くてデザインしづらいな〜
今:LPをつくってるの?珍しいね!
過去:知り合いから頼まれたんだけど、普通のWebサイトと違って縦に長いから、いつも通りやってると単調になってしまうんだ〜。
かといって、やたらめったら賑やかにすればいいってものでもないし。。
今:LPは確かに難しいね!
さっきも言ってたように長さがあるから、全体的にテーマから外れないようにデザインを気をつける必要があるし、ユーザーが飽きないようにコンテンツの一つ一つのインパクトも重要だしね!
過去:やっぱりそうなのか〜!
あ〜なんか混乱してきちゃったよー!!泣
今:まあまあ、落ち着いてよ。
じゃあ今から、僕がLP制作で気をつけたことを、デザインの側面からシェアするから!
①デザインはテーマに沿っているか?
②退屈にならないように、大胆なコントラストを使っているか?
③成約へのボタンは、周囲に溶け込まず目立っているか?
①デザインはテーマに沿っているか?
過去:ありがとう!
でもアドバイスもらえたのは嬉しいけど、これ見ただけだとイマイチピンと来ないなぁ〜
①は、紹介する商材とか、成約させたい内容と、デザインがマッチしてるかどうかってことかな?
今:お!鋭いね〜!
大丈夫!ひとつひとつ説明していくから!
それにチェックポイントは簡潔な方が覚えやすいよ!^^
①はさっき言ってくれた通りの解釈でだいたい大丈夫!
ただ、もう一歩踏み込んでアドバイスするなら、自分が作ったLPのコンテンツ(特にテキスト)を非表示にしてみるのが、確認作業としてはオススメ。
コンテンツを外した時に、もし全く別のテーマのコンテンツが入ることが容易にイメージできるとしたら、今はあまりテーマには合っていないってことになってしまうからね!
例えば、街コンの集客用にLPをつくるとすれば、パーティーで盛り上がる感じ、つまり賑やかな感じがテーマになりそうだよね?
色合いとしては、暖色系を使ったほうが良さそうな感じ。
でも、もしここで…
過去:あ!そっか!
今:!
過去:例えばそこでクールな感じや高級感を表す色合い・表現でデザインを組んでしまうと、テキストを読めば街コンってわかるけど、コンテンツを外したら街コンは確かに連想しづらい!
今:そうなんだよ!まさしくその通り!
過去:でもこれって、普通のサイトを作る時も意識しているよ?
もしかして、LPは特に気をつけなきゃいけないとか?
今:確かに普通のサイト制作でも気をつけているとは思うけど、特にLPでは、テーマとデザインの関連性には非常に気を使わないといけない部分なんだ。
LPというのは、そもそもユーザーに多くの情報を提供して、商品やサービスを購入してもらいやすくするためのページだよね?
情報量が多くなるということは必然的に縦に長くなりやすいし、ユーザーが時間をかけてみても飽きないような、むしろ引き込まれていくようなデザインになっている必要がある。
過去:ふむふむ。
今:ただでさえ長くて飽きやすいし、大量の情報を時間をかけて読んでもらうわけだから、少しでも違和感があるとそれだけでユーザーは離脱しやすくなってしまうんだ。
コンテンツの内容でもちろんカバーはできるけど、どうせならデザインでも魅力的に仕上げたいよね!
過去:なるほど〜!
普通のサイト以上に、テーマを意識するってことが大事になってくるんだね!
胸に刻んでおこう!
②退屈にならないように、大胆なコントラストを使っているか?
今:次はコントラストのお話。
①でも言ったように、LPはとにかくユーザーを惹きつけ続けて、成約のための情報を提供し続ける必要がある。
だから、一般的なWebサイトに見られるような統一感、一貫性といったものをあえて崩して、ドラマを描くようにデザインするのが大事になってくるんだ!
過去:へぇ〜!そうなんだね!
確かに単調な表現がずっと続いたら、どこまで読んだかとかもわからなくなりそうだしね!
今:そうだね!そういったことを含めて、ユーザーが興味を失わないようにしないといけない。
そのために、レイアウトやカラー、フォントサイズなどのコントラストも、怖がらずに大胆にデザインすることが大事!
例えば、メインビジュアルは横幅に制限を持たせずぶち抜きにしたり、フォントサイズは文章を12px、見出しを80pxで書いたり、
とにかく中途半端にしないことがポイントだね!
過去:極端に変えるのって、頭でいいとわかっててもなかなかできないんだよね〜
がんばって意識するようにしよう!
今:大胆なレイアウトほど面白くなるからね!
もちろんテーマにも寄ってくるけど、意識したほうがいいよ!
ちなみにコンテンツに関しては、ユーザーの不安感や成約への判断材料、知りたい情報などを段階的に配置していくようにすると、成約率も高まるよ!
購入しない理由を、一つ一つ解消していってあげる感じだね!
特に第三者の声や専門性、賞などの受賞歴は信頼性UPに効果的だと言われているんだ!
過去:なるほど〜1コンテンツに関する豆知識も聞けたし、やる気上がってきた!
③成約へのボタンは、周囲に溶け込まず目立っているか?
今:最後は、LPの中でも一番重要といっても過言ではない、成約ボタン(購入する、など)についてだよ!
過去:確かにこれは重要だね!目立つように配置するように意識してるよ!
今:いいことだね!よくやってしまいがちなのは、一般的なWebサイトで統一感を意識している流れで、ボタンも周囲の色や表現になじませて作ってしまうこと!
LPの場合はコントラストが重要なのは②で言った通りだから、周囲とボタンが似ている状態になることは避けたいんだ。
特にボタンはユーザーを成約に導く最も重要な要素で、文言や色の※ABテストも頻繁に行われるほどだからね!
逆に違和感がありすぎるくらいでちょうどいいってこともあるよ!
※ABテスト:複数の案をローテーションさせ、最適な案を導くためのデータを取るテストのこと。
過去:やっぱりLPは普通のサイトとは違うんだね〜。
はっきり分けて考えるようにしないとダメだな!
今:あとはボタンの数と位置も重要!
何気なく配置されているボタンだけど、ユーザーが「欲しい!」と思った瞬間に押せるように、上下1スクロール以内にはあった方がいいんだ。
ユーザーは購入のための情報分析中なわけだから、「あれっ!?ボタンどこだっけ?」というようにスクロールを繰り返してボタンを探させるような余計なストレスはNG!集中できる環境を用意してあげよう!
過去:あ!それ経験ある!
ボタンの数が極端に少ないサイトだったんだよね〜
確かにストレスを感じたww
今:自分が経験したことがあると、イメージは湧きやすいかもね!
ユーザビリティにもダイレクトにつながるから、意識してみるといいよ!
過去:ありがとう!
今日もかなり勉強になったな〜
よし、この勢いでLP制作もうひと頑張りしよう!
Sat, February 21st, 2015




