SNSアカウント SNSアカウント

ブログ

BLOG

アイコン

2022年3月4日 | TOE

【2022年最新版】バナーデザイン参考サイトと作成のポイント

ユーザーにインパクトを与えてコンバージョンさせるようなバナーをデザインするには、シンプルにキレイだったり、かっこよかったりするだけでは物足りないと言われています。

バナーデザインで重要なことは、ユーザーからクリックされるようなデザインで作成することです。

そうは言っても、どんなバナーをデザインすればよいか迷ってしまうデザイナーもいらっしゃるでしょう。

そこでこの記事では、クリックされるバナーデザインの特徴を紹介し、デザインするときに参考となるギャラリーサイトをまとめました。バナーを作成するときの参考にしてください。

クリックされるバナーデザインの特徴

クリックされるデザインのバナーには、いくつかの特徴があります。パッと見の印象の良し悪しが、クリックされるバナーかそうでないかが決まってしまいます。

たとえサイズの小さいバナーであっても、何も考えずに簡単にパパっと作ってしまっては、クリックされるバナーとはならないでしょう。

しかし数多くのバナーをデザインしてきたことで、ある程度クリックされるバナーの特徴がつかめてきました。具体的には、次で紹介するようなデザインのバナーが、クリックされやすかったのです。

キャッチコピーが分かりやすい

クリックされるバナーの特徴の一つが、キャッチコピーが分かりやすいことです。キャッチコピーとは、バナーに含まれているテキストのことです。もちろんバナーですので、キャッチコピーもデザインされているのですが、シンプルにテキストが持つ意味や表現が、ユーザーの心に刺さるかどうかも重要です。

キャッチコピーに共感できる

バナーにデザインされているキャッチコピーがユーザーにとって共感できることも重要です。ユーザーの顕在的な心理だけでなく、潜在的な感性に刺さるようなキャッチコピーは、ユーザーの心を強く揺さぶります。作成するバナーのターゲットを明確に定めて、そのターゲットにクリックしてもらうには、デザインに取り掛かる前のペルソナの設定なども効果的です。

パッと見でインパクトがある

なんだかんだ言っても、パッと見でインパクトのあるバナーは、ユーザーの印象に残りやすく、クリック率も高くなります。写真・デザイン・レイアウト・キャッチコピーそれぞれが、うまく調和しながらも全体的にインパクトがあると、バナーが伝えたい情報を適切に伝えつつ、ユーザーにとって分かりやすいバナーに仕上がるでしょう。

見慣れたデザインを取り入れている

ユーザーにとって、見慣れたデザインを取り入れているバナーは、既視感が生まれ、それがユーザーの安心感にもつながります。単純にパクるのではなく、なんとなく見たことがあるようなデザインに仕上げたバナーも、 意外とユーザーからのクリック率の高いバナーになります。



バナーデザインで役立つ参考サイトまとめ

デザイナーとしての想像力を発揮できるバナーデザインですが、どうしてもアイデアが浮かんでこないときもあるでしょう。そんなときは、バナーのデザインばかりを集めたギャラリーサイトを見て、バナーデザインのヒントを手に入れましょう。

BANNER LIBRARY

BANNER LIBRARYは、良質なバナーを集めたバナーデザインギャラリーサイトです。紹介しているそれぞれのバナーに、インスタグラムのようなハッシュタグが付けられているのが特徴です。さらに「カテゴリー」「テイスト」「トピック」「形」「色」「掲載先メディア」などの情報で表示されるバナーを絞り込むこともできます。バナー一覧ページは、オートページャーになっていますので、ストレスを感じることなくバナーの検索ができます。

BANNER LIBRARY:https://design-library.jp/

バナー広場

バナー広場は、月間閲覧数ランキングやCookieに保存できるお気に入り機能などが充実しているバナーデザインギャラリーサイトです。バナーの縦・横サイズが明確に決まっているバナーの作成時には、「サイズ」による絞り込みが非常に便利です。また「カラー」や「業種」「デザイン」「タイプ」「要素」などによる絞り込みもでき、ギャラリーサイトとしての使い勝手も抜群です。

バナー広場:https://banner-hiroba.com/

Bannner.com

Banner.comは、非常にシンプルなバナーデザインギャラリーサイトです。バナーの絞り込みはカテゴリーだけですが、サイズを指定したり、バナーのモチーフを指定したりできます。それぞれのバナーには絞り込んだ属性がタグとして設定されており、タグをクリックすることで、同じタグが付いたバナーを横断検索できるようになっています。

Bannner.com:https://bannnner.com/

Banner Matome

Banner Matomeは、2022年2月現在で2万点以上のバナーを掲載している大型バナーデザインギャラリーサイトです。バナーの絞り込みは、色別や業種別だけでなく「テキスト風バナー」や「立体風バナー」「手書き風フォントバナー」「イラストバナー」など、表現別に探すこともできます。バナー一覧からバナーをクリックすると、ライトボックスのようにバナーが浮き上がるようになっており、ページ遷移せずにサクサク閲覧できます。

Banner Matome:http://bannermatome.com/

Retrobanner

Retrobannerは、バナーデザインギャラリーサイトとしての歴史も長く、シンプルなデザインが特徴です。それぞれのバナーをクリックすると「このバナーデザインの主要16色」という色一覧が表示される面白い機能もあります。バナーも「サイズ」や「色」「業種」「テイスト」から絞り込むことができ、お気に入りのバナーを検索するには十分な機能も備わっています。

Retrobanner:https://retrobanner.net/

バナーデザインアーカイブ

バナーデザインアーカイブも、バナーデザインギャラリーサイトとして長く運営されているサイトです。「色」「業種」「サイズ」の3つの要素からバナーの絞り込みができます。しかし掲載されているバナーは2000個程度と少なく、最近は更新もされていないようですが、現在でも十分にバナーデザインの作成時のヒントとして活用できます。

バナーデザインアーカイブ:http://banner.keizine.net/

banner gallery

banner galleryは、「サイズ」「色」「業種」だけでなく、任意のキーワードを入力した検索もできるバナーデザインギャラリーサイトです。「このバナーも見られています」から、検索したバナーと類似するバナーを次々と辿っていくこともできます。

banner gallery:https://bannergallery.net/

Pinterest

Pinterestは、画像を共有できるSNSですが、多くのユーザーが優れたデザインのバナーをシェアしています。キーワード入力欄に「バナー」と入力すると、シェアされているバナーの一覧が表示されます。サイズや業種を表す言葉と一緒に検索すると、バナーデザインギャラリーサイトのように活用できるでしょう。

Pinterest:https://www.pinterest.jp/



まとめ

クリックされるバナーを作成するためには、この記事で紹介したようなポイントを押さえることが必要です。
これらのコツはバナーだけでなく、Webデザイン全般においても知っておくべきテクニックとも言えます。Webデザイナーとして駆け出しだったころは、バナーのデザインから覚えていった方も多いでしょう。
この記事で紹介した、バナーデザインギャラリーサイトからデザインのヒントを得て、クリックされるバナーデザインのスキルを高めていきましょう。