カテゴリー
メルマガデザイン

メルマガCTA事例を集めて、学んだことをもとに実際に作ってみた!

「メルマガCTAがクリックされない…」とお悩みの方必見!事例から学ぶ効果的なCTAバナーの作り方。配置場所、デザイン、キャッチコピー、色使いなど、実践的なノウハウを解説!

\ 記事をシェアする /

この記事では、セミナー、アプリ、特集ページ、セール、キャンペーン、クーポンなど、目的別にさまざまなメルマガCTAバナーの事例を紹介します!

これらの事例から、効果的なCTAを作成するためのヒントを学び、実際にセミナー集客用のバナーを作成してみました。

CTAの重要性や種類、具体的な作成のポイント、そして学んだ知識をCTAバナー作成に反映する方法も解説!

▼しっかり届くのに、シンプル。20年以上愛されているメルマガツールの詳細はこちら▼

なぜCTAが重要なのか?

CTAとは「Call To Action」の略で、Webサイトを訪れたユーザーに起こしてほしい行動を促すためのものです。

メルマガのCTAが反応しやすいものになると、以下のようなメリットがあります。

CV達成につながる

読者が次の行動を起こしやすくなるため、コンバージョン数(商品購入、資料請求など)が向上します。

魅力的なCTAはクリックされやすくなり、目標達成や売上アップに貢献します。

効果測定がしやすい

CTAのクリック数や、CTAを通じて達成されたコンバージョン数は、Web解析ツールやメール配信ツールで簡単に計測できます。

デザインや文言、配置場所などを変更した複数のパターンを用意し、どれが最も効果的かを比較する「A/Bテスト」を実施しやすいのもCTAのメリットです。

A/Bテストの結果を分析することで、より効果的なCTAを追求できます。

目的別メルマガCTAバナー事例集

それではCTAバナーの事例を「セミナー・アプリ・特集ページ・セール・キャンペーン・クーポン」の目的別にみていきましょう。

バナーに書く内容やレイアウトも参考になります!

セミナーバナー

参照:TECH PLAYのメルマガバナー

・内容:参加企業、セミナーで学べること、参加したくなるメリット、開催日時

アプリ・会員への誘導バナー

参照:チケットぴあのメルマガバナー

・内容:アプリを入れるメリット、実際の画面、各機種のダウンロードボタン

特集ページ誘導バナー

参照:アソビュー!のメルマガバナー

・内容:ビジュアル画像、記事のタイトル、見る動機

セールバナー

参照:マルイのメルマガバナー

・内容:対象商品画像、割引内容、セール期間

キャンペーンバナー

参照:楽天ポイントクラブのメルマガバナー

・内容:キャンペーンのメリット、参加条件、キャンペーン期間

クーポンバナー

参照:ANAのメルマガバナー

・内容:割引内容、使える条件、メルマガ限定の場合は限定をアピール、期間限定の場合は期間。

反応されやすいCTAバナーを作るコツ

それでは事例を見ながら、反応されやすいCTAバナーを作るポイントを学んでいきましょう!

配置場所

CTAバナーの配置場所は、ユーザーの視線が集まりやすく、クリックしやすい場所を選ぶ必要があります。

ファーストビューに設置する

ファーストビューとは、メルマガを開いたときに最初に目に入る領域のことです。

ここにCTAバナーを配置することで、ユーザーに最初にアピールすることができます。

途中や最後に設置する

メルマガの途中や最後にCTAバナーを配置することで、ユーザーに情報を読ませた上で行動を促すことができます。

特に、メルマガの最後はユーザーの満足度が高まっている状態なので、CTAバナーをクリックしてもらいやすいと考えられます。

メルマガの内容に合わせてCTAバナーのデザインや文言を調整することも効果的です。

CTAの目的と数

メルマガの目的は多岐にわたりますが、ひとつのメルマガで複数の目的を達成しようとすることは非効率です。

読者の集中力を散漫にし、結果としてどのCTAもクリックされない可能性があります。

そのため、ひとつのメルマガにつき、ひとつの目的に絞りましょう。

しかし、CTAは複数設置した方が効果的です。

読者が見るタイミングや興味を持つポイントはさまざまです。

複数CTAを設置することで、読者のタイミングに合わせたアクションを促し、機会損失を防げます。

クリックできる場所を明確にする

CTAバナーを設置する際は、クリックできる場所だと明確にする必要があります。

参照:GUのメルマガバナー

GUのメルマガでは、「ショップを見る」「チェックする」などの行動を促す文言とともに、矢印や枠をつけることで、クリックできる場所だとわかるようにしています。

これにより、読者は迷うことなくCTAバナーをクリックし、目的のページへ遷移することができます。

魅力的なキャッチコピー

キャッチコピーの内容によって、CTAをクリックするかどうか大きく影響してきます。

読者の悩みや課題、求めている情報や価値を書く

キャッチコピーには、読者が抱えている悩みや課題、求めている情報や価値を盛り込むことが効果的です。

読者は、自分に合った情報や価値を提供してくれるものに興味を示します。

そのため、読者のニーズに合わせたキャッチコピーを作成することで、クリック率を高めることができます。

例:「毎日の料理が楽になる!時短レシピ集」

緊急性や限定性を加える

キャッチコピーに緊急性や限定性を加えることで、読者の行動を促すことができます。

「期間限定」「数量限定」といった言葉は、読者に「今すぐ行動しなければ」という感情を与え、クリック率を高める効果があります。

ユーザー目線の動詞

CTAに記載するテキストは、「ユーザー目線の動詞」にすることが効果的です。

たとえば、「詳細を見る」ではなく「申し込む」というように、読者の視点に立った言葉を選ぶことで、より自然な形で行動を促すことができます。

参照:バイトルのメルマガバナー

たとえば、上記のバイトルの事例では、「アプリをダウンロードする」と表記しています。

より具体的な行動を促す言葉を使用することで、読者の迷いを減らし、クリック率向上に繋がる可能性があります。

色の選びかた

メルマガのCTAを目立たせるためには、色使いが重要な要素となります。

背景と対照的な色を選ぶ

CTAの背景色とテキストの色は、互いに対照的な色を選ぶことで、CTAを際立たせることができます。

たとえば、背景色が白の場合、テキスト色は黒や青などの濃い色を選ぶと、視認性が高まります。

コントラストが高い色を選ぶ

CTAの背景色とテキストの色は、コントラストが高いほど、読者の目に留まりやすくなります。

たとえば、明るい背景に濃い色のテキストを使用したり、彩度の高い画像を使用したりすると、CTAの存在感を高めることができます。

季節感やイメージカラーを選ぶ

季節に合わせた配色や、ブランドのイメージカラーをCTAに採用することで、メルマガ全体の統一感を高め、読者に親近感を与えることができます。

たとえば、夏のメルマガであれば、涼しげな青色や水色をCTAに採用したり、クリスマスのメルマガであれば、赤色や緑色をCTAに採用したりすると効果的です。

文字が読みにくいと感じる時は?

背景の情報量が多い場合、CTAのテキストが読みにくくなることがあります。

このような場合は、テキストに影をつけたり、下に色を敷いたりすることで、可読性を高めることができます。

参照:マルイのメルマガバナー

視線誘導を意識

読者の視線を誘導し、クリック率を高めるためには、いくつかのポイントを押さえる必要があります。

Z型レイアウトの活用

バナーのように多くの要素が混合するレイアウトには、Z型レイアウトが適しています。

Z型レイアウトとは、アルファベットの「Z」に沿って視線が移動するレイアウトのことです。

Z型に沿って情報を配置することで、読みやすい流れのバナーを作成することができます。

参照:三井住友カードのメルマガバナー

最終的に視線が右下に止まるので、右下にアクションを起こさせる言葉を設置することによってユーザーの行動を促しやすいメリットもあります。

大きさや太さでメリハリをつける

型以外にユーザーが視線を惹きつけられるものとして、「大きいもの・太いもの」があります。

たとえば、大きいものに目が惹きつけられ、その後に小さいものへ視線が移動していきます。

上記のバナーでは、一番目立たせたい「10万円」のテキストを一番太く大きくしています。

すべてが同じサイズのテキストだと、どこから読んだらいいのか、どれが大切なのかが伝わりにくくなってしまいます。

メリハリがつきバランスもとれるので、一番見せたい部分や、何のバナーなのかを表すテキストを大きくしてみましょう。

適切なフォントサイズと行間

メルマガの読みやすさを向上させるためには、適切なフォントサイズと行間を設定することが重要です。

PC、スマホどちらでも読みやすいフォントサイズか、テストをして確認をしておきましょう。

メルマガのフォントサイズや行間は、読者の年齢層やメルマガのデザインによって調整する必要があります。

たとえば、高齢者向けのメルマガでは、フォントサイズを大きくしたり、行間を広げたりすると、より読みやすくなります。

特に重要なポイントは、文字間隔よりも行間が広くなるようにすることです。

行間が広いと、読者は一行ずつスムーズに読み進めることができます。

上記のように、行間が文字間隔よりも広い場合、文章が読みやすいですね。

一方、文字間隔と行間が同じ、もしくは行間の方が狭い場合、読者は文章を読む際にストレスを感じてしまう可能性があります。

読みやすく、わかりやすいことを大切にして、バナーを作ってみてください!

実際にメルマガバナー作ってみた!

メルマガのCTA事例を参考に、セミナー集客用のバナーを実際に作成しました。

事例で学んだ「参加企業、セミナーで学べること、参加したくなるメリット、開催日時」を盛り込み、ターゲット層に響くデザインを目指しました。

作成したバナーがこちらです!

右側には、弊社のキャラクターを配置し、セミナーをイメージさせるキーボードを打つ写真を使用しました。

作りながら考えたこと

全体的に彩度が高く明るい色を選び、目を引くように工夫しました。オレンジと黄色の同系色で統一感を出しています。

「メルマガセミナー」は、最初に目が行くようにコントラストの高い白字に黒文字を使用しています。

文字サイズも「メルマガセミナー」を一番大きく太文字にし、メリハリをつけました。

メリットについては、「秘密」というワードを入れたり実績をアピールすることで、参加したら有益な情報が得られると思わせる書き方を意識しました。

視線誘導については、Z型の流れを意識してレイアウトしました。

情報がスムーズに伝わるように配置し、流れが止まる右下に「参加する」ボタンを設置しました。

作ってみた感想

視線誘導を意識してみると、どこに何の要素を置いたらいいかの指標になり、スムーズにレイアウトを考えられました。

作る際に優先順位をつけておくと、レイアウトの際に迷わず、目的から離れにくくなりました。

ぜひ皆さんも作ってみてくださいね!

まとめ

この記事では、メルマガCTAの重要性と、読者の行動を促す効果的なCTAバナーの作成方法について解説しました。

さまざまな事例から、CTAの配置場所、デザイン、文言、色使い、視線誘導など、考慮すべき要素が多いことがわかりました。

特に、キャッチコピーは読者の興味を引く上で重要であり、短く分かりやすい言葉で読者の悩みや課題、クリックするメリットを具体的に記載することが効果的です。

また、CTAの色使いは、背景色と対照的な色を選ぶことでCTAを目立たせることができます。

この記事で得られた知識を活かし、読者の行動を促す効果的なメルマガCTAを作成し、コンバージョン率アップを目指しましょう!

コンビーズメールはシンプルで続けやすいメルマガ!

 

弊社のメルマガサービス「コンビーズメール」は、初心者でも始めやすく、続けやすいことが強みです。一番の強みは他社にないシンプルさはじめてのメルマガに挑戦する方にぜひオススメのツールです!

使い方がとにかくシンプル!

分析も必要最小限なので混乱しない!

月額4,400円〜でリーズナブル!

ぜひこの機会に、始めの一歩を踏み出しましょう!

▼資料請求はこちら▼

    必須企業名、担当者名

    必須メールアドレス

    任意電話番号

    必須該当項目をお選びください

    この記事のライター

    宇都宮凛奈

    ライターとしてまだまだ成長中。いろんなデザインを見るのが好き。空と海の写真を撮るのが趣味。

    この記事の監修

    川上サトシ

    合同会社ぎあはーと 代表

    Webマーケター。
    ヴァイオリニストとして活動していた20代の頃、Webマーケティングの重要性を痛感。骨董品のEC管理や食べログの営業を経て、Webコンサル会社のマーケティング担当となる。引っ越し企業のサイトをSEO施策により【半年で1万PVから20万PVまで成長させる】、上場アパレル企業の【売上を1年で3倍にする】など数多くの実績を残して会社設立。専門はSEOと広告運用。
    ルリニコクのヴァイオリニストとしても活動中。

    メルマガに関するブログ記事の一覧

    \ 記事をシェアする /