思わずクリックしたくなる！キャンペーン バナー制作のポイント
ストア担当者は商品画像やキャンペーンバナーの制作を任される機会も多いと思います。
ストア運営を始めたばかりの方やデザインに自信がない方は、「どのようにバナーを作ればいいんだろう？」と悩むことも多いでしょう。
そこで今回は、クリックしたくなるキャンペーンバナー制作のポイントについて解説します。
別の記事で「売れる商品画像の作り方」についてご紹介しましたので、併せてお読みください。
キャンペーンバナーサイズと設置箇所
Yahoo!ショッピング内でキャンペーンバナーを設置する主な箇所は以下のとおりです。
- ストアトップページの看板
- ストアトップページのフリースペース
- 商品ページのひと言コメント欄
Yahoo!ショッピングの新ストアデザインでは、ストアトップページの上部に「看板」と呼ばれるメニューを設定できる場所があります。
設置は必須ではなく任意ですが、ストアの一番目立つ箇所といえるので、ぜひキャンペーンバナーを設置しておきましょう。
設置サイズは高さ上限200px、横幅上限1290pxです。
■ストアトップページの看板
商品ページのひと言コメント欄にもバナーを掲載することができます。
設置サイズは高さ上限640px、横幅上限400pxです。
■商品ページのひと言コメント欄
新ストアデザインでのページ制作について詳しくは以下の記事をご参照ください。
キャンペーンバナーを制作しよう
キャンペーンバナーを制作する前に以下のことを確認しておきましょう。
どこの誰に、何を伝えたいか
キャンペーンや特集の対象となるお客様はどんな方で、「何を求めているのか」「男性なのか女性なのか」「クリックしたくなる言葉は何か」など想像しましょう。
どこに掲載するか
キャンペーンバナーをどこに掲載する（ストアトップ、商品ページ）と効果的かを考えましょう。
PC版、スマホ版のどの箇所に掲載するかでバナーサイズが決まるので、バナーサイズによってどの要素を優先するかを判断します。
キャンペーンバナー制作のポイント
キャンペーンバナー制作の際は以下のポイントが重要です。
- キャッチコピーはわかりやすく、簡潔に
- 伝えたい要素の重要度順に強調
- 写真と文字のコントラストを強くする（読みやすい）
- カラー、配色で色を使いすぎない
- イメージにあった素材を使う
それぞれ見ていきましょう。
キャッチコピーはわかりやすく、簡潔に
キャンペーンバナーのキャッチコピーは長い文章を書いたりせずに、わかりやすく、簡潔な短い文章で、興味をそそるような内容を記載しましょう。
お客様へのメリットを端的に伝えることが大切です。
商品やキャンペーンの詳しい説明はバナーのリンク先にあるので、キャンペーンバナーでは不要です。
伝えたい要素の重要度順に強調
キャンペーンタイトル、キャンペーンの締め切り、キャッチコピー、写真（メインビジュアル）などの伝えたい要素を並べ、重要度順に強調しましょう。
「Zの法則」にならってキャンペーンタイトル、キャッチコピーは左上を中心とした画像上部に、商品を真ん中に据えて、詳細を左下を中心にした画像下部に配置するのが効果的です。
「Zの法則」とは「人の目線の動き」を表した法則で、パソコンでいえば目線は左上から右上に、そして左下へ移って右下へと「Zの形」に動くというものです。
写真と文字のコントラストを強くする（読みやすい）
お客様に伝えることが重要ですから、パッと見て文字が入ってくる必要があります。
背景色と文字色のコントラストが強いほど文字が読みやすくなるので、強調したい言葉は背景色とのコントラストを強くしましょう。
カラー、配色で色を使いすぎない
配色に関しては、あまりたくさんの色を使いすぎないことがポイントです。
色使いに迷ったときは、メインビジュアルに使われているカラーや、遷移先のページのカラーを使いましょう。
イメージにあった素材を使う
キャンペーンバナーは第一印象が肝心なので、写真や素材選びにはこだわりましょう。
食品カテゴリでは、パッケージよりも調理イメージがあった方が美味しさが伝わるので、調理や使用シーンなどのイメージがあった方が良いでしょう。
また、画質の良くない写真素材を使っていると、それだけで雑な印象を与えてしまうので、なるべく高画質の素材を用意しましょう。
画像がきれいで、大きく見やすいとそれだけでも際立って見えるので、クリックされやすくなります。
以上のポイントを押さえてもらえると、クリックしたくなるバナーに近づくので、ぜひチャレンジしてみてください。
バナー制作にオススメは「GAZN（ガゾーン）」
クリックしたくなるバナー制作のポイントはわかったけれど、実際に制作するのは難しそう・・・と思われた方もいるかと思います。
でも、ご安心ください。
B-Spaceのらくらく画像制作ツール「GAZN（ガゾーン）」を利用すれば、HTMLの知識や、デザインのセンスがなくても誰でも簡単にキャンペーンバナーが作れます。
▶「GAZN（ガゾーン）」について詳しくはこちら
各種イベントやキャンペーンバナーのテンプレートもサイズ別で豊富にそろっています。
また、欲しいテーマやサイズがあればテンプレート制作のリクエストも受け付けています。
■看板サイズのテンプレート
■ひと言コメントサイズのテンプレート
テンプレートを選んで写真や文言を変えるだけで、デザイナーが制作したようなキャンペーンバナーが誰でも簡単に制作できます。
バナー設置にオススメは「にぎわいバナー」
GAZN（ガゾーン）で制作したバナーをストアに設置する際に役立つ機能がB-Spaceの「にぎわいバナー」です。
▶「にぎわいバナー」について詳しくはこちら
お客様属性に合わせてバナーを出し分けしたり、スライドさせたりできます。タイマー設定機能があるので、タイムセールなどのキャンペーンバナーも自動切替可能です。
ストアクリエイターProに貼り付けるためのHTMLタグを発行してくれるので、HTMLの知識がなくても動きのある複雑なバナー設定ができます。
まとめ
今回はストアのにぎわい演出に欠かせない「キャンペーンバナー制作のポイント」について紹介しました。クリックしたくなるバナーに共通するポイントを挙げましたので、ぜひ実践してみてください。
B-Spaceのサービス「GAZN（ガゾーン）」や「にぎわいバナー」をご利用いただくと、PC版、スマホ版の各種バナーの制作から設置までが簡単にできます。
B-Spaceには他にもネットショップの繁盛ツールがそろっています。一カ月無料でご利用いただけるので、ぜひお試しください。
