WEBデザイナー向け無料電子Book >受け取りはこちら

バナーとは?初歩的な疑問をまるっと解決!バナー広告の作り方

バナーとは?初歩的な疑問をまるっと解決!バナー広告の作り方

WEBデザインの勉強を始めると、「バナー」という言葉が頻繁に耳に入ってきます。

初心者がWEBサイト全体のデザインをするとなるとハードルが高いので、小さなバナー制作から極めていくのがオススメです。

とはいえ、バナーの制作も決して簡単ではありません。

“それらしく”作ったところで、的が外れていれば制作物として価値のないものになってしまいます。

そもそも、バナーとは何なのでしょうか?

何となく「こういうものだろう」というイメージはあるかもしれませんね。

日頃たくさん目にしていても、バナーの目的やデザインの意図なんて、制作側の視点に立たないと分からないものです。

この記事では、バナーの役割や種類を理解し、バナー制作のルールに沿ってデザインができるよう、ポイントをまとめています。

作り方のステップと人の関心を引くデザイン、クリックされるバナーにするコツも解説していますので、ぜひ制作の参考にしてください。

\ 14364人にセミナーをして分かった!/

目次

バナーとは?

「バナー」というと何が思い浮かびますか?

「のぼり」とか「横断幕」という意味もありますが、ここで取り上げるのはWEBページで見かけるバナーです。

ここではそのWEBバナーについて解説をしていきます。

WEBバナー

WEBサイトを閲覧していると、ページ内にテキストの入った四角い画像を見かけることがありますね。

【バナーの例】

意識して見てみると、WEBサイトのいろいろな箇所にこういった画像があることに気づくはずです。

特集やキャンペーンの告知など、WEBページに設置されたリンク付きの画像をWEBバナーと言います。

WEBバナーの役割

WEBバナーは看板のような役割は主に次の2つです。

バナーの役割
  • 知らせたい情報や商材の認知拡大
  • 見てもらいたいページへの誘導

WEBサイトを訪れた人に案内を出して、「どうぞこちらへ」と誘っています。

街で見かける看板と同じく、告知したい情報や商材の存在を知らせるというもの。

必要としている人の目に留まれば、必ず関心を引くことができ。

街中の看板と比べるとWEBバナーははるかに多くの人の目に触れるチャンスがあります。

「こんなものがあるんだ」と認知されるだけで宣伝効果は抜群。

何度も目にしたり印象に残れば、「求人探しなら〇〇」、「水のトラブルなら△△」などと、必要になったときに思い出してもらえます。

クリック一つでリンク先のページが開く仕組みになっているので、見てもらいたいページへのスムーズな誘導もWEBバナーの大きな役割です。

「WEBバナー」用途別の使い分け

WEBバナーは用途によって2種類に分類できます。

ここでは「サイトバナー」と「広告用バナー」について解説をしていきます。

サイトバナー

サイトバナーは自社が運営しているサイト内で、他ページへの移動をしやすくするために設置されています。

サイトを訪れた人が欲しい情報をすぐに探し当て、目的のページに最短のルートで辿りつけるよう誘導するのが目的です。

サイトバナーの例

大小さまざまなサイズがあり、それぞれ目立っていますね。

サイトバナーは自社サイトに設置するものなので、一般的な制作ルールに縛られることはありません。

制作を請け負う場合は、クライアントである企業のWEB担当者に規定の確認をしましょう。

広告用バナー

サイトバナーと区別されるのが広告用のバナー。バナー広告とも呼ばれます。

WEBサイトを見ていると広告の画像をよく目にするのではないでしょうか?

商品のPRと購入ページへの誘導が広告用バナーの目的です。ここではバナー広告について少し掘り下げていきます。

バナー広告はディスプレイ広告のひとつ

ディスプレイ広告はWEBサイトやアプリ、SNSに表示される画像や動画形式の広告全般のことで、バナー広告もそのひとつです。

WEB広告の中でもディスプレイ広告とよく比較されるのがリスティング広告。

バナー広告と異なるのは、「表示形式がテキストで、掲載場所が検索結果画面」という点。調べものをしたときによく目にする広告です。

リスティング広告の例

以下は「WEBデザイン パソコン」のキーワードで検索した結果画面に表示された広告。

検索したワードと関連性の高いものが表示される仕組みになっているので、かなりターゲットを絞って広告を配信できるという特徴があります。

一方、ディスプレイ広告の掲載場所はインターネット上の広告枠。画像や動画を用いて視覚的に多くの人にアプローチすることが可能です。

バナー広告の主な掲載場所【GDN/YDA/SNS】

バナー広告が掲載される場所について見ていきましょう。

GDN:Google ディスプレイネットワーク

世界シェアNo.1の検索エンジンGoogleによる広告出稿サービス「Google広告」

そこから配信するディスプレイ広告をGDN(Googleディスプレイネットワーク)と呼びます。

GDNを利用するメリットは配信先の多さです。個人ブログからメジャーなサイトまで、3,500万以上のWEBサイトやアプリと提携しています。

細かいターゲティングの調整ができる点もGDNの特徴で、より確度の高い見込み客へのアプローチが可能です。

参考:Google広告ヘルプ「ディスプレイ広告と Google ディスプレイ ネットワークについて」

YDA:Yahoo!ディスプレイ広告

日本最大級のポータルサイトであるYahoo! JAPANの広告出稿サービス「Yahoo!広告」

そこから配信するディスプレイ広告がYDA(Yahoo!ディスプレイ広告)です。

Yahoo! JAPANのトップページやYahoo! JAPANの各サービスサイト、提携するパートナーサイトに広告が表示されます。

YDAの配信先は個人サイトを含まず信頼性の高い法人サイトに限られているので、ブランドセーフティー(広告を適切なWEBサイトに表示し、ブランドイメージを守る)の面でも安心です。

引用:Yahoo! JAPANマーケティングソリューション「広告掲載メディア」

SNS:Facebook/Instagram/Twitter/LINEなど

ソーシャルメディアに出稿する広告がSNS広告です。

タイムライン上に他の投稿と馴染むように表示させると(ネイティブ広告)、SNS利用者に抵抗感を抱かせずにアプローチすることができます。

ユーザー間のシェアによって拡散を期待できるのもSNS広告の強み。

SNSは媒体によって利用者の年齢層が異なるので、ターゲット層が利用する媒体を配信先に選ぶ必要があります。

広告運用スタイルと費用形態の違い

バナー広告を掲載するには以下の2つの方法があります

掲載方法
  • 予約型
  • 運用型

予約型広告

「純広告」とも呼ばれ、特定の広告枠を買い取るスタイル。

雑誌や新聞の広告と同じ仕組みです。掲載期間をあらかじめ決めて固定料金を支払います。

Yahoo! JAPANトップページ右上に表示されるバナー広告というとイメージしやすいかもしれませんね。

大きなメディアであるほど自社のブランディングや商品の認知に効果が期待できます。

引用:Yahoo! 広告ヘルプ「ディスプレイ広告(予約型)の商品について」

広告費用は「期間保証方式」。

掲載期間に対して固定料金を支払うので、契約期間中は広告の表示回数が保証されます。

アクセス数の多いWEBサイトに掲載できれば多くの人の目に触れますが、広告費が高額になることがほとんどです。相場は1週間で数十万円〜数千万円と、媒体の規模によってかなり幅があります。

運用型広告

ターゲティング、バナーデザインなど日々改善しながら運用していくスタイルです。

広告の修正、配信の停止や再開は自由。成果を見ながら予算の調整が可能です。

表示回数やクリック数、商品の購入やサービスの成約に至った数(コンバージョン数)によって課金が生じる仕組みなので、広告の出稿を少額からスタートできるというメリットがあります。

課金の形態は以下のとおり。

課金形態
  • インプレッション課金方式
  • クリック課金方式
  • 成果報酬方式

「インプレッション課金方式」

広告の表示(インプレッション)回数に応じて費用が発生するシステムです。

一般的に1,000回の表示につき1回の課金が生じます。費用の相場は媒体によって異なり、1,000回の表示につき数十円〜数百円ほどです。

「クリック課金方式」

バナー広告が何回クリックされたかによって料金が決定するシステムです。ユーザーがクリックしたくなるバナーにする必要があります。

クリックされなければ費用は発生しませんが、突如話題を集めてクリック数が急増しないとも限りません。そうなると費用が一気にかさむというリスクもあります。

1クリックの単価(クリック単価)の相場は媒体ジャンル、競合数によって幅がありますが、数十円〜数百円と見積もられます。

「成果報酬方式」

主にアフィリエイト(広告費を支払い、個人ブログなどで商品を紹介してもらう)によく見られる方式です。

商品の購入やサービスの問い合わせなどコンバージョン(成果)が発生すると課金が生じるというもの。

費用の相場は、成約に至った商材の20〜40%ほどの価格が一般的です。

いずれの費用形態で運用するにしても、予算の上限を意識して上手くコントロールする必要があります。

WEB広告の運用は、広告内容やデザイン、配信する地域や時間など細かい設定と結果分析が必要なため、広告代理店など経験や知識を持ったプロの領域です。

バナー広告を制作するWEBデザイナーは、企業や代理店の担当者と連携を取りながらオーダーに沿ったデザインを施したり、分析結果を受けて調整や変更をおこないながら、より成果の出るクリエイティブ(広告素材)に仕上げていきます。

広告用バナーの規定サイズ

サイトバナーと違って、広告用のバナーは掲載先の媒体によって規定のサイズがいくつか存在します。

ここでは、広告の掲載先としてメジャーな媒体で使用される一般的なバナーのサイズをご紹介します。

サイズは改定される場合もあるので、制作の際には掲載先の規定を都度確認するようにしましょう。

GDN・YDAで配信するバナーのサイズ

インターネット広告の配信サービスで最もメジャーなGDN(Googleディスプレイネットワーク)とYDA(Yahoo!ディスプレイ広告)を見ていきましょう。

バナー広告を出稿する際には審査がありますので、それぞれ規定のサイズを守らなければなりません。

GDAでは出稿可能なバナーのサイズが豊富です。

全てを覚える必要はありませんが、YDAと共通するものや、よく使われているサイズを押さえておきましょう。

【GDNとYDA、バナーサイズ比較表】

画像サイズGDNYDA
(ピクセルサイズ/横×縦)PCスマートフォンPCスマートフォン
300×250
728×90
160×600
300×600
336×280
320×50
320×100
468×60

最も汎用性の高いサイズは300 × 250。一般的なサイズです。

サイズ選びに迷った際は300 × 250を準備しておくといいでしょう。

近年スマートフォンの画面サイズが大きくなってきた傾向を受けて、GDNでは336 × 280も主流となりました。

参考1:Google広告エディターヘルプ「イメージ広告の画像サイズ」
参考2:Yahoo!広告ヘルプ 【広告】入稿規定「バナー 広告仕様」
参考3:Yahoo!広告 公式ラーニングポータル「ディスプレイ広告で使用できる画像サイズ」

SNS広告の規定サイズ

SNS広告も各媒体によって規定のサイズが異なります。

ここではFacebook・Instagram・twitter、LINE、4つのメジャーなSNS広告の規定サイズを比較していきます。

ちなみに、FacebookとInstagramの運営会社はMeta(※2021年にFacebookから社名を変更)。2012年にFacebookがInstagramを買収して以来、Instagramに広告を出稿するにはFacebookの広告管理画面(広告マネージャ)を使用することになっています。

以下は各媒体の規定サイズのうち、一般的によく使用されるものです。

Facebook広告

推奨する広告サイズは 1,080 x 1,080(Instagramも同様)

Twitter

画像広告の種類によって異なりますが、WEBサイトボタン付きなら800 × 418、800 × 800。独立した画像広告なら1,200 × 600、1,200 × 628

LINE

LINE Dynamic Ads(閲覧履歴をもとに商品の広告を表示する)を使った広告なら600 × 600、1,200 × 628。メディア(画像・カルーセル)の入稿なら600 × 400、1,080 × 1,080、1,200 × 628

こうして比較してみると、1,200 × 628はGDNやYDAでも使えるので、汎用性が高いといえます。

小さな画像を拡大すると画質が落ちてしまうので、大きく作って切り出すことを考えると、SNS広告は1,280×670、1,200×1,200を準備しておくとよさそうです。

参考1:Facebook広告ガイド
参考2:Twitter広告ヘルプセンター「広告クリエイティブの仕様」
参考3:LINE広告

バナー制作に活用できるツール

バナーは何を使って制作すればいいのでしょうか?

ここではバナー制作に使えるツールについて紹介していきます。

Photoshop・Illustrator

WEBデザインに関心のある人にとってはすでに馴染みのあるツールかもしれませんね。

Photoshop・IllustratorはAdobe社のデザインツール。

WEBデザイナーがバナー制作する際はこれらを使用するのが一般的です。

プロ仕様の高機能なデザインツールであるため、初心者には扱いが難しい面があるのも事実。

ただ、将来的にWEBデザインを仕事にしたいと考えている人は迷わずこれらのツールを選びましょう。

2つのツールを使いこなすとなるとハードルが高いかもしれませんが、まずはPhotoshopを使えるようになればバナー制作はできます。

そのうえ、Photoshopの全ての機能を使いこなす必要もありません。自分に必要な機能だけを極めていくほうが習得は圧倒的に速く効率的です。

Photoshopだけでも十分プロの仕事ができますので、あまり身構えずに始めてみましょう。

初心者向け無料ツール

「デザインの知識や技術なしで簡単にバナーを作りたい」という人には初心者向けのバナー作成ツールやアプリの利用がオススメです。

プロが作ったテンプレートが豊富に揃っているツールを使えば、デザインが苦手でも簡単にバナーが作成できてしまいます。有料のものもありますが、まずは無料のもので試してみるといいでしょう。

オススメ無料ツール

Canva

テンプレートや無料素材、写真やイラストを使って簡単に作成。自分で素材をアップロードしてカスタマイズも可能。(WEB版とアプリ版に対応)

Adobe Express

Adobeが提供する無料デザインツール。高品質のテンプレートを選択して文字を編集するだけの簡単ステップ。(WEB版とアプリ版に対応)

PowerPoint・Excel

デザインツールを使ったことがない人でも、Microsoft OfficeのPowerPointやExcelなら使い慣れているかもしれませんね。実はPowerPointやExcelでも、ごくシンプルなバナーなら作成できます。

PowerPointなら、スライドのサイズを作成したいバナーのサイズに変更し、テキストや画像を挿入してレイアウトしていくだけです。

必要な素材や文字の配置が完了したら、JPEGかPNG形式で画像ファイルを保存しましょう。

Excelなら、使いたい画像を挿入してその上にバナーサイズの四角形を重ね、テキストボックスで文字を挿入します。

余分な箇所をトリミングしたらサイズ調整をしてクリップボードにコピーすればOKです。

画像ファイルにするならWindows標準ツールの「ペイント」に画像を貼り付けて、JPEGかPNG形式で保存すれば完了です。

何から手を付ける?バナー制作5つのステップ

いざ制作しようと思っても、情報が整理できていないと手を動かせません。

何から手を付ければいいのか、バナー制作の方法をステップを追って見ていきましょう。

Step1.ターゲット層を理解してアピールポイントを整理する

ターゲット像が曖昧だと広告の成功は見込めません。

上手くターゲット設定できていないとメッセージ性が弱くなり、誰の心にも刺さらない広告になってしまいます。

「誰に届けたいメッセージか」ということが重要で、それによってキャッチコピーやデザインの方向性が定まるので、ここを疎かにはできません。

依頼主へのヒアリングを抜かりなくおこないましょう。

ひとつの商品でもいろいろな特性があるので、ターゲットにとってのベネフィット(顧客が商品から得る利益やプラスの効果)、商品のアピールポイントを整理しておきます。

この時点で徹底的にターゲットの目線に立っておくと、デザインの方向性がブレることはありません。

自分でターゲット設定をする必要がある場合は、どんな人が見込み客になり得るかをイメージしてみましょう。

扱う商品が、その人の「問題解決」になるかを考えるのが重要です。

年齢・性別・職業・居住地・家族構成・抱えている悩みなど、ターゲット像をできるだけ具体的にすると、その人のニーズと商品の接点を探りやすなりますよ!

Step2.デザインのラフ案を描きだしてみる

ラフ案を描いてイメージを具体化していきます。ここでの目的は完成イメージを持つこと。本格的な作成に入る前に揃えるべき素材が分かります。

ラフ案はプロでも手描きする人が多いようです。

時間をかけずにアイディアを紙の上に起こしてみましょう。

手書きなら修正も楽ですし、コメントを書き添えておくこともできます。

実際に描いてみると、イメージと違うと感じることも少なくありません。

「思ったよりバランスが悪かった」、「文字数が多かった」など、頭の中で描いていただけでは分からなかった気づきが得られるはずです。

文字や画像の配置を変えて何パターンか作成し比較してみましょう。

ラフがあれば関係者とイメージの共有ができるので、意見を求めたり、作成前に認識の相違がないか確認するのにも役立ちますよ!

Step3.バナーに配置する素材を揃える

バナーに配置する素材を全て揃えます。料理でいう食材調達の段階です。

調理しながらひとつひとつ食材を探しに出かける人はいませんよね。

本格的な制作に入ったときには、素材のレイアウトだけに注力できるよう下準備をしておきましょう。

バナーに配置する要素は、メインキャッチコピー、サブコピー、メイン画像、ロゴ、アイコン、ボタン画像など。手元にない素材は集めてこなければなりません。

素材を使用する際には著作権に抵触しないか十分な注意が必要です。

フリー素材の写真やイラストもたくさんありますが、必ず利用規約を確認し、商用利用が可能なものを使うようにしましょう!

Step4.デザインツールを使って素材をレイアウトする

いよいよ本格的な制作に取り掛かります。デザインツールを使って文字と画像をレイアウトしていきましょう。

メイン画像と文字を分割して配置するのか、重ねて配置するのかで印象は変わりますし、画像と文字が占める割合によっても見た目が大きく変わります。

あえて余白を多く取り入れるのも商材によっては効果的です。

文字のフォントや行間・字間も調整しましょう。可読性(読みやすさ)が最優先です。

バナー自体がCTAボタン(資料請求や問い合わせなどのボタン)の場合もありますが、バナーの中にボタンを設置することもあります。このボタンの位置によって、バナーの成果が大きく左右されるといっても過言ではありません。

人は視線を左から右に「Z」を描くように動かすという特性があります。

そのため、CTAボタンを右下に設置するのが比較的多い手法です。

もちろん正解はひとつではありませんが、素材の配置には意図があるということを覚えておきましょう!

Step5.配色をして全体を整える

文字や装飾部分にも配色し、全体のトーンを整えていきます。

メイン画像に写真を使っている場合は、その写真の色味に合わせるようにしましょう。

異なる色を多用するとごちゃごちゃした印象を与えてしまいます。

文字は読みやすさを考えた配色に。

CTAボタンや商品の金額、期限などの重要な要素が目立つ配色にすると効果的です。

色にはそれぞれイメージがあります。

赤なら情熱や温かさ、青なら冷静やクールさなど、色彩の特徴を踏まえた配色を考えましょう。

バナーをクリックした先のサイトとのデザインの一貫性(トーン&マナー)も意識しなければなりません。

ブランドイメージと異なるバナーにしてしまうと、リンク先の商品紹介サイトや企業サイトを訪れたユーザーを戸惑わせてしまいます。

商業用のデザインをするときには、色使いにも目的とルールがあることを覚えておきましょう。

デザインのルールについてもっと知りたい!という人はこちらの書籍がオススメです!

目に留まる&クリックされるバナーにする3つのポイント

バナーは人々の目に留まれば認知拡大の役割を果たし、クリックされれば成果が生まれます。

より多くの人に注目してもらい、クリックしてもらうにはどんな工夫が必要なのでしょうか。以下の秘訣を見ていきましょう。

Point1.情報量を絞って単純明快にする

バナーデザインのポイントは「単純明快」であることです。

バナーの目的(認知拡大/成約/ブランディングなど)を明確にし、ターゲット像を具体的に設定したあとは、伝えるべき情報を取捨選択することが大事です。

あれもこれも伝えようとすると、情報が散漫になり読みにくくなってしまいます。

スペースが限られていますので、最も重要な情報(価格/機能・効能/品質など)に絞りましょう。

文字数についても注意が必要です。人間が一瞬で認識できる文字数は13文字程度。

ネットニュースの見出しも約13文字に統一されています。キャッチコピーにも取り入れ、パッと見て読める文字数におさめましょう。

目に入っても素通りされないバナーにするために、次の3つを心がけて制作しましょう。

制作で心がけること
  • 伝えたいことが明確
  • 端的で分かりやすい
  • 一瞬でターゲットの興味を引く

の3点を心がけて制作しましょう。

Point2.ターゲットや広告の配信先ごとにデザインを変える

ターゲットが変わればデザインや商品のアピールポイントも変わります。

たとえば、20代女性向けのバナーなら可愛らしくポップなデザイン。

華奢なフォントに感性を刺激するキャッチコピーが共感を呼びます。

一方30代の男性ビジネスマン向けのバナーはどうでしょうか。

華やかな色使いや感情的なコピーが相応しいとは思えません。

すっきりとした配色にロジカルなメッセージなら関心を引くことができそうです。

ターゲットとなる人の年齢・性別・職業やライフステージによって商品のアピールポイントが異なるので、当然デザインも変えなければなりません。

また、広告の配信先によってもデザインの雰囲気を変える必要があります。

SNSは種類によって利用者の年齢層が異なるのも興味深いところです。

Facebook

30代の利用者が最も多く、次いで多いのが40代。セミナーや不動産、投資、求人など、カチっとした雰囲気の広告が目立ちます。

Instagram

利用者のうち最も多いのは10代・20代。お店やアパレル、美容系ECサイトの広告がよく見られます。おしゃれを意識したデザインが多いのもInstagramの特徴。

Twitter

20代の利用者が多く、新商品や期間限定のサービス、セミナー集客などの広告がよく出稿されているようです。

LINE

全ての年齢層において利用者が多く、全年代で利用率が90%を超えています。

TikTok

利用者は圧倒的に10代。

そうなると、FacebookとTickTokに出稿するバナーのデザインが同じではおかしいですね。

SNSにはそれぞれ独自の雰囲気がありますので、配信先のトーン&マナーに合わせて、作成する必要があります。

参考:令和2年度情報通信メディアの利用時間と情報行動に関する調査 報告書

Point3.分析と改善をくり返す

バナー広告は配信される頻度が高いほど多くの人の目に触れますが、その分デザイン自体も消耗していきます。

数日〜数週間という短いスパンでデザインの改善や変更をすることは珍しくありません。

正しく改善や変更がおこなわれるためにも、細やかな分析が必要です。

自分で広告運用をしないのであれば、運用担当者に分析結果を共有してもらうようにしましょう。

クリック率、コンバージョン率など、目標にすべき数値を聞いておく必要もあります。

自分の制作したバナーがきちんと成果を出しているのか、数値での進捗確認はデザイン改善のために大事なことです。

成果を出しているクリエイティブはどんな特徴があるのか、何がターゲット層に受けているのか、それらを分析し、改善や新しいバナー制作の参考にします。

デザインの一部を微調整するだけで成果が変わることがあるので、メイン素材のサイズを少し変更してみたり、色味を微調整してみたり、フォントを変えてみるなど、運用しながら分析と改善をくり返していきましょう。

ユーザーの反応を汲むことこそ、バナー制作上達いちばんの鍵です!

バナー制作から「人を魅了するデザイン」を始める!

バナー広告を中心に、WEBバナーについて解説をしてきました。

「バナーって何?」というところから、イメージが少し具体的になってきたでしょうか?

役割や目的に沿ったデザインや制作をすれば、相応の反応が返ってくるのがバナーの面白いところです。

ここまでの内容をおさらいしておきましょう。

WEBバナーは2種類。

バナーの種類
  • サイトバナー:自社サイト内でのスムーズなページ移動が目的
  • 広告用バナー:商品やサービスの「認知拡大」と「コンバージョン獲得」が目的

バナー広告はディスプレイ広告のひとつで、掲載場所はインターネット上の広告枠です。

主な掲載先は以下の3つ。

掲載先
  • GDN(Google ディスプレイネットワーク)の提携サイト
  • YDA(Yahoo!ディスプレイ広告)の提携サイト
  • SNS(Facebook/Instagram/Twitter/LINEなど)

広告の運用スタイルには「予約型」と「運用型」があり、費用形態は次のとおりです。

費用形態
  • 期間保証方式(予約型)
  • インプレッション課金方式(運用型)
  • クリック課金方式(運用型)
  • 成果報酬方式(アフィリエイトなど)

バナー広告は規定サイズに沿って制作する必要があります。

規定サイズ
  • GDNやYDAで使用され、最も汎用性の高いサイズは300 × 250
  • SNS広告は1,280×670、1,200×1,200を準備しておくと良い

バナー制作に活用できるツールは以下のとおりです。

活用できるツール
  • Photoshop・Illustrator(Photoshopだけでも制作可能)
  • 初心者向け無料ツール(CanvaやAdobe Expressのテンプレートが便利)
  • PowerPoint・Excel(デザインツールを使わず、簡単なものを作りたいとき)

バナー制作5つのステップを振り返っておきましょう。

5ステップ
  1. ターゲット層を理解してアピールポイントを整理する
    ターゲットの目線に立って、ベネフィットを整理しておく
  2. デザインのラフ案を描きだす
    手書きで完成イメージを可視化する。担当者とイメージを共有
  3. バナーに配置する素材を揃える
    フリー素材は著作権に抵触しないよう注意する
  4. デザインツールを使って素材をレイアウトする
    視線の動きの特性を意識して素材を配置する
  5. 配色をして全体を整える
    リンク先のサイトとのトーン&マナーを意識。色の持つイメージを活かして配色

目に留まって、さらにクリックされるバナーを作るポイントは3つ。

ポイント3つ
  • 情報量を絞って単純明快にする
    最も伝えたいことに絞り、文字数は13文字程度にする
  • ターゲットや広告の配信先ごとにデザインを変える
    配信先媒体の雰囲気に合わせる
  • 分析と改善をくり返す
    広告運用の成果を確認。分析結果を改善に活かす

自分が制作したバナーが誰かの心を動かして成果を生んだら、こんなに嬉しいことはありませんよね。バナー制作から人を魅了するWEBデザインを始めてみませんか?

▼ ▼ 限定公開中 ▼ ▼

当メディアを運営している日本デザインスクールは、これまで14364人WEBデザイナーの仕事についてお伝えする無料セミナーを開催してきました。

その中で気づいたのが、WEBデザイナーへの誤解がある方が多いということ。中には一度勉強に失敗してからセミナーに来て「先に知りたかった」という方もいらっしゃいます。

そのような方が増えないために、特に多かった15の誤解を1つの資料にまとめました。勉強を始めてから後悔しないよう、ぜひ受け取ってください。

※非常に人気の資料であり、今後有料化する可能性もあるのでお早めに手に取ってくださいね。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

質問や感想があればご記入ください

コメントする

目次