在宅・フリーランスになるためのバナー作成講座
Webサイト制作で必要な要素のひとつ「バナー」このバナー作成講座では、基本の作り方をPhotoshop Illustratorを使って作成していきます。
バナーっていうのは、ネットショップとかで見かける広告ですか？
そうですね。バナーは旗の意味合いがあって、お店の前にもよくみかける「のぼり旗」と同じ効果があります。のぼり旗が立っていると、このお店のおすすめが何であるかわかります。バナーも同じように、クリックした先に何があるのか？誘導する要素が必要です。
バナー作成するための準備
バナーを作成するアプリは、特にこれでないとダメ！と決まりがあるわけではありません。
使いやすい、慣れたプログラムでもかまいません
ただ、Webデザインの仕事としてバナー作成を依頼される場合は別です。一般的にクラウドソーシングなどでも、PSDファイルで納品やAIファイルで納品と書いてあったりします。
- Photoshop 形式で納品（拡張子がPSD）
- Illustrator形式で納品（拡張子がAI)
Photosop とIllustratorはadobeから出ている写真加工やイラストを描く専門のプログラムですが、Webデザインの世界でも広く使われており、歴史の長い、多機能なプログラムです。
今回は写真加工をメインとする場合はPhotoshop。イラストなどが主に入ってくる場合はIllustratorを使ってバナーを作成していきます。
作成する前にバナーのサイズ・種類を覚えよう
バナーには、よく使うサイズがあらかじめ決められています。
広告バナーには 正方形のもの 正方形の変形 縦長 横長といくつか種類があります。
また、フロントページ（トップページ）などにある目をひく大型のキャンペーンバナー。スクリプトなどを使ってスライドショー（フェードイン・フェードアウト）になっていたり、カルーセル（画像が右から左に移動するもの）などがあります。
大きめのキャンペーンバナーは迫力があるのでポートフォリオなどにはむいていますね
ただ広告バナーで一番人気のサイズは、レクタングル 横300ピクセル 縦250ピクセルのサイズです。これは、google広告（アドセンス）に採用されてからブログなどのサイドバーで非常によくみかけるサイズです。
あとは、サイズ感が大きくて目にとまりやすい 横728ピクセル 縦90ピクセルが人気です。またその変形として横728ピクセル 縦幅が異なるのも多いです。
縦に長くとる スカイクレーパーも根強い人気で、ブログなどのサイドバーは、レクタングルとスカイクレーパの変形などがよくみかけます。
フォントの準備もしておこう
バナーは、限られたスペースの中で効果的なコピー・キャッチフレーズ・目に留まる文章 が必要です。内容ももちろんですが、素晴らしいキャッチーなコピーでもそれを表示するフォント（書体）がうっすらとしていて、目立たなかったら目を惹きません。また、これでもか！という感じの強いフォントもまた、ユーザーがひいてしまいます。内容にあったフォントをマッチングさせてバナーを完成させていきます。
今回は動画の中でAdobe フォントの利用の仕方も解説しています。
コメント