ランディングページの作り方
追記：ランディングページ関連については「ランディングページまとめ」というエントリでこの内容も含め、まとめていますので、そちらを先に参照して頂くと理解を深められると思います。
初めて会った人がかっこいい人だった、美人だった。それだけで、その人の印象は良いものになります。ちょっと前に「人は見た目が9割」という本がはやりましたが、人との出会いにおいて以外と重要なのが最初の印象です。
WEB サイトも同じことで、最初に触れるページというのはその後のユーザーとサイトとの関わりに影響してきます。特に最近ではGoogleなどのサーチエンジンからの検索によって流入がTOPページ以外のことが多くなってきています。検索の対象が「サイト」から「ページ」にシフトしているのです。
Googleでキーワードを入力し検索ボタンを押す。Yahoo!トップページで表示されたバナーが気になり押す。この先に待っているのがランディングページ。つまり利用者がそのサイトと初めて触れるページになります。
今回は「11 Ways to Improve Landing Pages」というページに書かれている１１のランディングページを良くするための方法を超訳(英語は得意ではないので翻訳ではありません)で記述しておきます。
11 Ways to Improve Landing Pages
コンバージョンの定義をする
ランディングページを作成する前に、何をもってコンバージョンの成果にするか「コンバージョンアクティビティ」を決定する必要があります。メールマガジン用のランディングページの場合、コンバージョンアクティビティはメールアドレスをフォームに入れ、「同意」ボタンをクリックしたものとなります。
小規模リサーチをする
小規模な人口統計調査が役に立ちます。ユーザーが何を探しているか？何がユーザーに重要か？を理解することが重要です。理想的な訪問者のプロフィールを作り、ランディングページを作成する際、これを心にとめて作成してください。それ以外のためにページを構成することはせず（一般的で広義なページは失敗することが立証されています）、全ての構成要素をターゲットユーザーに合わせてください。既にあなたの広告からランディングページへの流れがある場合、ユーザーは非常に限定化されたメッセージを期待して遷移してきます。ページを利用者に合わせて仕立てあげてください。
不要なエレメントの排除
注意散漫なコンテンツはコンバージョンを低下させる原因になってしまいます。ページからあらゆる不要な要素を削ってください。これはあなたのホームページではないのです。ユーザーはあなたの広告を見て、非常に限定されたメッセージを期待してランディングページへ来ているのです。
クリエイティブと合わせる
ランディングページと遷移元の広告のクリエイティブは合わせるべきです。その最も簡単な方法はあなたの広告のクリエイティブと同じ見出しを利用してユーザーが正しい場所に来たという手がかりを提示することです。
ナビゲーションを排除する
もし出来るのであればナビゲーションバーを排除してください。もちろん、コンバージョンプロセスに必要な要素の場合は排除する必要はありません。あなたのメッセージを思い出してください。それはナビゲーションとは関係ないはずです。この際、捨てちゃってください！
焦点をぼかさないこと
ユーザーに宣伝で迫ったり、サイトの別の場所にリンクしたりすることは避けてください。ランディングページの重要なポイントはユーザーが横道にそれないよう引き止めることです。あなたがユーザーに求めることはコンバージョンであって、あなたのサイトの他のパーツをクリックしてまわることや、Flashアニメーションに驚いてもらうことではありません。もし、GAPが彼らのお店に入ろうとしている買い物客に彼らの店から離れショッピングセンターの中を歩くことを勧めたらどうでしょうか？1度でもあなたの誘いを考えることをやめてしまったら、あなたは彼らを失うでしょう。
重要な要素であるファーストビュー
ブラウザのファーストビューに入る部分に注意を向けてください。ファーストビューに入る部分に、訪問者がコンバージョンを達成するために必要なコンテンツを用意してください。訪問者が何に関するサイトかを理解するためにクリックやスクロールをしなければならないなら、彼らが唯一することは戻るボタンをクリックすることです。
コンバージョンの出口を用意する
ユーザーがコンバージョンを達成するのを簡単にする必要があります。その為にコンバージョン用出口（達成するためのボタンやフォーム）をファーストビューの中に用意してください。
目を導く
タイポグラフィや色を使い、ページに沿って目をコンバージョン出口に導いてください。空白をうまく利用し、大きいコピーとグラフィックスは長いページを本来よりもはるかに短く見せることができます。ただし、大きなイメージ画像はたくさんの目を利用する時間を要求します。もし、置き場所を間違えるとあなたのメッセージの流れは断絶してしまうでしょう。
中央に近い部分に（あなたのコピーや画像などの）重要なものを配置してください。興味がわくものやサイドバーなどを横に置くと「ユーザーの目」をメイン部分からそらしてしまう原因になります。もし、それが興味がわくもので、価値があるものならば、直接「ユーザーの目」に留まるよう中央に置いてください。
フォームを直す
あなたのフォームを最適化してください。入力カーソルがユーザーが入力しているフィールドが終了したら、次のフィールドに移るように作ってください。ユーザーがタブを利用できるようにしてください。出来る限り全てのフィールドを自動的に構成できるようにしてください。
必要の無いフィールドなどを排除し、あなたのフォームを最適化してください。もしあなたが郵便番号を聞くのであれば、都市情報など郵便番号から推測できるものは聞かないようにしてください。本当に必要なものだけに焦点を絞るべきです。
もし、あなたがニュースレターの登録をユーザーに聞く場合、メールアドレスだけを聞くべきです。この時、あなたは彼らの名前を聞く必要はありません。リセットボタンを取り除いてください。これはユーザーにとってもあなたにとっても危険です。
テスト、テスト、テスト
あなたがランディングページをデザインし終わったあと、デザインチームと共に下のチェックリストを確認してください。
- ページ全体は元々考えた焦点と合っているか？
- メッセージは遷移元の広告とあっているか？
- 気を散らせてしまうモノを減少させたか？
- 重要な情報はブラウザの淵よりも上にあるか？
- コンバージョンの出口は足りているか？
- ページはあなたのブランドを高めるか？
まとめ
読んでみれば実は当たり前のことが書いてあるのですが、それも出来ていないサイトが多いのが現状です。それはユーザー視点ではなく、提供者視点でページが作られてしまっているからです。
企業ですから、何でも全てユーザー視点でなくても良いとは思います。企業として言いたいことが沢山あることも分かります。ただ、何でも全て用意して見せ付けることが決して良いことではないこと、絞って見せたほうが効果があがることを認識することが必要です。
バナーを押して遷移してくること、キーワードで検索をしてくることは、ユーザーは既にそこで絞込みを行っているのです。それを意識してランディングページを作成すること。それが必要なのだと思います。
※訳の部分については特に再利用自由ですが、原文は別のサイトに帰属しますのでお気をつけください。
