10年教えて分かった、確実にアクションへ繋げるバナー広告を作る4つのポイント

1994年、世界で初めてのバナー広告は、How Wired に掲載された大手通信会社の AT&T が出したものだと言われています。インターネットの普及と共にバナー広告は、徐々に活用されてきました。

バナーという言葉自体は、特定の Web ページを紹介する役割をもつ画像を意味します。バナー広告の基本については、以下の記事で説明しています。「バナー広告とは？」という悩みのある方は、まずはこちらの記事をご覧ください。

近年、画像を含む広告を出す場合、レスポンシブ広告を使うことが増えてきました。しかし今でも、Google や Yahoo! でもバナー広告の形式は採用されています。

それはバナー広告が、自由に画像と文字の構成ができるため、伝えたいことに合わせた表現をしやすいという特徴があるからだと考えられます。

どんな広告でも「伝えたいことを、伝わりやすくするためにはどうすればいいか」を考えるのは基本中の基本です。

今回の記事では、Google 広告と Yahoo! 広告を対象に、バナー広告を作るときのポイントと具体的な方法を説明します。

“バナー広告で達成したいことを明確にする”ことが重要

バナー広告を作るときに、まずは達成したいことを決めるのが重要です。バナー広告を表示することが目的ではないはずです。広告が表示されたあと、ユーザーにどのような反応してほしいのかまでを考えましょう。

多くの場合、「バナー広告をクリックしてほしい」、また「広告をクリックしたあとにコンバージョンしてほしい」と思っているでしょう。

ユーザーに反応してもらう広告、言い換えるならアクションにつながるバナー広告を作る必要があります。

広告を作るときは、達成したい目的から考えるのが重要です。達成したいことがコンバージョンであれば「バナーにどんな要素を入れるとコンバージョンに繋がるのか」と考えます。

コンバージョンという結果を期待したいのであれば、明確な目的が必要です。目的が曖昧だと、結果も曖昧になり、結果的に期待する効果を得られません。

広告作成に一貫性を持たせるためにも、まずはバナー広告で達成する目的を決めましょう。

スタートは“広告で伝えたいことの整理”

バナーに入れるのは画像とテキストです。広告に入れる情報は、広告を通してユーザーに何を伝えたいのかから考えるのが基本です。

ユーザーにアクションしてもらうことを考えると、ユーザーにとって必要で一定のメリットがある情報でなければなりません。

広告を出す目的がコンバージョンなのであれば、バナーにコンバージョンに関する情報も入れます。

たとえば、弊社の検索キーワード広告プロフェッショナル養成講座の場合で考えると、広告に入れたいのは次のような情報です。

情報	詳細
画像	・講座で配布するレジュメ（資料）の画像 ・PC で講座を受講している画像
テキスト	・検索キーワード広告のノウハウを体系的に学べる ・動画で繰り返し学べる ・最新の Google 広告と Yahoo! 広告で成果を出せるノウハウを学べる
コンバージョン	・100ページ以上ある資料ダウンロード

上記のように、画像もテキストも複数アウトプットしてみましょう。バナーに入れる材料を用意したあとは、ユーザーにとって必要か、メリットのある情報かを必ず確認しましょう。

表示機会の多いバナーサイズを優先して作成

バナーのサイズは、横長や縦長、正方形といろいろあります。詳しくは下記の記事をご覧ください。

理想はすべてのサイズのバナーを作成することです。ただ、すべてに対応するとなると時間がかかります。他社に依頼して作成する場合、お金もかかります。

そこでまずは、表示機会の多いバナーを優先して作成しましょう。Google 広告と Yahoo! 広告でいうと、表示機会が多いのは、縦300×横250ピクセルのバナーです。初めにこのサイズのバナーから作成してみましょう。

デザインの基本を理解

バナーを作るとき、「どのようにデザインするといいのか？」と悩む方が多いです。デザインについて考えるべきは、配色や使用するフォント、構図（レイアウト）などです。

これらを考慮したバナーを作るにはデザインセンスが求められます。デザインセンスと聞くと「かっこよさ」や「美しさ」が思い浮かぶかもしれません。

しかしデザインセンスで本当に大事なのは、選定するフォントの種類や余白の使い方、画像とテキストのバランスなどです。

たとえば、濃い色の背景の上に同じような濃い色のテキストを載せると読みにくいバナーになります。こうした間違ったデザインになると、せっかく用意した伝えたい情報が台無しになり、良い情報がデザインにより殺されることになります。

デザインによって広告の印象は変わるので、広告を見てほしい人に分かりやすいデザインにしましょう。

以下の記事で、広告運用者でも最低限おさえておきたいデザインについての基礎知識を解説しています。バナー広告作成の際のヒントになるので、お時間があるときに是非ご覧ください。

他社事例を見てインプット

バナーに入れる画像とテキストは用意したけど、「どんなデザインにすればいいのか？」のイメージができない方は、まず、バナー広告の事例をたくさん見てインプットすることからはじめましょう。以下のサイト参考にしてみてください。

• バナーデザインアーカイブ｜バナーのデザインをまとめてチェック！
• レトロバナー: バナーデザイン専門ギャラリーサイト
• バナーデザインまとめ。｜Banner Matome｜HOME

バナー広告を作ってみる

バナー広告を作る方法は、自力で作成するか、他の人に依頼するかです。まずは、自力で作成する方法を紹介します。

ツールを用いて自力でバナーを作成する

バナーを作成する際は画像を作成するツールを活用しましょう。画像作成ツールは、オフラインからオンラインで使えるツールまでいろいろあります。

プロのデザイナーが使うことが多いのは、有料だと Photoshop や Illustrator でしょう。無料でも使えるツールだと、GIMP や Pixlr エディターが人気のようです。初心者の場合、プロ並のデザインも実現できる Canva というツールがあります。

簡単な操作だけでいうと、Windows に入っているペイントも使用できるツールといえるでしょう。

他にもツールはいろいろあるので、「画像作成ツール」などで検索してみてください。無料で使えるツールも多いので、実際に色んなツールを試してみるとよいです。

いろいろある中で試してみるとよいのは、Google が提供する無料ツール Google Web Designer です。

広告検証ツールから広告を選択し、バナーをクリックすると作成画面が開きます。

Google 広告のバナーサイズがテンプレート用意されているので、任意のサイズを選択します。文字入れやアニメーションも加えることができるので、まずは Google Web Designer で作ってみるのもいいでしょう。

ツールの操作方法は、調べるとある程度理解できますが、一番悩むのはデザインに関することだと思います。

バナーを作るときは、伝えたい情報を画像とテキストで表現をして、細かい調整をします。しかしこの調整がとても難しく、つまずくポイントでもあります。

調整では、配色やサイズ変更、画像とテキストの配置を決めます。中でも最初に悩むのは、伝えたい情報をそれぞれどの位置に置くかです。

そこでオススメなのは、他社のバナーを参考に作成することです。他の人が作成したバナーにある要素を、分解し、自分が入れたい情報に置き換えて作る方法です。具体的には、次の順番で作成します。

1. 他社のバナーを探す
2. 広告要素の分解する
3. 各要素を自社の情報で置き換える
4. 配色を決める

1．他社のバナーを探す

まずは、バナーを探しましょう。こちらの記事で、バナー広告がまとまった参考サイトを紹介しているので参考にしてみてください。もちろん、みなさんが普段見ているサイトに出てくるバナー広告を使うのでも大丈夫です。

今回は、私もサービスを利用している KDDI さんのバナー広告を参考にします。以下の画像は KDDI さんが提供する、テレワーク導入方法をまとめたガイドブックのダウンロードを促すバナー広告です。

今回このバナー広告を選択したのは、広告のコンバージョンポイントが無料のガイドブックダウンロードになっていて、自社のコンバージョンポイントに類似しているためです。

2．広告の要素を分解する

1枚の画像であるバナー広告を見ると、いろんな要素で構成されていることが分かると思います。

まずは、広告に含まれる画像とテキストの一つ一つを分解しましょう。上記の画像は、次のように分解できます。

伝えたいこと1.2には、バナー広告を出したい人に対して伝えたいことをテキストで入力します。

3．各要素を自社の情報で置き換える

分解した各要素に、用意した情報を入れます。ポイントで説明した、自社が広告に入れたい情報を各要素に入れるのです。

伝えたいテキストが多いときや画像を複数選定した場合は、優先度を考えて入力しましょう。

項目	詳細	優先度
画像	・講座で配布するレジュメ（資料）の画像 ・PC で講座を受講している画像	高 低
テキスト	・検索キーワード広告のノウハウを体系的に学べる ・動画で繰り返し学べる講座 ・最新の Google 広告と Yahoo! 広告で成果を出せるノウハウを学べる	高 中 低
コンバージョン	・100ページ以上ある資料ダウンロード	高

上記のように項目ごとにわけて、優先度を考えてみるといいでしょう。自社の情報に置き換え作成したバナー広告が以下のようになります。

4．配色の設定

配色は、広告をクリックしたあとに表示されるページを参考にするとよいです。検索キーワード広告プロフェッショナル養成講座の場合は、グレーっぽい色や赤色を使用しています。

配色だけでなく、フォントの種類やサイズなども変更してみましょう。「どう改善すると、広告を出したい人に反応してもらえる広告になるか」を考えて調整してみてください。ただ、こうした調整にはデザインの知識や経験が求められます。

自力での対応が難しい場合は、バナー広告を作成した経験のある方に続きの対応をお願いすることを検討しましょう。

他の人に依頼して作成する方法

他の人に依頼するときは、ランサーズやシュフティなどのクラウドソーシングサービスを利用するとよいです。

依頼するときは、まず確認するのは費用と納期です。クラウドソーシングだと、1つのバナーであれば安ければ1,000円以下で受けてくださる方もいます。

費用と納期以外に必ず確認してほしいのは、制作実績です。デザイナーによって、得意・不得意なデザインもあります。

「自分のイメージするバナーを作成してくれそうな方か」を確認するためにも、制作実績の共有はしてもらいましょう。

デザイナーとの意思の疎通は特に大切です。目的がデザイナーの認識とずれていると、良いデザインになりません。そのため、バナーを作成する趣旨も必ず伝えましょう。

ポイントはバナーで達成したい目的と、どんな人に見てほしいかを共有することです。デザインの指示を細かくしすぎると、デザイナーの力が出ないので、注意が必要です。

初めにおおまかな方向性、信頼できる、アットホーム、やさしい感じなどを伝え、細かいデザインはデザイナーにお任せするのがオススメです。

アクションにつながるバナー広告の作成を

バナー広告を作成するとき、今回のポイントを参考にしていただけると嬉しいです。

バナー広告の作成から広告運用まで相談できるキーワードマーケティング研究会。運用型広告からランディングページの改善、マーケティング全般の悩みまで相談できます。詳しくは以下のページを御覧ください。