平均読み取り時間:6分
こんにちは!EveryFineです!
ホームページを運用している方の中にはバナーを設置している方がほとんどだと思います。
バナーをこれから作成、または制作依頼される方のご参考となれば幸いです。
目次
お店の前に立てられている「宣伝のぼり」や「宣伝看板」をイメージしていただくとわかりやすいと思います。
ホームページ上でも「宣伝のぼり」や「宣伝看板」と同じで、ホームページを宣伝するために目立つように貼られた画像のことを指します。
また、画像にリンクが貼られていて、クリックするとバナーの内容のホームページへ移動する仕組みになっています。
様々なメディア内でバナー広告の設置スペースが準備されていることも多く、インターネットを利用する方は日常的に目にしています。
※画像の右側、赤枠部分が参照ページのバナー広告の設置箇所になります
バナーを使う場所は、大きく2つに分けられます。
自分のホームページに載せるバナーであれば、サイズやデザインは自由に決めることができます。
しかし、広告出稿などで他人のホームページに掲載してもらう場合は、バナーのサイズに制限があります。
しかし、自分のホームページに載せるバナーだからサイズやデザインを自由に決めれたとしても、Googleが提供している広告配信プラットフォームが「高い効果が見込める広告サイズ」を定めていますので、そちらに従うほうがバナーとしての効果が見込めます。
300×250
テキストコンテンツの中や、記事の末尾に組み込むと効果的です。
ホームページ設置イメージ
336×280
テキストコンテンツの中や、記事の末尾に組み込むと効果的です。
ホームページ設置イメージ
728×90
メインコンテンツの上部やフォーラムホームページに配置すると効果的です。
ホームページ設置イメージ
300×600
インプレッション数が増加しているサイズで、ブランド認知度の向上を目的に使われることが多いサイズです。
ホームページ設置イメージ
その他にも、Googleが提供している広告配信プラットフォームが
「高い効果が見込める広告サイズ」は以下となります、ご参考ください。
高い効果が見込める広告サイズ
横長サイズ
縦長サイズ
スクエアサイズ
バナー作成は「簡単にできるだろう」と思いがちですが、情報量やレイアウト、配色などを考えると手が止まってしまうケースが多くあります。
カラーやフォントなどの細かい部分から考え始めると、要素が抜けてしまったり、時間がかかったりします。
ポイントなのが、大枠を考えて詳細を詰めていくことです。
ターゲットを定めたら、ターゲットになりきって行動を想像してみましょう。
「どんなページを見ているときに、どんな気持ちでバナーを押すかな」と考えることで、要素の重要度が見えてきます。
例として就職又は転職活動をしている方をターゲットにします。
(例)ターゲット:就職または転職活動をしている方
構成要素がはっきりしたら、いよいよバナー作成に着手します。
今回は初心者にも使いやすいパターンで作成します
画像、テキストタイル2枚をどのように配置するかを
パズルのピースをはめるように構成していきます
採用ページにふさわしい画像を決めます。
今回はスーツの男性にしました。
「自分が成長するチャンスがここにある」
ここには代表取締役のメッセージを入れます。
ただこのままでは収まりが悪いので
「成長するチャンスがここにある」とし、あえて主語をなくしクリックする本人が主語であるかのようにみせます。
「誰からも必要とされる会社になる」
テキスト2には経営理念を入れます。
このままでは採用のバナーだと直感的ではないので採用よりにテキストを編集します。
「誰からも必要とされる そんな仲間を募集」
仲間を募集している事を付け加える事で採用ページのバナーだと認知させます。
テキスト1:教科書体
「はね」や「押さえ」「とめ」などがしっかりした教科書体を使用します。
代表取締役のメッセージにはインパクトと堅実さを全面に押し出すためです。
テキスト2:明朝体
これは採用のバナーである事を認知させるため標準的なフォントである明朝体を使用しました。
迷った際には、メインビジュアルに使われているカラーや、遷移先のホームページのカラーを使いましょう。
遷移先のイメージと異なる配色にすると、ユーザーが戸惑って離脱してしまうので注意が必要です。
【ホームページで使う色を考える!】複数色の使い方をご紹介!
https://everyfine.e-tenki.co.jp/tips/12303
後はそれぞれフォントの大きさや画像のトリミングを行い、パズルのように【300×250】の枠にはめていくだけです
今回パズルのピースは下記ようになります。
完成したバナー
関連記事
よりクリックされるバナーのポイント① ~位置・サイズ編~
https://everyfine.e-tenki.co.jp/tips/10364/
ホームページで、よりクリックされるバナーのポイント②~色編~
https://everyfine.e-tenki.co.jp/tips/11158/
今回バナーを作成のコツで用いたサンプルあくまで1例になります。
バナーのデザインの可能性は無限大です。
ですが、作成するにあたり絶対に考えないといけない事は、
この3つになります。
もしファインズにバナーの作成を依頼する際も、この3つを明確に伝えていただけますと幸いです。
03-5459-4073
fines-help@e-tenki.co.jp
関連資料・記事
株式会社ファインズ
〒150-0002
東京都渋谷区渋谷2-12-15
日本薬学会長井記念館ビル6F
Mail:client-support@e-tenki.co.jp
ホームページ:https://e-tenki.co.jp/
情報発信サイト「Every Fine」:
https://everyfine.e-tenki.co.jp/