バナーとは?種類やデザインのポイントなど解説
バナー広告は、インターネットでのブランド認知度を高め、ユーザーの関心を引くための重要な手法です。WEBマーケティングの世界では、バナーを使った集客や行動喚起が一般的な方法の1つとなっているため、バナーに関する基本的な知識を身につけることは、WEB担当者として必須事項の1つといえます。

バナーとは?
バナーとは、WEBサイトやGoogle広告などのメディアで使われる画像のことです。インターネットを利用する際に、頻繁に見ることがあるのではないでしょうか。このようなバナーは、ブランドの認知度を高めたり、WEBサイトへトラフィックを誘導することを目的としています。 また、バナーにはテキストもついていますが、画像がベースです。
参考ページ:バナー広告とは?種類やメリット・デメリットなど徹底解説!
バナーの種類
バナーは細かく分けると、さまざまな種類があります。例えば、告知バナーやプロモーションバナー、イベントバナーなどが挙げられます。ここでは、それぞれの特性について詳しく解説します。より効果的にターゲットにアプローチするために、まずは種類の違いを知ってください。
告知バナー
開店や営業時間の変更などを告知するために使用されます。告知バナーは、開店の日時、営業時間の変更、運営方法の更新など、何らかの変更を告知するために使用するものです。例えば「近日オープン」、「求人募集」 などのメッセージを伝えることなどが挙げられます。
プロモーションバナー
プロモーションバナーは、セールや割引などのプロモーションを告知するために使用するバナーです。WEBサイトやディスプレイ広告などに使用することで、顧客の注目を集め、特定のページへの誘導に役立てることができます。
バナーをデザインするポイント
どのようにバナーをデザインするかは、クリック率に大きく影響します。適切な配置や色の選択、高品質な画像、シンプルなレイアウトなど、効果的なデザインにはいくつかの重要なポイントがあるので詳細をお伝えします。
配置場所を考慮する
バナーのデザインは、そのバナーをどこに配置するかということに大きく影響を受けます。周囲の背景と調和させることで、効果的なバーナーになるからです。例えば、配置するWEBサイトの色と対比させたり、白や黒の境界線を追加するなどして、バナーを目立たせるなどのことを検討します。周囲の背景とそぐわないと、バナーが目立たなかったり、逆にWEBサイト全体のデザインを大きく崩してしまうなどの結果になります。
適切な色を選択
どのような色を選択するかは、それを見たユーザーの感情に影響します。色には、ブランドイメージを伝える力があるため、どう印象を与えたいかに基づいて色を選択してください。ただ、配色は難易度も高いので、デザインの専門知識を持つスタッフと十分に検討して決めてください。
もちろん、テンプレートを利用すれば、ある程度、完成した配色のバナーを作ることができます。しかし、それでも自社のブランドイメージがあると思いますので、最終的にはデザイン知識を持つスタッフの意見を交えて、どのような色にするか決定してください。テンプレートをそのまま利用すれば良いとは限りません。
高品質の画像を使用する
バナーで使用する画像の解像度が低いと、ぼやけて粗く見えるため、プロフェッショナルな仕上がりにはなりません。そのため、高解像度の画像を選ぶことが重要です。例えば、SVGやEPSファイルなど、拡大縮小しても画質が劣化しない(縁がギザギザしない)ベクター画像などを選ぶことも重要です。
テキストを読みやすくする
テキストを読みやすくすることも重要です。バナーの視認性を高めるために、シンプルで読みやすいフォントを選び、バナーサイズに適した文字の大きさを指定します。
特にWEB広告では、装飾が強い書体は避け、太字で読みやすいものを選ぶことが重要です。ユーザーはじっくりバナーを見てくれるわけではなく、一瞬しか視線を向けてくれないため、瞬間的にどのような情報を伝えているかが伝わらなければいけません。
行動喚起(CTA)を組み込む
目的にもよりますが、基本的にバナーには行動喚起(CTA)を含めます。バナーを見た人にどのような行動をとって欲しいのかを明確にすることで、コンバージョン率向上に役立ちます。また、CTAにコントラストの強い色を用いることで視覚的に目立たせ、効果的にクリックを促すようにしてください。CTAの配置やデザインによって、クリック率はき大きく変わります。
シンプルさを心がける
1つのバナーの中であまりにも多様な色や画像を使うと、ユーザーの混乱を招きます。そのため、シンプルさを心がけるようにしてください。テキストを最小限に抑え、画像を1つか2つに絞ります。テキストが多すぎると視覚的に煩雑になり、メッセージが伝わりにくくなるため、できる限り余分な文章をそぎ落とします。
一貫性を保つ
一貫性を保つことも重要です。ブランド認知度を高め、コンバージョン率を向上させるためには、バナー全体のデザインに統一感を持たせる必要があります。仮にさまざまなタイプのバナーを作ったとしても、ブランドカラーや使用するフォントを統一させ、一貫性をもたせるようにします。
バナーのテキストに書くべきこと
バナーは画像が中心にはなりますが、ユーザーにクリックしてもらうにはテキストの要素も重要です。ただ、テキストに何を書けば良いのか迷うこともあると思いますので、ここでポイントをお伝えします。
キャッチコピー
バナーには、キャッチコピーをいれるのが基本です。キャチコピーでユーザーの興味を引き、クリックするように促します。具体例としては「今だけ50%OFF」、「初心者でも簡単!」などが挙げられます。短い言葉でポイントを伝えてください。
ベネフィット
キャッチコピーに加えて、ベネフィットを入れることもあります。商品やサービスを利用することで、ユーザーが何をえられるのか端的に伝えてください。例えば「1ヶ月で5kg減!無理なく続くダイエット」、「コスト削減&売上UP!業務効率化ツール」などが考えられます。
信頼性・権威性
ベネフィットの代わりに、安心感や実績をアピールすることもあります。業界によっては、こちらの方がクリック率が高いことがあります。例えば「導入実績5,000社」や「専門家監修のプログラム」などが挙げられます。
参考になるバナーデザインのWEBサイト
効果のあるバナーを制作するには、優れたデザイン事例をたくさん見ることが肝心です。そこで、実際に使用されているバナーを効率よく学ぶことができるWEBサイトをいくつか紹介します。
Pinterestでは、世界中のデザイナーが作成した多様なバナー広告のデザインを見ることができます。検索に自社の商品名や業界名を入れると、関連したバナーや画像が表示されるので、それで目的にあったものを見つけてください。
例えば「ホテル+バナー」のように検索することで、ホテル業界に特化したバナーが表示されます。色使いやフォントの選び方、レイアウトのバランスなど、参考になる点は非常に多いです。
Meta広告ライブラリ
Meta広告ライブラリは、FacebookやInstagramで実際に配信されている広告を閲覧できる無料ツールです。バナー広告に使用されているものを確認できるので、とても貴重な参考資料です。
自社の業界における競合の広告デザインやキャッチコピーなどを確認すれば、自社のバナー制作のヒントになります。また、どのような広告が長期間掲載されているかを分析することで、効果の高いバナーの傾向を把握することも可能です。
BANNER LIBRARY
BANNER LIBRARYは、おしゃれで良質なバナーデザインを集めたギャラリーサイトです。 カテゴリやタグで検索でき、最適なデザインをすぐにチェックできます。例えば「テイスト」という項目を選べば、シンプルやスタイリッシュ、ナチュラムなどのカテゴリに分かれ、自社の目的に応じて検索対象を絞り込むことができます。
その他、FacebookやInstagramなど、掲載されている媒体ごとにバナーを検索することもできるため、自社が該当する広告を出す場合、大いに参考になります。
retrobanner
静止画のバナーを集めているWEBサイトです。高頻度で更新しているWEBサイトで、近年の傾向を知るのにも有効です。検索では、バナーサイズ・色・業種・テイストから絞り込むことができます。
よくある質問(Q&A)
ここでは、バナーに関するよくある質問を取りあげ解説します。特に初めてバナーを制作する際には、次のQ&Aを把握したうえで進めてください。
Q:バナー制作はデザイナーに任せた方が良い?
Answer)目的や予算によりますが、プロのデザイナーに依頼することで、より洗練されたバナー広告を作成できます。デザイナーに依頼するメリットとして、デザイン性の高いものができることや、レイアウト的に正しいバナーが作られるなどの点が挙げられます。しかし、コストや時間の制約がある場合は、CanvaやAdobe Expressなどを活用し、自社でバナーを作成する選択も検討してください。このように、目的に合った方法でバナー制作をすることが肝心です。
Q:バナー制作に有効なツールは?
Answer)バナー作成に役立つツールには、初心者向けでテンプレートが豊富なCanva、シンプル操作で高品質なデザインができるAdobe Express、チームの共同編集に強みがあるFigmaなどがあります。社内に高度なデザイン技術を持っているスタッフがいるなら、Adobe Photoshopやアニメーションバナーに強いCrelloなどもおすすめです。目的やスキルレベルに応じて適切なツールを選んでください。
参考ページ:バナー制作の方法!役立つツールや外注する際のポイントなど解説
Q:バナー制作できるスタッフが社内にいない場合は?
Answer)ランサーズやクラウドワークスなどのクラウドソーシングサービスを活用してください。ここでは、プロやセミプロのデザイナーに依頼することが可能です。また、ある程度、予算や時間がある場合は、デザイン制作会社や広告代理店に外注するという方法も1つです。
Q:WEB広告のバナーはLPと統一感があった方が良い?
Answer)WEB広告で使用するバナーはLP(ランディングページ)のデザインと統一するのが望ましいです。色やフォント、画像、キャッチコピーなど、統一感のあるデザインにすることで、ユーザーが広告をクリックしたあとに違和感を抱かず、スムーズにLPの内容に入り込めるからです。結果として、離脱率を減らしコンバージョン率の向上につながります。
参考ページ:ランディングページ(LP)とは? 意味、構成とデザインの制作方法を解説
Q:バナーに余白が多くても良いですか?
Answer)適度な余白を保つことで視認性を高め、伝えたいメッセージを強調することができます。しかし、余白が多すぎると情報量が不足してしまい、インパクトが弱くなる可能性もあります。特に、WEB広告のバナーは限られたスペースの中でユーザーの目を引き、クリックを促す必要があるためシンプルなデザインを心がけつつも、伝えるべき情報がしっかり伝わるようバランスをとってください。
Q:バナー広告にはどのような種類がありますか?
Answer)バナーが使える代表的な広告は「Googleディスプレイ広告」「Yahoo!ディスプレイ広告」「Facebook広告」「アプリ内広告」などがあります。GoogleやYahoo!のディスプレイ広告は広範囲にリーチでき、Facebook広告はターゲティング精度が高いのが特徴です。自社の目的やターゲットに応じて最適なバナー広告を選ぶようにしてください。
参考ページ:ディスプレイ広告とは?リスティング広告との違いを解説
まとめ
