バナー広告デザインで参考にしたいレイアウトパターン10選

バナー広告デザインで参考にしたいレイアウトパターン10選


バナーデザインは、キャッチコピーやロゴ、商品画像などの情報をわかりやすく配置した上で、美しくクリックしてもらえるようなデザインに仕上げなければいけません。
キャッチコピーの場所や画像の見せ方など、情報要素のレイアウトには王道のレイアウトパターンが存在します。
今回はバナーデザインのヒントやアイデアの参考になる、ディスプレイ広告(バナー広告)のレイアウトパターンをご紹介します。

 

1.縦割りレイアウト

縦に分割し、写真やキャッチコピーをレイアウトするパターンです。
写真を大きく扱ったうえで文字スペースも広く確保できるため、情報をすっきりと見せることができます。

3451183513680054581外観と室内の写真を大きく見せ、メリハリのきいたデザインです。
13461242267226005874写真と文字情報をわけることで、文字情報も可読性の高い表現ができます。
retrobanner_ca51622b45e8d2bbはっきりと分割していませんが、縦長の商品と文字情報をわけてみやすくしたレイアウトです。

 

2.横割りレイアウト

横に分割したレイアウトパターンです。
縦割りと同様、写真や文字スペースを大きく扱うことができ、メリハリのきいたデザインで情報を伝えることができます。

4609019888048604746上下に2分したスタンダードなレイアウトです。
retrobanner_e4d4cb8bddee5588文字情報と写真がハッキリとわかれて、メリハリのきいたデザインです。
retrobanner_eaf4cf4b553e382b横分割に変化をつけたレイアウトパターンですっきりとした印象を受けます。

 

3.並列レイアウト

色違いやシリーズといった並列扱いの商品を横に並べるレイアウトです。
商品が横並びになることで、見た目も楽しく、どれかをつい選びたくなるといった衝動を促すことができます。

11957036161883295188色違いが並んで、カラフルで楽しい印象を受けます。
13475085964682001514どの味にする?というキャッチコピーと下に並んだ商品で、どれかを選びたくなるデザインです。
20160218-140013斜めにした商品を横並びにして、変化を出したデザインです。

 

4.敷き詰めレイアウト

並列よりもさらに商品数を多く見せい場合などに全体に敷き詰めるようにレイアウトするパターンです。
大きく見せる商品と小さく見せる商品というように、グリッドに変化をもたせメリハリを持たせることもできます。

たくさん並ぶことで、こんなにたくさん選べるんだ!という内容が視覚的に伝わります。
豊富な種類の靴のラインナップがあることが伺えるデザインです。
グリッドに変化をつけることで、注目を集めたりインパクトをだしたレイアウトです。

 

5.斜めレイアウト

斜めのデザインを取り入れたレイアウトパターンです。
通常のグリッドと異なった斜めの要素がアクセントとなり、注目を集めやすいデザインになります。

斜めで分割することでインパクトが出ています。
斜めのキャッチコピーが注目を集めるデザインです。
斜めの要素とポップなデザインで楽しく軽快な印象を受けます。

 

6.全面写真レイアウト

バナー全面に写真を使ったパターンです。
テキスト要素は最小限に抑えシンプルにすることでキャッチコピーを強調しながら、視覚的にもインパクトを与えることができます。

ビジュアルとキャッチコピーのみのシンプルな表現が、逆に目を引きます。
余白を利用したデザインで、静かながら奥行きのある表現になてっています。
躍動感のある写真と、端的なキャッチコピーでインパクトのあるデザインです。
見れば伝わる、という非常にシンプルなデザインです。

 

7.キャッチコピーメイン

キャッチコピーを読んでもらうことがメインのデザインになります。
キャッチコピーに目が行くよう、文字とビジュアルのコントラストを工夫したり、キャッチコピーを印象付ける写真を利用しています。

「半額」の文字が真っ先に目に飛び込み、印象に残ります。
キャッチコピーによって、背景の家のイメージが膨らみます。
キャッチコピーの内容が写真によってより印象的に伝わってきます。

 

8.数字押し

キャッチコピーの中でも数字に焦点を当てて目立たせるパターンになります。
セールやキャンペーンのほか、実績やランキングなどの権威付けの印象を強く残すことができます。

0円というインパクトが全面に押し出され印象に残ります。
No.1という権威付けがポイントになっています。
「100万」という文字に思わず注目してしまうデザインです。

 

9.ブランドのみ

キャッチコピーなどの要素をそぎ落とし、商品自体が持つ魅力を全面に押し出して見せるパターンです。
ビジュアルイメージそのものが持つ魅力が見る人にダイレクトに伝わります。

余計な言葉で飾らず、商品の持つ魅力のみで勝負しているデザインです。
写真の持つ訴求力にブランド名を添えるだけのシンプルなデザインで魅力を訴えています。

 

10.読ませる・異色系

漫画の一コマのようなデザインや折込チラシのような見せ方、クイズ形式といったアイデア異色系です。

漫画の一コマをモチーフに、思わず引き込まれる見せ方です。
よくあるチラシ風にすることで、旅行情報だということが視覚的に伝わってきます。
クイズ形式で答えをクリック誘導するアイデアになっています。

 

まとめ

今回はバナーデザインでよく見るレイアウトパターンを10選ご紹介しました。
どのパターンも、それぞれ目的に合わせたデザインで、注目を集めたり、ブランドイメージを訴求したり、随所に工夫がみられました。
全体を通して感じるのは、シンプルで端的な表現ほどするっと目に入り、印象に残りやすいという点です。
このまとめが、バナーデザインに悩んでいる方の参考になりましたら幸いです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

5 + 18 =

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)