CTAデザイン – 大きな違いを生む小さなディテール

あなたは素晴らしいアイデアをブレインストーミングします。 あなたはそれにぴったりのデザインを持っています。 そして、あなたの広告は適切な顧客の注意を引くことができます. しかし、彼らはそれを見て、広告をクリックせずにスクロールして通り過ぎます。 好きですか？ 明らかにそうではありません！ しかし、顧客が広告を無視した理由は何でしょうか? それはカラー パレットですか、それともコピーですか。 あなたは非常に多くの理由を考えるかもしれません。 しかし、CTA のデザインを精査しましたか? おそらくそうではありません。 それはおそらく最後に調べるものですが、理想的には最初にすべきです!

はい、CTA の設計が不十分であったり、CTA が不十分だったりするだけで、完璧な広告が無駄になることは望ましくありません。 実際、CTAが目的を果たさなければ「完璧な広告」とは言えません。

しかし、CTAには何がありますか? ほとんどの場合、単純な「ここをクリック」または「詳細」だけが表示されます。 聞こえます。 しかし、信じられないかもしれませんが、CTA ボタンの位置から選択した色、使用するコピー、フォント スタイルに至るまで、すべてが視聴者への影響に直接的または間接的に影響を与える可能性があります。 とても興味がありますか？ それでは準備を。 今日はCTAのデザインについてお話しします。

CTA のデザイン – では、なぜそれが重要なのでしょうか?

行動を促すフレーズまたは CTA は、広告のハイライトでなければなりません。 ほとんどのマーケティング グラフィックで CTA が最も重要な要素であることが判明した理由をいくつか見てみましょう。

1. CTAで広告の目的を明確にする

CTA を定義するには、広告の目的を知る必要があります。 たとえば、さまざまなプラットフォームでのすべてのキャンペーンについて、顧客が Web サイトのホームページにアクセスすることを期待していません。 これらの広告の中には、ユーザーにアプリをダウンロードしてもらいたいものがあります。 将来のリード育成の取り組みのために連絡先の詳細を収集できるように、リード獲得ページに誘導する必要がある人もいます。 また、商品をカートに追加してできるだけ早く購入できるように、顧客を販売ページまたは製品ページに誘導する必要がある場合もあります。

したがって、CTA は、キャンペーン、特定の広告、またはマーケティング デザインに設定した目的に基づいて、意図した方向にトラフィックを誘導するのに役立ちます。

2. 顧客の意思決定を支援する

顧客は自分が何を求めているかを知っていますが、それを信じているかどうかにかかわらず、ほとんどの消費者は購入の決定を下す際に多少の助けを求めています。 ほとんどの広告、ランディング ページ、およびその他のマーケティング デザインには、1 つまたは 2 つの CTA があります。 電子メールでは、一連の製品カテゴリまたはショッピング ガイドの電子メールに関する場合、複数ある場合があります。 いずれにせよ、CTA を追加することで、顧客は決定疲れを克服し、自信を持って次のステップに進むことができます。

3. コンバージョンの向上に役立ちます

場合によっては、顧客が次に進むべき場所がわからないという理由だけで、リード ファネルの次のステップに進まないことがあります。 CTAを追加すると、彼らがそれを理解しやすくなります。

これをよりよく理解するために、例を挙げてみましょう。 下のスライダーは、Apple の Web サイトに表示されます。

では、ルイ・アームストロングのブラック＆ブルースはどうですか？ Apple Web サイトでこれが表示されるのはなぜですか? おそらく、下部にある Apple TV のロゴは、このドキュメンタリーが Apple TV で利用できることを示しています。 しかし、だから何？ CTA「今すぐストリーミング」がなければ、上記の回答のほとんどは回答されていなかったでしょう。 混乱した顧客は、スクロールして通り過ぎたかもしれません。 しかし、CTA ボタンのおかげで、訪問者はそれをクリックすると Apple TV のストリーミング ページに問題なく移動できることを知っています。 これにより、ユーザーはスライダーをクリックするようになります。 そこで、ちょうど変換が行われました!

これは、コンバージョンを発生させる最も簡単な方法が、明確でわかりやすい CTA を追加する方法の例です。

CTA がデザインにおいて重要であるという事実を確立したので、CTA デザインのヒントについて話しましょう。

CTA のデザイン: クリックに値するものにするためのヒント

CTA は、デザインの中で明確に区別できる詳細である必要があります。 しかし同時に、その前にある重要な情報から顧客をそらしてはなりません。 ビジュアル、コピー、CTA を組み合わせて、メッセージを明確に提示し、CTA をクリックする理由とクリックすると何が起こるかを顧客に伝える必要があります。 これらすべてを実現するために、CTA をデザインに有利に機能させるためのヒントをいくつか紹介します。

1. コピーを少し調整するだけで大​​きな効果が得られます

広告または Web ページの見出しを読んだユーザーの 90% は、CTA のコピーも読んでいることを知っておく必要があります。 ですから、はい、コピーは重要です。

以下の CTA では、単純な「ダウンロード」CTA で十分です。 しかし、「無料」という言葉を追加することで、顧客は現時点で何も支払っていないことを安心させることができますが、コンテンツをダウンロードすることはできます.

パーソナライズされた CTA は、単純な CTA よりも 202% 優れていると推定されています。 したがって、コピーに十分な時間を費やしてください。 最も説得力があり、文脈に最も関連する言葉を特定します。

パーソナライズされた CTA は、顧客がボタンをクリックしたときに何が起こるかを簡単に知らせる方法です。 たとえば、以下のメールでは、衣装は「予約する」ボタンをクリックすると予約ページに移動することがすぐにわかります. そのため、予約をしたり、詳細を確認したりすることに本当に興味がある場合にのみ、それをクリックします。

したがって、パーソナライズされた CTA があれば、本当に関心のある見込み客だけがファネルのさらに下に移動することを確認できます。 これらは、変換される可能性が最も高い種類のリードです。 そして、彼らがリターゲティングするリードのようなものであることをあなたは知りません.

ヒント: CTA コピーの効果を最大限に高めるには、シンプルで読みやすいフォントを選択します。 派手なフォントや装飾的なスタイルは避けてください。 行動を促すフレーズは読みやすくする必要があります。

あまり多くの書体を使用せずに適切なフォントを組み合わせることは、圧倒的な作業のように感じますか? プロのデザイナーにお任せください。

2. CTAをボタンのように見せる

行動を促すフレーズがコピーの残りの部分と似ている場合、顧客はそこをクリックして次のステップに進むことができることをどうやって知るのでしょうか? そのため、CTA を他のコピーとは異なるものにします。

CTA をボタンのように見せるだけで、クリック率が 45% 大幅に向上します。 もちろん、デザインの残りの部分のビジュアル スタイルとブランドのビジュアル アイデンティティに応じて、必要に応じてフラット ボタンまたはスキューモーフィック (3 次元) ボタンをいつでも使用できます。 しかし、ボタンとして認識しやすい限り、訪問者がクリックする可能性が高くなります。

3. CTA に適した色を選択する

CTA のデザインの色を変えるだけで、CTA の外観と効果が大幅に変わることをご存知ですか? 実際、SAP は、オレンジ色の CTA ボタンがコンバージョンを 32.5% 増加させたことに気付きました。

もちろん、他の色があなたのブランドに適しているかもしれません。 これは、A/B テストを行うことで確認できます。 そのための 1 つの方法は、CTA 以外のすべてを保持した同じデザインの 2 つの異なるバージョンを作成することです。 これらの両方のデザインで異なる色の CTA デザインを使用し、どちらがコンバージョン率が高いかを確認します。 Web ページでアイデアをテストしている場合は、ヒート マップやその他の追跡ツールを使用して、訪問者の行動を理解し、デザインをさらに微調整することもできます。

色を選択したら、CTA が背景から目立つようにします。 CTAと背景に同じ色を使用することはできません。 CTA デザインの色と背景色、および全体的なカラー パレットの間に十分なコントラストが必要です。 CTA が簡単に認識できなければ、最高のコピーを使用した最高の CTA デザインでも役に立ちません。

上記の例では、赤い CTA が暗い色の背景から際立っています。 したがって、ユーザーが CTA に気付かないリスクはありません。

ヒント:色と色のコントラストは巧妙に機能します。 コントラストが最大の色を一緒に配置すると、視覚的な負担が大きくなることがあります。 配色と対照的な色の選択方法について詳しくは、カラー ホイールと配色に関するブログをご覧ください。

4. CTAデザインの不透明度に注意

CTA デザインが認識しにくいもう 1 つの理由は、CTA デザインの背景パターンと不透明度が原因である可能性があります。 透明または半透明の CTA は、混み合った背景で失われる可能性があります。 そのような場合、不透明なボタンは CTA をポップにします。 または、下のデザインの CTA の周りにハイライトなどの微妙な詳細を追加することもできます. このような詳細は、CTA の外観をさらに強化し、注目を集めます。

デジタル キャンペーン用のキャッチーなバナーを作成したいですか? 今日Kimpチームに連絡してください。

5. ネガティブスペースを有利に使う

CTA の周りにネガティブ スペースを追加すると、コンバージョンが約 230% 増加します。 これは、ネガティブ スペースを効果的に使用することで、CTA の周りの混乱をすべて取り除き、注意をそこに向けるためです。

上記のランディング ページでは、CTA の下にすべてのスペースがあるため、CTA が目立ちやすくなっています。目を引く CTA は、クリックされる可能性が最も高いものです。 そのため、ページにある CTA に気付かなかったために顧客が離れないようにするために、その周りに十分な量のネガティブ スペースを追加します。

6.CTAを追加しすぎない

理想的には、マーケティング デザインの 1 つの方向性を明確に定義する必要があります。 ターゲティングとオプションの提供は早い段階で行われます。 見込み顧客のカテゴリを明確に定義し、広告を正確にターゲティングする必要があります。 広告を分離すると、CTA の定義が簡単になります。 いくつかの例を紹介します。

• 潜在的な見込み客をターゲットにしている場合は、ブランドを紹介したり、ウェブサイトをチェックするよう説得したりするコンテンツが含まれている可能性があります。 このような場合、CTA はユーザーを Web サイトまたはソーシャル メディア ページに誘導して、より多くの情報を収集する可能性が高くなります。
• Web サイトまたはソーシャル メディア ページに到達したリードは、最初のレベルの関心を示しています。 次に、適切な戦略で彼らを説得します。 ここでは、ダウンロード ボタン付きのリード マグネットや、購読ボタン付きのリード キャプチャ ページを使用している可能性があります。
• 既存の顧客の場合、ウィッシュリストのアイテムまたは閲覧しているアイテムに関連するオファーを送信すると、CTA によって製品ページに移動します。
• また、メールアドレス宛てのカート放棄の場合、CTA は顧客をショッピング カートに誘導し、注文を続行します。

バイヤーが何を求めているのか、次にどこに向かうべきなのかを知るには、バイヤージャーニーをよりよく理解する必要があります。 これらすべての場合において、単一の CTA を持つことが最も理にかなっています。

リードファネルの初期段階にあるリードの場合、選択肢が多すぎると混乱が生じ、混乱したリードが決定を下さない可能性があります。

7. ただし、方向性が複数ある場合は一貫性を保つ

シンプルなマーケティング デザインの場合、単一の CTA で混乱が回避され、コンバージョンが増加します。 しかし、最大の効果を得るために複数の CTA が必要な場所もあります。 これは、ランディング ページや一部の電子メールなどの長い形式のデザインの場合です。

コンテンツが長く続く場合は、頻繁に休憩を取り、各セクションに CTA を追加する方が、顧客がページの最後まで読んでそこで CTA を見つけることを期待するよりもはるかに優れています。

または、ランディング ページまたはメールが、顧客が購入する一連の製品オプションを表示するショッピング ガイドの形式である場合、オプションごとに異なる CTA が最も理にかなっています。

複数の CTA があるこれらすべてのケースでは、それらの間で視覚的な一貫性を確立します。 各 CTA デザインが他と異なって見えると、全体的なデザインがぎこちなくなります。 保持するいくつかのことは次のとおりです。

• CTAボタンの形と色
• CTA コピーで使用されるフォント
• ボタン内の CTA コピーの配置
• CTA ボタンの向き

以下のランディング ページにはセクションごとに異なる CTA がありますが、CTA のデザインはすべて一貫しているように見えます。 ページがより整理された外観になります。 また、ユーザビリティの観点から言えば、顧客がこれらの CTA をいくつか見れば、Web サイトで同様の緑色のボタンが表示されていれば、それが別のステップへのクリック可能なリンクであることがわかります。

Kimp でクリックに値する CTA デザインを作成する

CTA は、顧客を意図した方向に導くことで、ほとんどのマーケティング デザインを完成させます。 そのため、メール、ランディング ページ、バナー広告、および CTA が関連していると思われるその他すべてのマーケティング デザインに 1 つ追加することを忘れないでください。 CTA は印刷広告にも表示され、ここでは主に Web サイトのアドレスまたはビジネスの連絡先情報になります。 それでも、顧客が望むアクションを実行できるように、他のデザインとは一線を画す必要があります。 デザインの構造をいじらずに CTA を追加する場合、または CTA を使用する場所と方法を理解するのが混乱するように思われる場合は、デザイナーに任せてください。 Kimp サブスクリプションを選択します。 今すぐ無料トライアルに登録してください。