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


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

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

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

今回は、その疑問にお答えします。

photo credit: plushoff via photopin cc

スポンサーリンク

バナーの役割

バナーとはWebで使用される画像のこと。

画像にテキストなど加工してサイトや個別ページへ誘導したり、コンテンツの視覚訴求したりします。

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

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

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

バナー作成ソフトを選ぶ

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

Adobe製品

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

GIMPのダウンロード

スポンサーリンク

バナーのデザイン

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

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

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

野菜バナー

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

「一晩寝かせる」

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

まとめ

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

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


ABOUTこの記事をかいた人

雑記ブロガー。月間18万人に読まれる「働く君に花束を!」運営者。職場で無視されいじめにあったので『対会社、ハラスメント、仕事ネタ』について記事を書くようになりました。 内向型のポジティブヤロウです。

▼詳しくはこちらをクリック&タップ
プロフィール詳細 / お問い合わせ