コンバージョン率と売り上げを向上させるための9つのランディングページのアイデア

公開: 2017-10-10

「模倣はお世辞の誠実な形です。」

その有名なことわざは多くのことに当てはまり、クリック後のランディングページも例外ではありません。

他社のクリック後のランディングページの例を確認して、可能な限り最もコンバージョンに適したページを作成するためのインスピレーションを得ることは、完全に正常です（そして推奨されます）。

人々がオンラインコンテンツをどのように読むかを理解することは、このプロセスの重要な要素です。特に、平均的なWebユーザーの注目期間が約6〜8秒であり、それらの重要な秒の間、訪問者をページに引き付け続ける必要があることがわかっている場合は特にそうです。

インスピレーションを得るために、クリック後のランディングページの例は何百もあります。実際、私たちは世界で最も有名なブランドのいくつかからの主題に捧げられたブログカテゴリー全体を持っています。

今日の記事では、ユーザーエクスペリエンスのヒント、クリック後のランディングページフレームワークの重要な要素、および次のデザインを刺激するその他のクリック後のランディングページのアイデアに焦点を当てたいくつかの例を紹介します。

クリック後のランディングページのベストアイデア

十分な空白を追加します

あなたの兵器庫にはたくさんのウェブページのデザインのアイデアがありますが、空白（別名空のスペースまたはネガティブスペース）は、複数の目的を果たしますが、最も活用されていないテクニックかもしれません。これにより、ページがすっきりと見栄えが良くなるだけでなく、次のことも可能になります。

読みやすさを向上
重要な要素への焦点を改善します
あなたの申し出のより深い理解を可能にします
ユーザーエクスペリエンスを向上させる

それを知って、2つの異なるページの空白のデザインを比較してみましょう。

これは明らかに空白が不足しているアシュワース大学からのものです：

すべてがページの中央に詰め込まれているため、ナビゲートを開始する場所を決定するのが難しいことに注意してください。これにより、訪問者は圧倒され、コンバージョンはもちろんのこと、オファーについても知らずにページを離れてしまう可能性があります。

対照的に、このMentorのクリック後のランディングページには、十分な空白があります。

見出しと小さな説明、およびリードキャプチャフォームの周囲には十分なスペースがあります。異なるセクション間には十分なスペースがあり、ページをナビゲートしてオファーをよりよく理解するのが簡単になります。アシュワースカレッジのページのようにまとめられていないため、クリック後のランディングページ要素はすべて注目を集めています。

この例は、より楽しいユーザーエクスペリエンスを提供し、より良いコンバージョン結果を生み出す可能性があります。

明確な視覚的手がかりを組み込む

視覚的な手がかり、または方向性の手がかり（明示的および暗黙的の両方）は、訪問者に注意すべき点（フォームやCTAボタンなど）を正確に伝えるため、クリック後のランディングページの変換を支援します。

最初に、より直接的でWebページで簡単に認識できる明示的な手がかりを見てみましょう。

クリック後のランディングページのデザインに明確な視覚的手がかりを組み込む主な方法の1つは、フォームやCTAボタンなどの最も重要なページ要素を指す矢印を追加することです。

Sage Intacctは、見出しからフォームに明るいオレンジ色の矢印を含めることで、何に気づいてほしいかを明確にしています。

さらに、CTAボタンの矢印は、見込み客がボタンをクリックすると、このページ以外に追加のコンテンツがあることを示します。

これはTurnProプロパティの別の例で、クリック後の不動産のランディングページのアイデアを探している人に最適です。 CTAボタンを指すオレンジ色の矢印と、ボタンの周りに青い円があり、クリックをさらに促すことができます。

視線は、クリック後のランディングページに明確な視覚的手がかりを追加するための、クリック後のランディングページの最良のアイデアの1つです。人々は他の人が見ているものを見る傾向があるので、画面上の誰かがフォームまたはCTAボタンを見ると、訪問者はそれらの要素にも気付く可能性が高くなります。このテクニックは、ページに個人的な魅力を加えるのにも最適です。

暗黙の方向性の手がかりを含める

暗黙の方向性の手がかりは、明示的な手がかりよりも微妙で、訪問者に気付かれることはよくありませんが、それでも同じように効果的です。最も一般的な暗黙の方向の手がかりには、空白、カプセル化、および色のコントラストが含まれます。

3つのタイプの暗黙的な手がかりすべてを提示するBigMarkerの例を調べてみましょう。

ページ上の各要素を囲む空白は、それらの要素に注意を引くのに役立ちます。それは、近くに何も焦点を当てることなく、訪問者はあなたが望むものを見ることを余儀なくされているからです。 また、ページの各セクションの間に十分な空白があり、ナビゲーションがスムーズになり、理解が深まります。

フォームを色のコントラストでカプセル化すると、ページ上で「ポップ」になり、より多くのコンバージョンにつながる可能性があります。

最後に、特に暗い背景と白いフォームの間の色のコントラストは、この特定の領域への注目を高めるのに役立ちます。

2段階のオプトインフォームを作成する

リードキャプチャフォームに記入するよう訪問者を説得することは、デジタルマーケターの最も困難な課題の1つです。ただし、コンバージョンの可能性を高めるための特定の手法があります。

1つの方法は、単純なページ上のフォームではなく、2段階のオプトインフォームです。

見込み客がCTAボタンをクリックした後にのみ、2段階のオプトインフォームがポップアップウィンドウに表示されます。これらは、変換プロセスを情報フェーズ（プリフォーム）とコミットメントフェーズ（ポストフォーム）の2つの部分に分割するため効果的です。この分離により、見込み客は情報フェーズのフォームに脅かされることはなく、単に情報の収集とオファーについての学習に集中できます。次に、続行してCTAボタンをクリックすることを決定すると、フォームが表示されます。この時点では、それほど威圧的ではありません。

Tableauはこれを理解しています。 2段階のオプトインフォームを使用してページをどのように設計したかを見てください。

訪問者がページを確認し、オファーの引き換えを確約すると、オレンジ色の[ホワイトペーパーを入手] CTAボタンをクリックすると、次のフォームが表示されます。

マルチステップフォームを使用する

2段階のオプトインに加えて、長いフォームを複数の段階のフォームに分割して、見込み客にとって完了プロセスの負担を軽減することもできます。

このQlikのクリック後のランディングページをご覧ください。

フォームの長さがわかりますか？これらのフォームフィールドをすべて入力したいと思う人はいない可能性があります。つまり、Qlikは、ページの摩擦を減らすために、マルチステップフォームとして再設計することでメリットが得られる可能性があります。

一方、AARPは正しい考えを持っています。彼らは、見込み客がAARPメディケアサプリメント保険プランの無料の意思決定ガイドを要求するために、このページにマルチステップフォームを作成しました。フォームの上にあるプログレスバーにも注意してください。これは、別のスマートなクリック後のランディングページのアイデアです。これは、見込み客がサインアッププロセスの進行状況を知ることができるためです。

フォームを2つのステップに分割すると、見込み客の不安を軽減できます。このページにアクセスすると、一度にすべてではなく、7つのフォームフィールドしか表示されません。

CTAカラーコントラストを使用する

多くのマーケターは、召喚ボタンは、コンバージョンが行われる場所であるため、クリック後のランディングページで最も重要な要素であると主張します。適切に設計し、コンバージョンを促進します。設計が不十分で、ページが放棄されるリスクがあります。

CTAボタンを設計する際に考慮すべき最も重要な要素の1つは、色です。ページ上の他の色と対比して「ポップ」し、訪問者ができるだけ簡単に変換できるようにする必要があります。

アイデアを示すためのいくつかの例を次に示します。

このSalesforceのクリック後のランディングページは、単色の配色を使用しています。

青い色の組み合わせは目には自然ですが、ページ要素を目立たせるのは得意ではありません。ボタンはフォームに溶け込みます—CTAボタンに必要なものとは正反対です。

逆に、色が対照的なCTAボタンがあり、問題なく訪問者の注意を引く可能性が高いページがいくつかあります。

安っぽいストックフォトの使用は避けてください

あなたは私たちが話しているものを知っています—あなたが見ている画像は、明らかに上演されているので目を転がさずにはいられません。このように：

コンバージョンを生み出す能力は、訪問者にポジティブな感情をどれだけうまく作り出すことができるかに大きく依存しています。非現実的なストックフォトでは、それはさらに難しくなります。

実際、MarketingExperimentsは、ストック画像を会社の創設者の画像に置き換えることで、登録数が35％増加したことを発見しました。

その時点で、Discoverは、クリック後のランディングページに、より現実的で関連性の高い画像を含めました。

マーケティングキャンペーンに最適なストックフォトを選択するためのヒントやコツについては、この新しいガイドをダウンロードしてください。

テキストの代わりにビデオを選ぶ

冒頭で言ったことを覚えていますか？ Webユーザーの平均的な注意期間は約6〜8秒です。

幸い、クリック後のランディングページに動画を追加すると、訪問者をすぐに引き付け、集中力を維持するのに役立ちます。よりコンパクトでインタラクティブな方法でオファーを説明することにより、動画は総コンバージョン数を86％も増やす可能性があります。

見込み客は、クリック後の長いランディングページをスクロールするよりも、魅力的な1分間の動画を視聴する可能性が高いため、動画はブランドのUVPを伝えるのに特に理想的です。

Wistiaは、このクリック後のランディングページで、UVPとその他の多くのメリットをわずか1分で宣伝しています。

インターコムは、この効果的なクリック後のランディングページのアイデアも使用しています。

彼らのビデオでは、今日のマーケターが直面する一般的な問題を紹介し、インターコムのスマートキャンペーンがこれらすべての問題に対する優れたソリューションである方法を説明しています。

信頼を築く

見込み客を説得するには、まず彼らの信頼を得る必要があります。信頼信号の3つの主要なタイプには、会社のロゴ、セキュリティバッジ、および顧客の声が含まれます。偶然ではありませんが、信頼信号を追加することは、オンラインで存在感のあるブランドにとって最も一般的なWebページのデザインアイデアの1つになっています。

このSmartsheetのクリック後のランディングページは、クリック後のランディングページ全体で3つのタイプすべてを利用しています。上から下に分解してみましょう。

まず、会社のロゴは、最も有名なクライアントのいくつかを強調しています。

次に、引用された紹介文は、有名な企業がSmartsheetをどのように使用しているかを示しています（ロゴが表示されています）。

追加のロゴは、それらが統合する人気のあるアプリを示しています。

ページ上のCTAボタンの1つの真上にある顧客の声（ヘッドショット、氏名、所属、および役職を含む）：

ブランドロゴが添付された別のクライアントの声：

業界の賞を紹介するバッジ：

積極的な報道と宣伝を促進するためのより多くのロゴ：

最後に、信頼性を高め、見込み客に個人情報が外部の第三者と共有されないという確実性を提供するためのトラストシール：

どのポストクリックランディングページのアイデアをエミュレートしますか？

クリック後のランディングページのデザインのアイデアを思い付くと、訪問者を説得するのは難しい場合があります。これは、細部が細かい場合でもコンバージョン率に大きな影響を与える可能性があるためです。そのため、クリック後のランディングページのインスピレーションを得るために他の人を調べることは、完全に受け入れられます（実際には提案されています）。

この記事からお気に入りのアイデアを取り出して、すべてのオファーに対してInstapageを使用してプロのクリック後のランディングページの作成を開始してください。今すぐInstapageEnterpriseデモにサインアップしてください。