用語集は行

バナー

サイトやメルマガにおいて、特定のキャンペーンや記事、サービスへ誘導するための「画像リンク」のことです。Web 担当者が日々最も多く扱うデザイン素材です。

主な用途として、①サイト内バナー(自社サイトでの回遊促進)、②広告バナー(他社サイトに出稿して集客)、③メルマガバナー(メール内の視覚的なリンク)に分けられます。

Web 担当者が握るべき「設計のポイント」

バナー単体の見栄えよりも、「誰に・何を・どうしてほしいか」を設計することが重要です。以下の要素を事前に決めておくと、デザイナーへの依頼がスムーズになります。

  • 訴求軸の言語化:ターゲットと、クリック後の行動(購入、登録など)を明確にする。
  • 配置と表示形式:設置場所や頻度、適した画像形式(軽量な WebP など)を決める。
  • 媒体ごとの規定:広告の場合は、出稿先ごとのサイズ規定を守る。
  • 効果測定の準備計測タグを仕込み、クリック率を測れるようにする。

現場で陥りやすい失敗と注意点

  • 作りっぱなしで検証しない:計測タグがなく、A/B テストや改善ができない。
  • バナーの貼りすぎ:サイト内が広告だらけに見え、逆にユーザーに無視される(バナーブラインドネス)。
  • 過度な装飾:ブランドイメージ(ブランドトーン)に合わない派手な煽りで信頼を損なう。
  • アクセシビリティの低下:文字を画像化したのに「alt 属性属性(代替テキスト)」を入れ忘れる。
  • メールでの画像ブロック:メルマガの画像が表示されなかった場合の対策(テキストリンク(テキストメール)の併記など)が漏れている。

言葉をよく利用する人

  • デザイナー
  • マーケター
  • 広告運用者
  • Web 担当者(発注側)
  • ライター / コピーライター

会話上での使用例

サイト内バナーを増やしたいと言われた場面

  • マーケター
    事例紹介のバナーを、トップに3つ並べたいんですけど。
  • Web 担当者
    3つ並べると、どれが一番見てほしいのか優先順位が消えてしまうんです。1つに絞ってローテーション表示にするか、事例一覧へのテキストリンクにアイキャッチ画像を1枚添える形がおすすめです。クリック率をGTMで計測して、効果が出ない案は引っ込める運用にしましょう。

メルマガバナーの効果が読めない場面

  • Web 担当者
    メルマガのバナー、どうもクリックが少なくて。
  • マーケター
    Outlookなど画像がブロックされる環境が多いので、画像だけでなくテキストリンクを必ず併用しましょう。altテキストにも訴求の文言を入れて、画像が表示されなくても内容が伝わるようにすると改善しやすいです。

関連 Lesson(本書本文)

Lesson 4-1 デザインを判断する軸