初心者向け!超簡単なバナー作成の基礎を勉強しよ!

バナー作成ってどうやればいいの?

個人でネットショップを運営してる初心者さんからよく言われます。 バナー作成はWebデザイナーじゃなくても、ちょくちょく作るこはあります。個人でネットショップを運営してる人・ブログの運営者・趣味でホームページを運営してる人など。

つまりWeb関連の仕事じゃないにしてもプライベートでWeb・ネットに関わってる人は自分でバナーを作成する機会があるわけです。 そこで初心者の人に生まれる疑問が、バナー作成ってどうやればいいの?

photo credit: plushoff via photopin cc

スボンサーリンク

バナーの役割

バナーとはWebで使用される画像のことです。一般的には画像にテキストなど加工を加えてサイトや個別ページへ誘導したり、コンテンツの視覚訴求したりします。

  • 誘導の役割
  • コンテンツを視覚で訴求する役割

サイトへの誘導はYahooでもよく見かけますね。興味関心連動型広告(インタレストマッチ)というものが代表例です。 コンテンツの視覚訴求は楽天やYahooショッピングを例にあげますが、商品のメリットなどをよくデカ画像で訴求しています。

バナー広告を作成することもありますが、まずはサイト内の視覚によるコンテンツ訴求用のバナーを作ることになれた方がいいと思います。理由はバナー作成する機会で僕は圧倒的に広告よりもサイト内のバナーを作ることが多いからです。

バナー作成ソフトを選ぶ

AdobeのPhotoshopやillustratorなどは制作現場では常用ですが、なかなか「高価ですぐには買えないよ」という人も多いのも現状です。実際に僕の知人のネットショップオーナーも「まだ購入できない」と漏らしてました。トライアル版や月額制などあります。

Adobe製品

無料ソフトでなんとかならないかという意見もありますので、その旨を取り上げさせてもらいます。よく代替ソフトとして挙げられるのがGIMPというソフトです。

GIMPのダウンロード

バナーのデザイン

写真に加工・修正をしてテキストを張り付けるというスタンダ-ドなデザインです。例えばネットショップであれば商品があります。商品画像にウリのテキストを貼りつけます。最低限のコツは

  • テキストは見やすいように縁取りなどメリハリをつける。
  • テキストをさらに見やすいように字詰めします。
  • テキストは商品にかぶらないよう気をつけます。
  • ぱっとしない時は奥行きを与えるためにグラデーションを使います。

他にも色々とありますが、まずはここだけ押さえます。 で、こんな感じです。

野菜バナー

出来上がったと思ったら全体的なバランスも必要なので、ちょっとパソコンから離れてみて全体を確認します。 これでOK!と思ってもしばらく時間をおいてみたり、翌日また確認すると修正すべきポイントによく気づきます。知り合いのデザイナーが言ってたことですが

「一晩寝かせる」

カレーかっ!ってツッコミましたが、後に僕にとっては信用できる言葉でした。落ち着いて見直すことができますね。

まとめ

バナー作成のコツといえば人それぞれにもなるかもしれません。自分なりの答えをもっている人もいるでしょう。あくまで基礎的なことの一部分をとりあげましたが、これからも機会があればバナー関連のコンテンツ続けていきたいです。

なんせ僕はそんな優秀じゃないもんで(;ω;*) ベンキョウ・ベンキョウ

コメントを残す

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

*