【お役立ち情報】あらゆる業種の方にご愛顧いただいている情報流通型広告ランディングページ！

ほとんどのランディング ページの役割はコンバージョンを促進することであり、コンバージョンの前提条件はまず顧客を維持することであることは誰もが知っています。つまり、ユーザーが広告をクリックしてランディングページに入った瞬間から、興味を持つまで、ページを閉じるという考えを持ってはいけないということです。

しかし、現実には、レイアウトや画像が不快なため、ほとんどのユーザーは 2 語も読む前にページを離れてしまうため、コンバージョンを期待することはできません...

特に以下のランディングページ。このデザインを見たとき、まず最初に感じたのは、これを大切にしたいということでした。1ページであらゆるデザインのタブーの落とし穴に完璧に飛び込めるのは珍しいことです。全体的な構造、ページレイアウト、画像の選択、カラーマッチングなど、すべての正しい慣行を完全に回避します。

ランディング ページが人々に与える第一印象は、大人が何かを突然見たときに通常感じる全体的な感覚として理解できます。

女の子に対する私たちの第一印象は、清潔で、おしゃれで、可愛くて、性格が良いということであり、私たちはその女の子が美人であることを常に覚えているでしょう。実際、よく見なければ、彼女は普通に見えるかもしれません。

ランディングページのデザインでも同様で、一目見たときの美しさが重要です。乱雑なレイアウト、つまらない画像、読み込み時間の長さなどの問題は、ユーザーに悪い第一印象を与えてしまいます。したがって、ユーザーを引き付けて留まらせ、販売コピーを読んでもらいたい場合は、次の 3 つのノードのデザインに特に注意を払う必要があります。

優れたランディング ページは、一目見て次の 2 つの条件を満たしている必要があります。

1.乱雑になってはいけない。一見すると、雑然とした内容は読むプレッシャーを増大させ、プレッシャーを感じると人は自然と逃げ出そうとします。

2. ユーザーの目に入る画像は、ほぼ一目見ただけで、ユーザーの同一視の感覚を呼び起こし、ユーザーが興味を持つようにする必要があります。

上記2点、つまり見ていて飽きが来ず、楽しさを感じさせる商品が実現されて初めて、ユーザーは一時的に留まるのです。

一目見た後は、二度見です。

一見すると、ユーザーの感情に配慮し、まずは落ち着かせる必要があります。次に、ユーザーに見てほしいものを、ユーザーが自然に見る場所に明確に配置する必要があります。ユーザーに影響を与えるために、不必要で役に立たないものを使用しないことを忘れないでください。

次のステップは簡単です。相手とつながった以上、あとは相手が行動を起こすよう促すために、便利でわかりやすく、操作しやすいガイダンス方法をタイムリーに提供すればいいだけです。

もちろん、便利で分かりやすく、操作しやすいかどうかは、プロモーションするユーザーのタイプによって異なります。たとえば、若いユーザーと年配のユーザーでは考慮すべき点が異なります。また、相談をガイドするのか、フォームの入力をガイドするのかという目的によっても異なります。ユーザーがこの時点でアクションに関するさらなるガイダンスを見つけられない場合、もう一度注意深く読む忍耐力がないため、これまでの努力がすべて無駄になる可能性があります。

ランディングページ設計の要件を簡単に紹介した後、業界全体で収集する価値のある、この記事の冒頭の情報フロー広告ページに戻り、それを例に、どのようなタブーが侵害され、どのように調整されているかについてお話しします。

キッチンリフォーム会社が制作した広告ランディングページです。広告をクリックしたユーザーが最初に目にするのは、以下の画面です。人道的配慮から、ブランドロゴや名称などの情報は匿名化しています。

このランディング ページの全体的な構造には、ヘッダー、ナビゲーション、ヘッダー画像、本文、下部の変換フローティング レイヤーが含まれます。これは、実際にはポータル Web サイトのデザイン構造です。

実際、ポータル Web サイトの構造を利用して情報フロー広告のランディング ページを作成するのは、非常に好ましくないアプローチです。

情報フロー広告のランディングページ設計のポイントは、極めて短い時間でユーザーの悩みをつかみ、強く訴えて心を動かすことです。大量のコンテンツを蓄積すると、ユーザーは簡単に忍耐力を失います。

たとえば、ナビゲーション。

情報フロー広告の前提は、ユーザーの能動的な検索に基づいていません。ユーザーは広告を見たいとは思っていません。このような心理的背景の下でナビゲーションを設定することは、明らかにユーザーの忍耐力を過大評価し、「ユーザーは私たちについてもっと知りたいと思うだろう！」と考えています。実際には、ユーザーがもっと知りたいと思うのは、製品に対する強い関心と強いニーズがある場合のみです。それ以前は、これらのナビゲーション設定は、ユーザーに複雑で乱雑な感じを与える以外に役に立ちません。

もう 1 つの例はページ ヘッダーです。

このページのヘッダーは画面の 1/6 を占めています。残念ながら、情報フロー広告のランディング ページの場合、この 1/6 のロゴ表示は意味がありません。より目を引き、見られやすくなるように、メイン画像にロゴを配置するのが最適です。

理論的な観点から見ると、タイポグラフィはデザイナーのロジックのようなもので、成熟したシステム理論です。言い換えれば、ユーザーエクスペリエンスを最適化するには従うべきルールがあります。ただし、この場合のランディングページは、正しいタイポグラフィのルールをすべて完全に回避しています。

例えば、ヘッダー画像は大きな領域を占めているものの、何も表現していません。

「ドリームキッチン」のセクションでは、ポータルページのデザイン慣例に従って（もちろん、デザイナーがテンプレートをコピーしただけという可能性もあります）、3 枚の写真が狭いスペースに配置されています。

正直に言うと、広告をクリックするすべてのユーザーが iPhone Plus や iPad で広告を見ているとは思わないでください。画面の幅が Plus と同じだとしても、これら 3 つの画像をぎゅっと詰め込むと、視覚的な快適さと情報の伝達に重大な影響が出ます。この場合のように、「夢のキッチン」という感覚はユーザーにまったく伝わりません。

そしてフォント。ページ全体で 5 種類ものフォント (斜体などの異体字は含みません) が使用されており、見出し、タイトル、本文、キャプションなどの区別も非常に雑然としています。デザイナーはまったく計画性がなく、おそらく「このフォントを使ったばかりだから、そろそろ変えよう」と考えたのでしょう。このような不規則なデザインは、ユーザーにわかりにくいメッセージを伝え、意味のあるコンテンツを見る能力に影響を与え、スクロールダウンする意欲を失わせてしまいます。

それだけでなく、デザイナーは、行間や余白が必要な場所をすべて要素で埋めてしまいました。情報入力セクションでは、2つのテキストボックスとアプリケーションボタンの間隔が一貫していません...ああ、恥ずかしい...これらは、視覚的な混雑感を増大させ、ユーザーの読み取りしきい値を高め、ユーザーの忍耐力を失わせ、直帰率を高めます。

たとえば、左余白と右余白が等しくない

たとえば、「変換後」という 3 つの単語が青緑色の背景をほぼ埋め尽くしています。

たとえば、このフォームでは、3 つの要素間の間隔は等しくありません。

ランディングページ上の画像は、感情を呼び起こし、感情を強め、行動を促進する役割を果たすことがよくあります。したがって、画像の選択の質は非常に重要です。この場合の写真の多くは奇妙です...

たとえば、以下のようなものです。ユーザーの悩みを指摘するために、デザイナーは、汚くて散らかったキッチンの写真のコレクションの後に、主婦が大声で叫んでいる写真を配置し、写真に「あなたはまだキッチンの散らかりを我慢していますか？」というテキストを添えました。 ? ?

少し拡大して、一緒に感じてみましょう。何かおかしいと感じますか？

主婦は打ちのめされたように見えますが、あなたにこう言います。「まだ耐えているの？」 - このような会話は...現実的でしょうか？

しかし、これを変更したらどうなるでしょうか?

主婦の方がずっと誠実だと感じますか？

別の写真セットを見てみましょう。

キッチン改装の「成功事例」を説明するために、ランディング ページには次のような一連の写真が掲載されています。

デザインの観点から見ると、写真の内容、形式、構成、角度はすべて感情を伝えます。しかし、この写真はユーザーにどのような印象を与えるのでしょうか? 「これ、すごくいい！」と思うでしょうか、それとも「あ、これがリフォームしたもの？私のものほど良くないな…」と思うでしょうか。

もう 1 つの例は、次のような広角俯瞰ビューです。

整理・収納後の写真なので、できるだけ「完璧な」キッチンの姿を映し出し、ユーザーに体験してみたいという気持ちにさせるべきなのですが、写真には花火の匂いが充満しています…正直に言ってほしいですか？それともマーケティングを理解していないのでしょうか?

引き続きヘッダー画像を使って、今回はそのカラーマッチングの問題についてお話します（このヘッダー画像にはいくつの間違いがあるでしょうか？ 興味があれば戻ってクリックしてください…）

ヘッダー画像を最大サイズまで拡大しましたが、「Don't waste the good times」という文字を見るには、やはり注意深く見る必要があることがわかりました。携帯電話で直接見ると、これらの文字はぼやけて不明瞭です。

おそらくデザイナーはこう言うでしょう。「はっきりと見る必要はありません。単なる装飾ですから。」

しかし、デザイン要素がはっきりと見えない場合は、新年までそのままにしておくべきでしょうか?要素が見た目が美しく、かつ効果的な情報を伝達できるものであることは期待していませんが、少なくともユーザーの視覚を妨げず、真に効果的な情報をユーザーが見る能力に影響を与えないようにする必要があります。

そしてこれ:

同じ緑の背景では、白い文字ははっきりと見えますが、オレンジ色の文字はぼやけています。なぜ？画像の背景色とテキスト色の明るさが近すぎるため、同様の明るさにより背景色とテキストの間に明確な境界がなくなり、テキストをはっきりと認識できなくなります。

それどころか、このランディング ページ セットには明確なテーマがあります。ヘッダー画像には、ウェディング フォトの要素と主なセールス ポイントである 2,000 元の現金バウチャーが表示されています。ヘッダー画像の下にフォームが挿入され、顧客評価の目標を達成します。フォームに記入し、フォームの下には顧客の写真とその利点を紹介して、対象ユーザーが本当に効果的な情報を得ることができます。ページ全体がシンプルで美しく、冗長な情報はありません。

最後に、情報フロー広告のプロセスでは、デザインの価値が著しく過小評価されていると言わざるを得ません。デザインは、実はマーケティングの重要な部分です。マーケティングと同様に、デザインにも独自のルーチンがあり、ユーザー中心で、ユーザーの視点から物事を見て、ユーザーが視聴し続ける意欲を高めることが求められます。今日以降、デザインの仕事を任されたら、焦らずに取り掛かってほしいと思います。コピーの意味を理解し、写真のトーンを感じ、ユーザーの気分を想像してみてください。キーワードだけで写真を検索してデザインしないでください。

出典：情報フロー広告の精密配信