心配するのをやめてランディングページを愛するようになった方法 (およびそのベストプラクティス)
公開: 2017-10-04あなたのランディングページはコンバージョンマシンですか、それとも直帰率のロケットですか? 提供するコンテンツがどれほど価値があり、広告コピーがどれほど巧妙に作成されていても、あなたと新しい見込み客の間に位置するのはランディング ページです。 つまり、ランディング ページがコンバージョン用に最適化されていない場合、基本的に会社のマーケティング費用を無駄にしていることになります。 ランディング ページには、CTA、フォーム、コンテンツ、グラフィック、目的など、多くの可動部分があります。 では、ランディング ページの巨大なマシンと、人々が Web 上で売り込んでいるすべての「ベスト プラクティス」とのバランスをどのように取っているのでしょうか?
それが私がこのブログを書いている理由です。心配するのをやめて、ランディング ページ (およびそれらがもたらすリード) を気に入っていただけるように。 ランディング ページとユーザビリティの基本について説明しますので、平均的な John Doe よりも多くのことを知ることができます。胸を張って、デザイナーのところに行き、彼らのランディング ページが十分ではないことを伝えることができます。
コンテンツからフォーム ボタン、グラフィックスなど、ランディング ページについて知っておくべきことはすべてここにあります。
ランディング ページのベスト プラクティスに関するダウンロード可能なガイドを入手してください。
目次
ランディングページ 101
ランディングページとは?
ランディング ページにはどのような種類がありますか?
ランディング ページのワークフロー
ランディングページの構造
ランディング ページの「ベスト プラクティス」の内訳
ランディング ページ コンテンツのベスト プラクティス
ランディング ページ フォームのベスト プラクティス
ランディング ページ ボタンのベスト プラクティス
ランディング ページのグラフィックのベスト プラクティス
TL;DR ベスト プラクティスのまとめ
ランディングページ 101
ランディングページとは?
Google アナリティクスでは、ランディング ページとは、訪問者が URL を入力するか、リンクを介してランディングする Web ページです。 ただし、マーケティングでは、訪問者を特定のページに誘導するか、変換用に最適化されたページに誘導するかどうかにかかわらず、特定の機能を果たすスタンドアロンの Web ページに対してこの用語を留保しています。
ランディング ページにはどのような種類がありますか?
マーケティングにおけるランディング ページには、主に 2 つのタイプがあります。
- クリックスルー ランディング ページ
- リードジェネレーションのランディングページ
クリックスルー ランディング ページは、通常の販売目標到達プロセスまたはショッピング カート フロー (e コマース サイトの場合) につながる最適化された Web ページです。
コンバージョンのために e コマース サイトを最適化したい場合は、いくつかの方法があります。
リード生成のランディング ページは、Web サイトの訪問者データを取得するために使用されます。 通常、これは、有用な電子ブック、ガイド、チェックリスト、またはその他の価値のあるダウンロード可能なコンテンツと引き換えに行われます。
上記の例では、デバイスごとにランディング ページのデザインが変更されています。これは良いことですが、必須ではありません。 ランディング ページのデザインにページ要素が少なく、動画がない場合は、レスポンシブ ランディング ページを使用することもできます。
[tweet= 「ランディング ページのデザインにページ要素がほとんどなく、動画がない場合は、独自のデバイス ページ デザインを作成するよりも、レスポンシブ ページ デザインを使用してください」]
Vendasta のコンテンツ ライブラリ ランディング ページはすべて応答性が高く、モバイル ブラウザーとデスクトップ ブラウザーの違いはほとんどありません。
Vendasta のマーケットプレイスにある Web サイト ビルダーを使用して、クライアント向けに独自の Web サイトをゼロから作成します。
ランディング ページのワークフロー
ランディング ページのタイプごとに、ユーザーが広告ソースからランディング ページに移動する方法に関する独自のワークフローがあります。
クリックスルー ランディング ページのワークフローは次のようになります。
検索エンジン → AdWords SERP 結果 → ランディング ページ
リード生成のランディング ページの場合、次のようになります。
ブログ投稿 → ブログ広告 (テキストまたは画像) → ランディング ページ
ランディングページの構造
すべての基本的なランディング ページには、リードを変換するための同じ主要な要素があります。
- あなたのロゴ
- 見出しと先頭行
- 主なコンテンツ。機能ポイントと特典ポイントを含めることができます
- 明確で目立つ CTA
- 次のような信頼性を構築するための適格なコンテンツ:
- あなたの製品/サービスを使用するブランド/会社
- 会社、タイトル、著者の画像、および引用を含むクライアントからの証言
- 著作権情報、利用規約、およびその他の関連するフッター ノートを含むフッター
ランディング ページの「ベスト プラクティス」の内訳
Web に関するこれらの原則は、最も単純なものから最も複雑なエンタープライズ Web アプリケーションまで、等しく有効です。 このセクションでは、コンテンツ構造、フォーム、ボタン、およびグラフィックに関するランディング ページのベスト プラクティスについて説明します。
ランディング ページ コンテンツのベスト プラクティス
見込み客を生み出すランディング ページのコンテンツは、通常、トラフィックを生成する場所ではないため、オーガニック検索の位置を中心にすべきではありません。 ユーザーは、広告キャンペーンまたはリンク (ブログまたは電子メール キャンペーン) を介してランディング ページに到達する可能性が最も高いでしょう。
見込み客を生み出すランディング ページが SERP でうまく機能する場合は、そのままにしておいてください。ただし、コンテンツの主な目的は、ページの訪問者の注意を引き、特定の望ましいアクションを実行するよう説得することです。 望ましいアクションは、製品の価格ガイド、カメラの仕様書、ソーシャル メディアのチェックリストなどのコンテンツをダウンロードすること、さらには CTA をストアに呼び出して新しいオファーを入手することなどです。
優れたコンテンツ作成は主観的なものですが、特にランディング ページや Web では、コンテンツを判断するための構造的な内訳があります。
コンテンツチャンキング
コンテンツチャンキングは、長いコンテンツを読みやすい短い段落に分割する手法です。 これにより、コンテンツが見た目に美しくなるだけでなく、コンテンツの理解が向上し、その結果、記憶に残りやすくなります。
ランディング ページに多くの情報を含める必要がある場合は、段落に分割し、箇条書きやビジュアルと混ぜ合わせます。 あなたの情報を読者が簡単に消化できるようにしましょう!
このブログ投稿も、小見出しとビジュアルでチャンクされたコンテンツです。
一目瞭然
人が Web 上の単語を 1 つ 1 つ読んでいるとは考えないでください。彼らが実際に行っているのは、ページをスキャンして情報を探し、キーワードや選択的な文をすばやく確認することです。 これについて私に異議を唱えないでください。人々がウェブページのコンテンツを実際にどのように消化するかについて、研究を重ねてあなたに投げかけることができます.
クリックベイト的な記事がより多くのシェアを獲得するもう 1 つの理由は、人々が読まないことです (人々は、投稿を開いたとしても、ざっと目を通して共有するだけです)。
画面/ディスプレイでコンテンツを読むことは、紙で読むのと同じではありません (私のように、Kindle と iPad が登場して以来、紙の本を買わないことを自慢している人はいますが)。 目の疲れや、インターウェブ上で私たちの注意を引こうとする100を超えるものがあります. そのため、ランディング ページのコンテンツは、簡単にスキミング可能で、怠惰な読者に優しいものになるように計画してください。
Q.コンテンツをスキミング可能にするにはどうすればよいですか?
A.強調表示または太字のキーワード、小見出し、箇条書きリストを使用し、段落ごとにアイデアを制限してください。
[clickToTweet tweet="ハイライト/太字のキーワード、小見出し、箇条書きリスト、および段落ごとに 1 つのアイデアを使用すると、コンテンツがより理解しやすくなります!" quote="ハイライト/太字のキーワード、小見出し、箇条書きリスト、および段落ごとに 1 つのアイデアを使用すると、コンテンツがより理解しやすくなります!"]
逆ピラミッド型の書き方
逆ピラミッド型の書き方は、ジャーナリズムで主に使用される用語で、コンテンツで情報を中継し、優先順位を付ける方法を示します。 このスタイルでは、イントロでコンテンツ全体の基本を開示してから、重要な詳細を掘り下げ、その後にその他の一般情報と背景情報を記載します。
簡単に例えると、119 番通報のようなものです。まず、強盗を目撃したことを報告し、その後、事件の詳細を徐々に開示していきます。
これは、ランディング ページだけでなく、ウェブ上のコンテンツ全般に当てはまります。 マーケティング担当者はこれを聞きたくないのですが、人々はブログ記事をすべて読む時間がありません。 そのため、情報が豊富で、ざっと目を通すのが速く、クエリに答えて話題を提供するものを選択するだけです。 逆ピラミッド スタイルが、ジャーナリズムの世界から、よく知られた同様のコンテンツ ライティングの世界に簡単に移行したのは、まさにそのためです。
コンテンツがどれほど重要だと考えていても、ユーザーの注意を引くために、YouTube、Netflix、およびその他の時間のかかるプラットフォームと競合する可能性があります. そのため、ランディング ページやブログ投稿が読みたい内容であるかどうかを確認できるように、最初に概要を示しても問題はありません。

お客様の声
お客様の声戦略、または「ペルソナ主導のコンテンツ」戦略とは、ユーザーが使用する正確な言葉と言語を使用することを指します。 これにより、視聴者が探しているものとコンテンツがより一致し、視聴者は提示するコンテンツにより簡単に関連付けられるようになります。 これはほとんど簡単なことではありませんが、コンテンツ作成において信頼を築き、最終的にはランディング ページを操作するようにユーザーを説得するのに役立つ非常に重要なステップです。
私は、クッションの主張、毛羽立ち、マーケターや感嘆符のない文を要約した簡潔な Web コピーを読むのが好きです。 感嘆符は、私の Facebook フィードにあるプエルトリコ旅行の写真のようなものです。 このブログ記事を完成させるなど、他に心配することがあります。 さらに、プエルトリコの写真は最悪です。もっと良いカメラを購入してください。
コナー・マクレガーのジャブとしてコピーを想像してみてください: 正確にポイントとメッセージを送信します.
ランディング ページ フォームのベスト プラクティス
ターゲット ユーザーに無料で情報を提供する場合、フォームはユーザー データを取得する唯一の方法です (非 1984-ian または非 Orwellian の方法)。 コンテンツをゲーティングしてリードを獲得しましょう!
ランディング ページのフォームは、ランディング ページを作成するときに見落とされることがよくあります。 すべてのフォームが同じように作られているわけではありません。 フォームにどのレイアウトを選択するかによって、フォームが読まれる速度と、Web サイトの訪問者の心にかかる認知負荷の量に影響を与える可能性があります。
ヒント:認知負荷が少ないほど良い!
ランディングページフォームの種類
ランディング ページ フォームの構造
すべてのランディング ページ フォームには、いくつかの重要な要素があります。
- フォームのタイトル
- ラベル
- プレースホルダー テキスト
- 入力フィールド
- テキストエリアまたはメッセージボックス
- コンバージョンボタン/CTA
フォーム関連のベスト プラクティスは、研究者が高周波/高速カメラを使用して Web ページの閲覧者の目を追跡する、さまざまなアイ トラッキング研究から得られています。 研究結果を読めば、目が回らないフォームの方が速く読めることがわかります。
フォームのデザインにこだわりすぎないでください。 その理由は、私たちの脳は、私たちが意識するよりも速く形や構造を認識するからです. そのため、フォーム要素を十分に配置し、適切に整列させますが、不要な設計要素を追加しないでください。ユーザーの速度が低下するためです。
ランディング ページ ボタンのベスト プラクティス
ボタンは、ユーザーのランディング ページ エクスペリエンスを左右する可能性があります。 多くのデザイナー/開発者は、私自身でさえも、ボタンを間違える (幅が広すぎる、短すぎるなど) という罪を犯しています。
数年前に iOS アプリをデザインするために行ったいくつかのユーザー テストでは、ランディング ページ、Web ページ、およびユーザー インターフェースにおいて、ボタンの視覚的なスタイリングがいかに重要であるかを認識しました。
画面上に物が多すぎると、多くの場合、ボタンはグラフィックのように見え、ページに消えてしまいます。 このため、ボタンは以前に見たボタンのように見える必要があります。
これは、HR Giger の想像から外れたホテルのシンクの蛇口に似ています。 それらは、それらがどのように機能するかを理解するために、もう少し考えさせられます。 人々はそのホテルからどこにも出かけませんが、ウェブページでは戻るか、タブを閉じるだけです。 ボタンを再発明しないでください。
[clickToTweet tweet="ランディング ページのボタンを作り直すな! ボタンがボタンらしく見えるほど、より多くの人がクリックするようになる." quote="ランディング ページのボタンを再発明しないでください! ボタンがボタンに似ているほど、より多くの人がクリックします。"]
ボタンあり: クリックします
私のユーザー インターフェースのモットーは次のとおりです。 1 つのボタンまたはメインの Call-To-Action だけにするようにしてください。
同様に重要で関連するアクションのために、3 つの CTA ボタンを使用しなければならない場合もあります。 その場合、すべてのボタンのヒートマップまたはコンバージョン率データがホットであることに満足しないでください。 ボタンがあれば、ページ上のどこにあるかに関係なくクリックされ、取得されると言っています。 また、ボタンが 1 つとリンクが 2 つある場合は、他の 2 つを合わせたよりもボタンのクリック数の方が多い可能性があります。
Fパターンのボタン配置
アイ トラッキングの調査では、人々が F パターンで Web ページをスキャンすることが示されているため、ページを効率的にしたい場合は、それらの場所にボタンを配置します。 そのため、ページの右上と左下にフォームを使用しています。 これは非常に一般的なパターンで、Amazon、GAP、または Apple.com で見られます。
追跡調査を自分でチェックして、コンテンツの書き方やコンバージョンにつながる CTA の配置方法をよりよく理解してください。
行動を促すフレーズのコピーに関しては、簡単に作成できるはずです。 訪問者がボタンを押したら何が得られるかを言うだけです。 ユーザーが CTA の指示を理解するために頭を使う必要が少ないほど、より良い結果が得られます。
ランディング ページのグラフィックのベスト プラクティス
グラフィックは、訪問したサイトにプロペラ機またはボーイング 777 の写真があったことを人々が覚えている場合にのみ重要です。画像がシンプルであればあるほど、メッセージを伝えるのに適しています。 簡単に言えば、写真の被写体は背景から分離され、はっきりと焦点が合っている必要があります。
グラフィックスのベスト プラクティスは、語られるよりも示されている方がよいので、これらの例を確認してください。
これらのグラフィックはすべてランディング ページ固有のものではありませんが、Web 画像で機能するものと非常に関連性があります。
競合する要素を制限する
グラフィック/画像の明瞭さは非常に重要です。 グラフィックや画像に競合する要素が多すぎる場合は、使用しないでください。 写真やフォトジャーナリズムの雑誌を見ると、賞を受賞した写真のほとんどは、被写体が写真内の要素から視覚的に分離されているか、写真内の要素に囲まれているものです.
複雑にしないでおく!
グラフィックを明確かつ集中的に保ち、複雑さよりもシンプルさを選択して、メッセージを伝えやすくします。
TL;DR ランディング ページのベスト プラクティスのまとめ
- 2 種類のランディング ページ– クリックスルーとリード ジェネレーション
- LP の構造– ヘッダー、フォーム ボックス、FAB、信頼性ビルダー (ロゴまたは証言)
- ランディング ページの情報マトリックス– どの程度の情報密度にするか?
- コンテンツ / コピー
- コンテンツのチャンキング– 長い段落を小さな段落に分割し、段落ごとに 1 つの核となるアイデアを持ちます。 記憶力を高め、理解を深めるのに役立ちます
- 一目瞭然– コンテンツを読み取らずにスキミングできるように設計します。 強調表示または太字のキーワード、小見出し、箇条書きリストを使用し、段落ごとにアイデアを制限します。
- 逆ピラミッド型の書き方– 人々に伝えたいことからコンテンツを始めます。
- お客様の声– ターゲット ユーザーが使用する言語を使用します。
- フォーム
- フォーム構造は非常に重要です。 目をさましにくいフォームデザインは、より速く読むことができます。 私の例を見てください。
- 要素の配置— 要素を適切な間隔で整列させますが、シンプルに保ちます。
- ボタン
- F–パターン– Web ページに重ねて配置された F 形状を想像してください。ほとんどの人がブラウザーで新しいページを見ているときに行う動きです。
- 簡単な言葉– 結果を伝え、ユーザーに考えさせない
- グラフィック
- シンプルに保ち、要素が最小限の画像を使用し、被写体を背景から分離します。
- 視差の使用を停止します。 または、それらを使い続けると、見栄えが良くなります。
- おまけ:ランディング ページの最適化には、A/B テストを行うことをお勧めします。 ランディング ページの見出しを変更し、ボタンをシンプルに保ち、コントロールと同じにします。 ボタンのコピーが奇妙であったり、ページ上ではっきりと見えない場合を除き、そのボタンである可能性は最も低いです。
