変換中心の設計の7つの原則
公開: 2021-07-22経験豊富なマーケターは、着陸を高度に変換する特定のパターンとトリガーがあることを理解するようになりました。 彼らは彼らの観察を実用的なガイドラインに変えました、そしてここに私達がいます—それはコンバージョン中心のデザインの簡単な話です。 茶葉を読んでユーザーの行動を予測する必要はもうありません。 今、あなたはコントロールしています。
この記事では、コンバージョン重視のデザインと、それをメールやランディングページで使用する方法について説明します。 デザインの選択は決してランダムであってはならないことに注意してください—すべての細部が目的を果たすことができます!
コンテンツ
- コンバージョン中心のデザインとは何ですか。なぜ気にする必要がありますか。
- 原則1.ユーザーが集中できるようにする
- 原則2.堅固な構造を作成する
- 原則3.一貫性を維持する
- 原則4.メリットを強調する
- 原則5.CTAを目立たせる
- 原則6.信頼を得る
- 原則7.摩擦のない体験を生み出す
- それをすべて一緒に結ぶ
コンバージョン中心のデザインとは何ですか。なぜ気にする必要がありますか。
コンバージョン中心のデザイン(CCD)は、商業的に効果的なランディングページ、電子メールテンプレート、およびその他のタイプのコンテンツをデザインするための一連のルールまたは原則です。 この戦略を使用すると、より質の高いリード、サブスクライバー、および顧客をもたらすコンテンツを作成できます。
もともと、これらの原則はUnbounceのチームによって考案されました。 彼らはマーケティングの語彙に入り、今ではさまざまな専門家や実務家によって自由に適応され、解釈されています。 ただし、それらの意味と関連性は少し変わっていません。
それを認めましょう、それは2021年ですが、多くのランディングページは混乱していて直感的ではありません。
ニューヨークを拠点とするパン屋の広告をクリックした後、ユーザーがこのページにアクセスします。 手始めに、ページは広告に関連していません。 たくさんの低品質の画像と複製、奇妙な数のリンク、巨大なメニューを備えたスライダーがあり、ユーザーがこの会場に注意を払う必要がある理由についての説明はありません。 ここで何が起こっているのか理解するのは難しいです、そしてこれは孤立したケースからはほど遠いです!
コンバージョン中心のランディングページのデザインは、一般的な雑然とした商用ページにランディングした後にユーザーが頻繁に経験する混乱を回避するのに役立ちます。
あなたは確かにあなたの訪問者の頭の中で同じ独白が起こることを望まないでしょう。
ランディングページと電子メールがユーザーを優しくガイドし、ユーザーに楽しくスムーズなエクスペリエンスを提供することを望んでいます。 あなたの目標は、あなたの聴衆とのつながりを保ち、彼らがあなたのブランドに興味を持ち続けることです。 あなたは彼らが楽に回心することを望んでいます。
コンバージョン中心の設計は、それを実現するために必要な正確なアプローチです。 説得力のあるデザインは、ユーザーがオファーの価値を認識し、行動を促すフレーズに基づいて行動するのに役立ちます。 ページ上のすべてのデザイン要素がコンバージョンを促進できると言っても過言ではありません。
したがって、レイアウトを作成するときに考慮する必要がある変換中心の設計の7つの原則を次に示します。
- 訪問者が集中するのを助けます。 ユーザーがオファーの意味を一目で把握できるようにします。
- ソリッド構造を作成します。 自然な流れを生み出すコンテンツ階層を開発します。
- 一貫性を維持します。 コンテンツに一貫性のある統一された外観を与えます。
- メリットを強調します。 すべてのデザイン要素を使用して、製品やサービスの生活がどれほど楽になるかを指摘します。
- CTAを目立たせます。 ユーザーが旅のどの時点でもコンバージョンできるようにします。
- 信頼を得る。 あなたの顧客や業界の専門家があなたの製品やサービスについてどう思っているかを示してください。
- 摩擦のない体験を作成します。 ページを整理して最適化し、より直感的で便利なものにします。
常にコンバージョン中心の設計を採用する必要がありますか? 私たちはあえてノーと言います。 この規則には、特定のCTAがない純粋に面白いページや情報ページ、または電子メールなど、いくつかの例外があります。 ただし、商用コンテンツでは、ほとんどの場合、変換指向のアプローチを取る必要があります。
シンプルでありながら強力なランディングページビルダー
Instagramのランディングページ、オンラインストア、またはバイオリンクページを作成し、単一のプラットフォームで電子メール、SMS、またはチャットボットメッセージを介してサブスクライバーにリンクを送信することで宣伝します。
ページを作成
原則1.ユーザーが集中できるようにする
どんなに複雑なアイデアでも、包括的で明確な方法で概説することができます。 今まで聞いたことのないことについてのテキストのページを読みたがる人は誰もいません。 二次的な詳細を省略しながら、製品またはサービスの主要な機能を提案して強調する必要があります。 コンテンツに方向性を注入して、ユーザーが2、3の文を読んだ後も順調に進んでいることを確認します。
それを行う最良の方法は、テキスト全体に焦点を作成することです。 焦点は視覚的に目立つ要素であり、通常は対照的な見出し、ファクトイド、または人間の顔などの画像の一部です。 テキストのスキャンが簡単になり、パンくずのように機能するため、ユーザーはあるセクションから別のセクションに移動してすべてを収集する必要があります。
それが実際にどのように機能するか見てみましょう。
安藤氏のメールデザインは、「より持続可能な明日のためのモバイルバンキング」という独自の販売提案を浮き彫りにしています。 強力な見出しの後には、読者がエコバンキングについてさらに学び、すぐに口座を開設するように動機付ける簡潔な説明が続きます。
ポジティブなイラストもありますが、それはショーを盗むものではありません—主な焦点はまだオファーにあります。 この例では、複雑なテキストをカスタムアイコンを伴う箇条書きに分割することがどれほど役立つかを確認します。 全体的な読みやすさが向上し、オーディエンスがこの銀行システムの主な利点をすぐに確認できるため、電子メールのコンバージョン重視が向上します。 大事なことを言い忘れましたが、法律用語が完全に欠如しているため、読者はオファーの意味に集中することができます。
以前、改善の余地があるレストランのランディングページを示しました。 それでは、コンバージョン中心のランディングページデザインの縮図を見てみましょう。
このページは本当にユーザーの注意を引き、それらのクッキーを切望させます—他のことに集中することは不可能です。 ポップな見出しと食欲をそそる写真は、ページが何であるかを即座に説明し、明確な説明が残りを行います。 ページの作成者は、初めての訪問者の気を散らさないように、ブランド履歴やユーザー生成コンテンツフィードなど、重要性の低いセクションをフッターの近くに配置しました。
原則2.堅固な構造を作成する
私たち人間と同じように、商用コンテンツにも強力で健全なバックボーンが必要です。これは、すべての要素を適切に維持するための構造です。 適切なメールまたはランディングページの階層は、ユーザーの認知度を高め、ブランドに対する信頼を高め、自然に簡単に変換するのに役立ちます。
見栄えの良いテンプレートを選ぶのは新人の間違いです。コンテンツを改良して犠牲を払う必要があります。 代わりに、精神的または手動でラフドラフトを自分で作成します。 目標を定義し、視聴者に伝える必要があることを概説します。 次に、その構造にぴったり合うテンプレートを探します。
これがその方法です—Diadoraからの特別オファーメール。
このコンバージョン中心の構造はまったくランダムではありません。ほとんどのeコマースメールの重要度は同じです。 上部にはすっきりとしたメニュー、注目を集める視覚要素、簡単な説明、CTAボタンがあります。 これらの重要な要素の後には、通常、少し重要性の低いクリック可能な製品プレビューと追加の説明が続きます。
頑丈な構造を持つことは、ブロックごとにブロックを追加し、電子メールやページをテキストや画像でぎっしり詰まらせることを意味するものではありません。 ネガティブなスペースや余白を確保することも同様に重要です。レイアウトに息を吹き込む空気を与え、軽量でシンプル、そしてエレガントに見せます。 空白は、残りの要素に注意を引くため、賢明に使用された場合にのみ変換を増加させます。
AI音声分析サービスのこの正確に組み立てられたランディングページをご覧ください。
このページは空白をうまく利用しています。 たくさんの情報がありますが、要素が互いに重なり合ったり、視覚的な競合が発生したりすることはありません。 それでも、このページはコンバージョンに適しています。対照的なCTAボタン、実用的なコピー、価値に基づくコンテンツが多数あります。 構造はそこにありますが、それはまた訪問者が呼吸するのにちょうど十分な空気を持っています。
原則3.一貫性を維持する
スタイルを試したり試したりするのは良いことですが、コンテンツアセットが認識され、権限を取得し、リードをリピーターに変えるための一貫した外観を維持する必要があります。 簡単に識別できるグラフィック要素、一意のフォントの組み合わせ、またはカラーパレット—ブランドに対応し、コンテンツを区別できるものを使用します。
ブランド認知度は、AppleやTeslaのような大企業が心配していることだけではありません。 あらゆる規模のブランドは、そのコアオーディエンスによって認識されるだけでなく、評価され、愛され、宣伝されます。 例として、緊急キットのプロデューサーであるジュディを取り上げます。
このメールをJudyのウェブサイトと比較すると、すぐに類似点に気付くでしょう。認識できる書体、同じ色合いのオレンジ、フレンドリーで思いやりのある口調、教育的要素、家族の安全の重視です。 断絶はありません—異なる媒体を通して、同じブランドと相互作用していると感じます。

ユーザーが特定の会社から定期的にメールを受信すると、その独自のコミュニケーションと視覚スタイルに慣れ、そのブランドからのメールを瞬時に認識するようになります。 視聴者との関係を深めたい場合は、毎回さまざまなチャネルで統一されたエクスペリエンスを視聴者に提供する必要があります。
原則4.メリットを強調する
メールのデザインとランディングページのデザインについてはブログにたくさん書いているので、顧客中心の利益重視のアプローチの重要性についてはすでに聞いたことがあるかもしれません。 これは、コンバージョンを増やすための重要な要素です。メリットにより、特定の製品やサービスが消費者にとって望ましいものになります。 あなたは機知に富んだコピーと魅力的な画像やビデオの助けを借りてそれらを強調することができます。
ベストセラー作家、講演者、リーダーシップの信頼の専門家であるDavidHorsagerを宣伝するランディングページを見てみましょう。
個人的なカリスマ性をテキストで伝えるのは本当に難しいですが、このランディングページは、そのわかりやすいコピー、説得力のあるレビュー、人目を引くビデオでうまくいきます。 このウェブサイトは、大企業がイベントで講演するためにデビッドを雇う理由と、彼が実際の価値をもたらし、すべてのイベント参加者にプラスの影響を与える方法を明らかにしています。 訪問者は、彼の専門知識について学んだ後、Davidのチームに連絡することをお勧めします。
また、特定のムードや雰囲気を伝えるために、選択した画像を通じて製品の利点を翻訳することもできます。
このメールでは、話をする代わりに、感情的な側面を利用して、運動と動きの力を祝うようにユーザーを招待しています。 アシックスのトレーナーを着てアクティブな生活を送っている自由奔放なキャラクターの本物の現実の写真が含まれています。 魚眼効果により、画像がより自然に見え、その雰囲気を完璧に捉えます。ペアを注文してAsicsコミュニティに参加するのは非常に魅力的です。
あなたの製品を宣伝したいですか?
SendPulseを使用すると、電子メールキャンペーン、Webプッシュ通知、SMS、Facebook Messenger、Telegram、WhatsAppのチャットボットなど、さまざまな種類のメッセージを好みの通信チャネルを介して送信することで、ターゲットオーディエンスに到達できます。
サインアップ
原則5.CTAを目立たせる
あなたのコンテンツはCTAなしでは無力のままです。 コンテンツのスクロールが必要な場合は、折り目の上に少なくとも1つの目立つCTAボタンがあり、テキスト全体に追加のCTAがあることを確認してください。 CTAのコピーを短くし、ユーザーが今すぐ行動を起こすように動詞を付けるアクティブな動詞を含めます。
Blendjetのリソースにアクセスして、コンバージョン中心のランディングページデザインのインスピレーションを得ることができます。
「今日すぐに」は、効果的なCTAの素晴らしい例です。 速達を提供する場合は、CTAにその旨を記載して、数時間または数日で商品を手に入れることができることをユーザーに知らせます。 このページには、「レシピの探索」などの追加のCTAも表示されますが、これらは意図的に透けて見えるため、目立たなくなります。
ブランドのカラーパレットに明るい色が含まれていない場合は、Under Armourのこの例のように、アクションボタンの呼び出しを大きくしてポップにすることができます。
経験則として、CTAのフォントの太さはプレーンテキストよりも重く、最初の見出しよりも軽くすることです。 ボタンはハイパーリンクよりもはるかに気づきやすくクリックしやすいので、あらゆる種類の商用電子メールでボタンを使用することを間違えることはありません。
コピーのサポートは必ずしも必要ではありません。ページやメールが少し雑然として見えるようになりますが、CTAが購入を示唆している場合は必要です。 その後、「返金保証」または「14日間無料でお試しください」は、ユーザーの疑問を解消し、最終的にコンバージョン率を高める可能性があります。
原則6.信頼を得る
社会的証明は、正しく使用すれば、視聴者の心の鍵となる可能性があります。 ブログで顧客のフィードバックを収集する方法についてはすでに説明しました。作業を開始するには、肯定的なレビューがあることを確認してください。
ロゴバーに限定しないでください。ロゴバーは、ビジネスに対する感情ではなく、一緒に仕事をしたブランドをほとんど示していません。 すべてのお客様の声を小さなサクセスストーリーに変えることをお勧めします。 あなたの社会的証明がより感動的で、多様で、本物であるほど、それはより信頼できるものになります。 クライアントが提供する準備ができている場合は、クライアントの本名、職業、写真を追加します。 しかし、もっと重要なことは、あなたの製品やサービスによって引き起こされた彼らの本当の印象や感情を説明するように彼らに依頼することです。
重力に逆らって働くことはオンライン栄養指導プログラムであり、彼らのクライアントは彼らの印象的な変容物語を前後の写真と共有することを躊躇しません。
顧客の信頼を勝ち取るもう1つの方法は、ブランドの伝統と豊かな歴史を顧客に思い出させることです。 それが、ファッションスポーツウェアブランドのセルジオタッキーニが好む方法です。
あなたのビジネスがローカルまたはグローバルな規模で文化的な影響力を持っている場合は、その事実を魅力的なストーリーに変えることもできます。 信頼性と誠実さ、そして品質へのこだわりを示す歴史のあるブランドに人々は惹かれます。
原則7.摩擦のない体験を生み出す
ユーザーエクスペリエンスは、コンテンツの読み込み速度から始まります。 ランディングページが重すぎてコンバージョンを妨げていると思われる場合は、推測せずに、Google PageSpeedInsightsを使用して確認してください。
次の例では、特殊効果やその他の重い要素を詰め込むことなく、素敵でカラフルなWebサイトを作成できることを納得させます。
Bombasは、耐久性のある靴下、下着、シャツを製造している会社です。 また、購入するたびにアイテムを寄付することで、ホームレスの人々をサポートしています。 この信じられないほどの目的主導型のビジネスは、使用するのが楽しいだけのシンプルで直感的なWebサイトのおかげで、どういうわけか下着の買い物をより快適にしました。
また、コンテンツを分析して、ユーザーフレンドリーでモバイルファーストにする必要があります。 1フィールドのフォーム、1列のレイアウト、レスポンシブデザインを使用して、外出先でメールやページを読みやすくします。 すべての電子メールの半分以上がモバイルデバイスで開かれていることに注意してください。
インターネットの速度が遅い場合でも、どのデバイスでもメールが正しく表示されるようにする方法が1つあります。シンプルさを取り入れて、コンテンツの繁栄やかさばる要素を意図的に取り除くことができます。
不完全で自然な感じのプレーンテキストの電子メールを好むという明確な傾向があるため、それは賢明な文体の選択にもなります。 クリーンでミニマルなメールは、スムーズなエクスペリエンスを生み出し、ユーザーを圧倒することなく、ユーザーにやさしくコンバージョンを促します。
それをすべて一緒に結ぶ
コンバージョン重視のデザインのこれらの7つの原則に従ってください。そうすれば、コンテンツに調和のとれたバランスの取れた外観を与えると同時に、新しいリードを獲得して顧客ベースを拡大することができます。 SendPulseツールを試して、今学んだことを実装することもできます。
ドラッグアンドドロップのランディングページビルダーから始めてみませんか? 必要な要素のみを含めることで、任意のテンプレートをカスタマイズし、変換モンスターを作成できます。 または、コードフリーのメールビルダーと自動化サービスでメールマーケティングキャンペーンを強化してください。 私たちのツールを使用すると、十分な創造的自由を手に入れ、コンバージョン率を高めるための新しい方法を開くことができます!
