ランディングページにとにかく要素もりもりつっこむ・一個文章追加したらユーザーがちゃんと読んでくれる、は発信者側のエゴだと思う。
たとえるなら。一般男性に対して「髪型を昇天ペガサスMIX盛りにしたから惚れてくれ」もしくは「つけまつげを1ミリのばしたから気づいてほめてくれ」と、女性が言い出すレベル感。どうだ困っちゃうだろう。
でも、実際ランディングページ改善の施策をしてると、そんな発信者のエゴを丸出しにしてしまうことがある。そして粉砕されるランディングページ。ああ工数の無駄遣い。ごめんなさい。
今回は過去の失敗を反省して、エゴ丸出しの要素追加と、ちゃんとユーザーのためになる要素追加、何が違うのかを考えてみた。
利用者のためのデザインに必要なもの
Thinking Outside the Whiteboard / Matthew Oliphant
エゴ丸出しの要素追加と、ちゃんとユーザーのためになる要素追加。何が違うのかを考えるにはデザインの視点から考えるとわかりやすかった。ドナルド・A・ノーマンは、利用者のためのデザインの基礎的な原則を、以下２つあげている。
・よい概念モデルを提供する、ということ
・ものを見えるようにする、ということ
女性のメイクにたとえるなら、こんなかんじ？
・TPOをわきまえたメイクやヘアスタイルをする
目立つことといれたい要素もりもりにした重要視昇天ペガサスMIX盛りのような、視を目的追加するだけ追加しまくりTPOクソ食らえなスタイルはしない。
・相手が理解できる範囲のこだわりで、美しくなれるようにがんばる
まつげ長くみせる＝目を大きく見せるためにマスカラぬったりつけまつげつけるのはいいと思う。すっぴんとメイク後の差がわかりやすい分、一般男性もその努力については許容できるのではないだろうか。ただ、その細部にこだわりすぎて1mmのばすことに命をかけて、その1mmに気づかない相手を責めちゃうのはちょっとお門違いな気がする。（プロのメイクのようにその1mmにこだわる理由がちゃんとある場合、こだわる価値があると思う！その点ご注意を。）
ランディングページで「よい概念モデルを提供する」ということ
Head case / net_efekt
では、ランディングページでよい概念モデルを提供するとはどんなことなんだろう？概念モデルとは『「物事の仕組みを単純化して表したもの」、「概念のとらえ方を示すひな型」』のことである。※※「モデル化」して考えるとはどういうことか？より引用
ランディングページでいうと。ユーザーがページ読んだ時「このページは何がいいたいのか？もし気になったら次はどうすればいいのか？」をちゃんと理解できるページを作ろう、ということだ。
ユーザーはページの内容をじっくり読んでくれることはほとんどない。ざっと流し読みする程度だろう。それでも発信者のいいたいことがどれだけ伝わるかは、ページの構成要素の質に特に左右される。
実際のランディングページの例
たとえば化粧品のランディングページ。
※原寸大はこちら
「保湿 化粧水」で検索してでてきたランディングページだが、私がざっと理解したのはこんなかんじだった。
このページは何がいいたいのか？：1000円で保湿化粧水のトライアルが購入できる・これはYAHOOビューティーで賞をとった商品だ・洗顔フォーム、保湿関連化粧品に加え、今はプレゼントがついてくる
もし気になったら次はどうすればいいのか？：下部のフォームで購入できる・購入ついでにメルマガ登録したらさらにサンプルもらえるらしい）<
さて、例えばここで、おトク感あおるためにフォームの中にある「メルマガ登録でもらえるプレゼント」の訴求をめだたせたいとする。ファーストビューで「メルマガ購読してくれた人にはプレゼントあげるよ」この訴求をそのままの大きさ・そのままの要素で上部にもってきたとしたらどうなるか。
ユーザーはこのページはメルマガ登録のページなのか、トライアル商品を買えるページなのかすぐには判断つかないだろう。また、トライアル商品購入のときのプレゼントとどう違うのかがわからず混乱すると思う。
原因は「1000円で保湿化粧水のトライアルが購入できる」と「メルマガ登録する」の２つの概念を、主題として存在させてしまうこと。主題を複数にしてしまうと、ユーザーがぱっと概念モデルを思いつけなくなってしまう。
訴求したい要素がたくさんあるとき、もりもりファーストビューで訴求したくなる気持ちもわかるが、下手に盛れば盛るほど昇天ペガサスMIX盛り化して相手に伝わりづらくもなる。盛りたいなら、ユーザーが斜め読みしても「このページは何がいいたいのか？もし気になったら次はどうすればいいのか？」を必ず理解できるよう、全体の構成を作りなおす必要がある。
ランディングページで「ものを見えるようにする」ということ
Laurel looking into the stingray tank / oddharmonic
ユーザーに伝わるよう概念モデルを構築したからといっても、実際ユーザーに見えなければ意味はない。概念モデルにそいつつ、ユーザーの目に入るようデザインする必要がある。
例えば、先ほどの「・購入ついでにメルマガ登録したらさらにサンプルもらえる」部分について。
もしこの要素がテキストだけの表示だったらどうだろうか？
・・・・これ、さっと読んで理解できます？私はまったく理解できない（泣）。メルマガ登録することで何かがもらえることすら認識できなかった。ちょっと考えて、唯一左側の「メルマガの送付」というタイトルに目がいって、「メルマガいらねー」と思って配信拒否して終了、だと思う。
テキストをただ追加する、だけでは決してユーザーには伝わらない。つけまつげを1mmのばしたからといって一般男性がそこに気づかないのとおんなじだ。気づいてるのは実装してる本人だけってのも同じ。悲しい。
ユーザーが必ず目に入る場所、ぱっと思いつくのはこんなかんじ。
1:主導線の中に大きく画像を入れる
2:主導線のボタンを大きくして、そこに最後のひとおしの文言を追加する
3:ファーストビューにアイキャッチつくって、ページ下部で詳細のコンテンツをいれる。
4:人の顔と一緒に掲載する。（人の顔は目をひくので、人にしゃべらせると目を引く）
とか。上記2の例のように、一文追加したらユーザーが読んでくれる場合もあるから、必ずしも一文の追加＝ユーザーは読まない、というわけではない。大事なのはユーザーが認識できるようデザインすることだ。（もちろん概念モデルがちゃんと伝わることを前提でね。）
———–
ちゃんと考えないと、ランディングページは昇天ペガサスMIX盛りになる＆つけまつげ1mmへの拘りで無駄な工数を使い、粉砕される運命にある。
だからこそ。毎回改善施策考えるとき、「よい概念モデルを提供する」「ものを見えるようにする」この2点をちゃんと意識して考えていきたいと思う。基本的なことだけど、自戒します！
Leave a Reply