楽天市場のバナー制作ガイド｜サイズ確認・スマホ対策・売れる構成

楽天市場のバナー制作ガイド｜サイズ確認・スマホ対策・売れる構成

2026年3月20日 Category - バナー制作

最終更新日：2026年8月14日

楽天市場のバナーを作るときに、最初から「何ピクセルで作ればよいか」だけを探すと失敗しやすくなります。店舗トップ、カテゴリ、商品ページ、イベント告知では、バナーの役割も表示幅も違うからです。さらにPCとスマートフォンでは、同じ画像でも文字の見え方が大きく変わります。

この記事では、楽天市場のバナー制作を、掲載場所の整理、RMSでのサイズ確認、スマホ向けの情報設計、入稿前チェック、公開後の改善という順番で解説します。

楽天バナーは「どこから、どこへ案内するか」で設計する

バナーは装飾ではなく、ページ内の案内板です。制作前に、掲載場所とクリック後のページをセットで決めます。

• 店舗トップ：セール、クーポン、主力カテゴリへ案内する
• カテゴリページ：用途、価格帯、シリーズなどで商品を探しやすくする
• 商品ページ：関連商品、セット商品、サイズ違い、特集へ案内する
• イベント告知：スーパーSALEやお買い物マラソンなど、期間限定企画を伝える

たとえば店舗トップの大きな画像に、会社紹介、セール、送料無料、ランキング、レビューをすべて詰め込む必要はありません。最優先の行動を一つ決め、それ以外は下のバナーやカテゴリナビに分けます。

サイズはRMSの掲載場所で確認する

楽天市場では、店舗のテンプレートや掲載パーツ、PC・スマートフォンの違いによって必要な画像が変わります。過去の記事や他店舗の画像サイズをそのまま使わず、実際に使うRMSの編集画面で確認してください。

制作前の確認手順

1. RMSで編集する店舗・ページを開く
2. バナーを置くパーツまたは入力欄を特定する
3. 推奨幅、高さ、容量、ファイル形式の表示を控える
4. PC用とスマートフォン用を分けて登録できるか確認する
5. 現在のページをスクリーンショットで保存する
6. リンク先URLと掲載期間を決める

デザイナーへ外注する場合は、RMSの入力欄のスクリーンショットも一緒に渡します。「楽天用でお願いします」だけでは、店舗トップ用なのか商品ページ用なのか判断できません。

掲載場所別に考える比率

掲載場所	向いている形	主な情報
店舗トップ上部	横長	主力企画、ブランド、セール
カテゴリへの導線	正方形〜横長	カテゴリ名、代表商品、用途
商品ページ内	横長または縦長	関連商品、セット、特集
スマートフォン	画面幅に合わせた画像	一つの訴求と短い文字

ここで示すのは形の考え方です。実際のピクセル数と容量は、公開時点のRMS表示を優先してください。

スマートフォンで読める情報量に絞る

楽天市場では商品名、価格、ポイント、レビューなど、バナーの周囲にも多くの情報が表示されます。バナーまで情報過多になると、目に入りません。

スマートフォン用は次の順番で整理します。

1. 商品または企画が何か分かる
2. 利用者のメリットが分かる
3. 期間や条件が必要なら読める
4. クリック後に何が見られるか想像できる

メインコピーは原則2行以内にし、補足説明は商品ページへ移します。制作画面を縮小して見るのではなく、実際のスマートフォン幅で確認してください。

楽天らしい「お得感」と、商品らしさを両立する

セールでは赤、黄、金などの強い色が使われがちですが、すべてを強くすると重要な情報が埋もれます。背景、商品、価格・割引、CTAの優先順位を決め、強調色は一つか二つに絞ります。

情報の優先順位例

• 第一：対象商品または企画名
• 第二：割引、クーポン、ポイントなどのメリット
• 第三：期間・条件
• 第四：「対象商品を見る」などの行動

イベント名やポイント倍率を載せる場合は、対象条件と期間を必ず確認します。キャンペーン終了後も古いバナーが残らないよう、公開日と取り下げ日を制作管理表に記録してください。

商品画像は「切り抜き」と「使用場面」を使い分ける

価格や商品の種類を端的に伝える導線では、背景を整理した切り抜き画像が向いています。一方、食品の食卓風景、家具を置いた部屋、服を着た状態など、使った結果を伝えたい場合は使用場面の写真が有効です。

元画像が暗い、色が商品と違う、輪郭が粗い状態では、文字や装飾を足しても信頼感は上がりません。バナー制作の前に、明るさ・色・切り抜き・不要物の除去を整えます。具体的な方法は画像加工完全ガイドで解説しています。

制作から公開までの実務手順

1. 目的を決める：セール告知、カテゴリ誘導、回遊促進など
2. 遷移先を決める：公開済みページで内容と在庫を確認する
3. RMSで仕様を確認する：PC・スマホ、容量、形式を記録する
4. 素材を選ぶ：正式ロゴ、商品写真、イベント情報を集める
5. コピーを絞る：一つのバナーに一つの主要メッセージ
6. PC・スマホを確認する：文字切れや不自然な余白を直す
7. リンクと期間を設定する：リンク切れ、終了日を確認する
8. 公開後に計測する：クリック先の閲覧、売上、回遊を比較する

公開前チェックリスト

• RMSに表示された現在の仕様で作成した
• スマートフォンで文字が読める
• 商品画像の色や形が実物と大きく違わない
• 価格、割引、ポイント、期間の条件が正しい
• 「送料無料」などの表示条件に誤りがない
• リンク先が公開され、対象商品が表示される
• セール終了後の差し替え予定を決めている
• 画像ファイル名を用途と日付が分かる形にした
• 第三者の写真・ロゴ・フォントを使う権利がある

公開後の数字はバナー単体で判断しない

バナーのクリックが増えても、遷移先の商品が売り切れていたり、価格や送料が分かりにくかったりすると売上にはつながりません。RMSのアクセス・売上データを使い、掲載前後で次を比較します。

• バナー掲載ページの閲覧数
• リンク先ページの閲覧数
• 対象商品の転換率や注文数
• スマートフォンとPCの差
• セール期間と通常期間の差

差し替えるときは、商品写真、コピー、配色を一度に変えず、一つずつ試します。どの変更が効果につながったかを次回の制作に残せます。

外注時に渡す情報

• 掲載ページとRMS入力欄のスクリーンショット
• リンク先URL、掲載開始日、終了日
• ターゲットと伝えたいメリット
• 価格・ポイント・クーポンの確定情報
• 元の商品写真と正式ロゴ
• PC用・スマートフォン用の必要枚数
• 参考にしたい店舗と、真似したくない表現

他モールと同時に展開する場合でも、同じ画像をそのまま流用せず、掲載場所と利用者の行動に合わせて調整します。Amazon向けはAmazonのバナー制作ガイド、Yahoo!向けはYahoo!ショッピングのバナー制作ガイドをご覧ください。

よくある質問

楽天バナーの推奨サイズは何ピクセルですか？

掲載パーツ、店舗テンプレート、PC・スマートフォンで異なります。制作前に、実際に使用するRMSの入力画面に表示される推奨幅・容量・形式を確認してください。

PC用バナーをスマートフォンでも使えますか？

表示できても、文字が小さくなったり商品が見切れたりすることがあります。スマートフォン用にコピーを減らし、商品と主要情報を大きくした別画像を用意するほうが安全です。

セールバナーはいつ外せばよいですか？

原則として企画終了直後です。終了時刻と差し替え担当者を事前に決め、通常時の代替バナーも用意しておきます。

まとめ

楽天市場のバナー制作では、固定サイズを探す前に掲載場所・遷移先・目的を決めます。仕様はRMSで確認し、PCとスマートフォンを別々に検証してください。お得感だけでなく、商品が何で、クリック後に何が見られるかを明確にすると、店舗内の案内として機能するバナーになります。

BANNER DESIGN

ECのクリックにつながるバナー制作を相談

サイズ規定の確認、商品画像の選定、コピーとレイアウトまで、媒体に合わせてまとめて制作します。

✓ モール別サイズ対応✓ 商品画像の加工✓ 訴求違いの展開

バナー制作の詳細・料金を見る →