バナー広告は今、オンライン上で最も多く利用されているマーケティング形態の1つです。どの企業も、ブランドの認知度を高めるために、何らかの形でバナー広告を使っています。それだけ手頃で成果が見えやすく、効果的な手法なのです。そして、それに伴いバナー広告をデザインする仕事も増えています。

ではここで、クライアントからバナー広告の制作を依頼されて、キラーコピーを提示されたと想定してみましょう。ここからがデザイナーであるあなたの腕の見せ所です。クリック率の高いバナー広告を作りましょう。以下に、バナー広告をデザインする際のポイントと一般的なガイドラインをまとめたので、参考にしてください。

1. バナー広告は標準的で最適な大きさにする

sizes

Google Adsenseが推奨する最も効果的な広告サイズは、以下の通りです。

・ 336×280 レクタングル(大)
・ 300×250 レクタングル(中)
・ 728×90 ビッグバナー
・ 160×600 ワイドスカイスクレイパー

ウェブサイト上で目に留まりやすいのは、アバブ・ザ・フォールドや主要コンテンツの近くです。理想を言えば、このような広告スペースをクライアントに買ってもらいたいものです。

2. 優先順位は守る

バナー広告の作成において一番大事なのは、ブランドの認知度を高め、ウェブサイトへのアクセスを促すデザインにすることです。以下は基本となる3つの要素です。

1. 企業ロゴ: ブランドの認知度を高める上で、企業ロゴは欠かせません。ロゴは目立つように表示しましょう。ただ、下記の価値提案や行動喚起の要素よりは控えめにする必要があります。

2. 価値提案: 価値提案とは、ブランドが提供するサービスや製品を紹介して、製品の魅力的や特典、特別価格などで顧客の興味を引くことです。例えば「高品質」「50%オフ」「期間限定」「無料!」などの言葉を使います。この要素には、広告の大半のスペースを割り当てて、最初に目が行くようにしましょう。

3. 行動喚起: 通常、行動喚起には「ここをクリック」「詳しく見る」「今すぐ見る」「登録はこちら」などと書かれたテキストやボタンを使います。広告の中でひときわ目立たせ、見た人がクリックしたくなるようにしましょう。

3. デザインはシンプルにする

Simple

見た目も内容もシンプルなデザインにしましょう。サイトを訪れた人がバナーを見るのは、わずか1秒程度です。

4. ボタンをうまく使う

buttons

バナー広告の種類によっては、ボタンによってクリック率(CTR)が上がることが知られています。広告にボタンを使う場合は、コピーの下や右下のエリアに配置しましょう。また、(センス良く)コントラストの効いた色を使い、一連の広告で見た目に統一感が出るようにしてください。

5. バナーにはっきりとした枠線を付ける

frame

人の目は、自然と枠線の中にあるものに行きます。ですから、すべてのボックスの縁にグラフィック処理を施して、くっきりとした枠線でバナー広告を囲みましょう。

白い広告の場合は、1ピクセルの灰色の枠を付けるのが一般的です。他の色の場合は、淡い色の枠を使ってもいいでしょう。例えば上のNetflixの例のように、フェイントブラックの枠で縁取りをすると、少しポップな雰囲気が出ます。

6. 瞬時に読めるテキストにする

readable

推奨: 見出しとボディー・コピーには違うサイズのフォントを使用し、両方合わせて4行以下に収める。

非推奨: 草書体、スクリプト系、または極端に細いフォントを使う。コピーをすべて大文字にする。10ptより小さいフォントを使う(免責事項や著作権表示は除く)。

7. 企業ブランドと統一感のあるデザインにする

consistency

8. 適切なファイル形式を使う

File_Formats

最終的には送りやすい、Adobe Illustrator、Photoshop、Flashを使って、JPG、PNG、GIF、Adobe Flashファイルとして作成すると思います。ここで注意してほしいのが、すべてのデバイスがFlashのバナー広告に対応しているわけではないということです。確実にクリックしてもらいたいのなら、GIF形式でバナーを作成するようにしましょう(詳しくは、こちらの記事をご覧ください)。

9. ファイルサイズは小さくする

ファイルサイズは小さいほど良く、Google AdWordsでは150キロバイト以下を推奨しています。広告がウェブサイトに読み込まるまでに時間がかかると、閲覧者はページを下にスクロールして広告を見逃してしまいます。

10. 本当に必要な時だけ画像を有効に使う

relevant

画像やグラフィック、写真は、広告のメッセージ性を高め、クライアントの製品をすぐに連想させるようなものを選びましょう。コンセプトがあいまいではダメです。プロの写真家やスーパーモデルを雇う余裕がない方は、お手頃なストック写真のライセンスを買うのがお勧めです。その中にも質の高い写真はたくさんあります。

とはいえ、広告に必ずしも写真や画像を使う必要はありません。キラーコピーや優れたタイポグラフィがあれば、テキスト広告でも十分効果的なものに仕上がります。

11. 期限が迫っていると感じさせる

LimitedTimeDeal

コントラストの効いた大胆な色を使って、テキストを見た人に期限が迫っていると思わせましょう。すべてのウェブ広告が、さりげないものである必要はありません。

12. ふさわしい色を使う

colors

ここで色について触れましょう。すべての色は異なる感情を引き起こします。そのため、見る人にどのような気分になってほしいかを、よく考えることが重要です。色は広告で最初に認識する要素なので、ぜひオシャレな色使いをしてください。

色には主観的な面もあり、そのとらえ方は文化によって異なります。色を選ぶ時には、対象となるオーディエンスについて研究するようにしましょう。以下に、各色に対して西洋人が抱くイメージをまとめました(詳細はこちらの記事をご覧ください)。

広告には、これらの色が複数使われ、その組み合わせによって全体的な雰囲気が決まります。

* 赤: 赤は危険や情熱、怒り、興奮、スピード、愛情などを表す色です。人を引きつける最もパワフルな色で、食欲が出る色としても有名です。赤は程よく使うようにしましょう。

* オレンジ: オレンジは活気や幸せを象徴する色です。赤ほど圧倒される感じはなく、元気があって、魅力的で親しみやすい色です(ボタンを押すというアクションを起こさせるには最適な色です)。

* 黄色: 黄色はユーモアや日光、明るい気分、エネルギーなどを感じさせる色です。アクセントに使うと、見る人の注意を引くことができます。ただ、オレンジや赤よりも強い色なので、慎重に使いましょう。黄色は大半の色の光を反射させるので、使い過ぎると目を刺激してしまいます。

* 緑: 緑が象徴するのは、健康や爽快感、豊かさ、自然、成長、育成、新たな始まりなどです。最も目に優しい色です。

* 青: 青から連想するのは、安心、信頼、鮮明、平穏、聡明、整然、優美、真実、爽快、冷静、冷淡、勇敢などの言葉です。

* 紫: 紫のイメージは、高級感や気品、豪華、知恵、魔力、野望、女性らしさ、創造性などです。見る人の神経を静め、リラックスさせる効果があります。

* ピンク: ピンクは愛情やかわいらしさ、女性らしさ、幼い子どもを連想させます。女性らしい色と言えば、まずピンクでしょう。

* 黒: 黒は、近寄り難さ、邪悪さ、謎、力、高級感、嘆き、秩序などを感じさせるスタンダードな色です。白の背景に黒文字をまとめて使うのが、最も読みやすい色の組み合わせです。

* 白: 白には純潔や潔癖、現代的、清潔、シンプル、誠実、純真、無垢、高潔などのイメージがあります。

* 茶: 茶色のイメージは自然や木、皮、謙遜などです。強い色と一緒に使うとバランスが取れます。背景色やテクスチャにも適しています。

* 灰色: 中庸性や実用性を象徴する色です。背景として使うと、他の色を引き立てる効果があります。

なお、バナー広告はスクリーン上にのみ表示されるものなので、デザインをする時はRGBカラーモードを使いましょう。

13. アニメーションの利用を検討する

GIF

一般的に、アニメーション広告は静的なバナー広告よりも有効で、バナーのデザインを引き立てる効果があります。ただし、広告メッセージの妨げにならないよう注意が必要です。

アニメーションはシンプルなものを使うようにしましょう。長さは15秒以内に収め、繰り返しは3回までにしてください。アニメーションの最後のフレームで、見ている人にアクションを起こさせることも重要です。

14. ベースとなるWebサイトになじみつつも目立つ広告にする

Compliments

バナー広告が掲載サイトになじんでいれば、見る人の信頼感は高まります。でも、なじみ過ぎはダメです。広告は人の目を引き、クリックしたいと思わせるものでないといけません。

この記事でバナーについて、いろいろと学んでいただけたと思います。ただ、これらは一般的なデザインガイドラインに過ぎないので、各項目について、いろいろな案を試してみる余地はあります。また、バナーの良し悪しを決めるのは見た目ではなく、パフォーマンスだという点も忘れないでください。ひょっとすると、この世で最も醜いバナーが、上出来と思われているデザインよりもパフォーマンスが良いかもしれません。バナーは一番人気の広告媒体ではないものの、今のところはオンライン上に広く普及しています。

どの項目を参考にしてバナー広告をデザインしますか?