有名企業の事例から学ぶ！高品質なバナー広告を作るための「コツ＆レイアウト」集

2013/12/27

「バナーはデザイン次第で2倍以上もクリック数に差が出ます。」

今回は、手が回らなくて意外と”おざなり”になりやすい「バナー」作成について、コツやレイアウトパターンが紹介されている記事をご紹介します。この記事を読めば、必ずやバナー作成の生産性が上がります！

『新人必見！倍速かつ高品質なバナーを作るためのコツを全公開します』

nanapiさんのデザイナー、yunicoさんが書いたバナー制作フロー。サンプルのバナーデザイン例を出しながら、以下の7つにフローがまとめられていて、初めてバナーを作る人向けにも分かりやすくなっています。

■紹介されているバナー制作フロー
１．要素のバランスを見て適切なレイアウトを選ぶ
２．手描きのラフでレイアウトを決定
３．PC上で組むレイアウトはまずモノクロで
４．要素が多い場合は3?4カ所にグルーピング
５．文字組みも忘れずに
６．飛び先や商品イメージの色を抽出して使う
７．最後にもう一度モノクロにして視認性チェック

※サイバーエージェントさんでも、「単色でレイアウトする」など概ね同様のフローが紹介されています。

『C-teamで作るバナー広告の効果がスゴすぎてひいた話』

nanapiのけんすうさんが書いた記事。少し前のエントリーですが、バナー制作に特化したクラウドソーシングサービス「C-team」の効果を事例を元に紹介してくれています。

■記事中で紹介されている例
例えば以下のバナー、どれが一番効果が良いか分かりますでしょうか？正解は左上。（具体的な数値は記事中をご覧になってみてください。）

クリックされなければ意味がないバナー。どのバナーが効果が出るかなんてやってみなければ分からないので、ディレクターがどれを採用すべきか判断するのではなく、まずやってみて数字を見ることをオススメしています。

『100種以上の自社広告運用でわかった！バナー広告クリエイティブ4つの基本』

先日更新停止のお知らせがあった『LINE Corporation ディレクターブログ』。実際に自社広告で回していたバナー事例を、結果と共に紹介してくれています。

■紹介されているバナー例
例えば顔を掲載するのでも、泣き顔と笑顔では笑顔のほうが2割効果が高かったようです。

他にも、『2. テーマに最適なフォントでハートを掴む』『3. キャッチコピーの鉄則。「端的に！」』『4. 「何だろう？」と思わせたら勝ち』といった方法論が紹介されています。

『ディレクターなら知っておきたい「バナー広告制作の基礎知識」』

LINEさんのディレクターブログのバナー記事、2つ目。バナー制作メソッドの解説記事です。はてブが1700も付いています。(1700はURLが変わる前のはてブ数です。)

■サマリー
以下のような考え方が紹介された後、「刺さるキーワード」作成のためのマトリクスやオペレーションフローが紹介されています。

バナー広告は潜在層向けのものであり、その人達に当事者意識を持たせて注意喚起をすべき。

詳しい話はランディングページに任せて、バナーではそのサービスから得られる最も解りやすいメリットについて訴求することにフォーカスする。