Skip to main content
このガイドでは、静的バナーからサードパーティタグ、HTML5 クリエイティブまで、AdCP におけるディスプレイ広告フォーマットの表現方法を説明します。

ディスプレイフォーマットの特徴

AdCP のディスプレイフォーマットには次が含まれます。
  • ホスト型画像 - 静的画像ファイル(JPG, PNG, WebP, GIF)
  • HTML5 クリエイティブ - 複数アセットのインタラクティブバナー
  • サードパーティタグ - 外部アドサーバーが配信する JavaScript/HTML タグ
  • レスポンシブフォーマット - 複数サイズに適応
  • リッチメディア - エキスパンダブルやインタラクティブフォーマット

標準 IAB ディスプレイフォーマット

Medium Rectangle (300x250)

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_300x250"
  },
  "type": "display",
  "assets": [
    {
      "asset_id": "banner_image",
      "asset_type": "image",
      "asset_role": "hero_image",
      "required": true,
      "requirements": {
        "width": 300,
        "height": 250,
        "file_types": ["jpg", "png", "webp", "gif"],
        "max_file_size_kb": 200
      }
    }
  ]
}

Leaderboard (728x90)

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_728x90"
  },
  "type": "display",
  "assets": [
    {
      "asset_id": "banner_image",
      "asset_type": "image",
      "asset_role": "hero_image",
      "required": true,
      "requirements": {
        "width": 728,
        "height": 90,
        "file_types": ["jpg", "png", "webp"],
        "max_file_size_kb": 150
      }
    }
  ]
}

Wide Skyscraper (160x600)

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_160x600"
  },
  "type": "display",
  "assets": [
    {
      "asset_id": "banner_image",
      "asset_type": "image",
      "asset_role": "hero_image",
      "required": true,
      "requirements": {
        "width": 160,
        "height": 600,
        "file_types": ["jpg", "png", "webp"],
        "max_file_size_kb": 150
      }
    }
  ]
}

Billboard (970x250)

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_970x250"
  },
  "type": "display",
  "assets": [
    {
      "asset_id": "banner_image",
      "asset_type": "image",
      "asset_role": "hero_image",
      "required": true,
      "requirements": {
        "width": 970,
        "height": 250,
        "file_types": ["jpg", "png", "webp"],
        "max_file_size_kb": 300
      }
    }
  ]
}

Mobile Banner (320x50)

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "mobile_banner_320x50"
  },
  "type": "display",
  "assets": [
    {
      "asset_id": "banner_image",
      "asset_type": "image",
      "asset_role": "hero_image",
      "required": true,
      "requirements": {
        "width": 320,
        "height": 50,
        "file_types": ["jpg", "png", "webp"],
        "max_file_size_kb": 150
      }
    }
  ]
}

Mobile Interstitial (320x480)

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "mobile_interstitial_320x480"
  },
  "type": "display",
  "assets": [
    {
      "asset_id": "banner_image",
      "asset_type": "image",
      "asset_role": "hero_image",
      "required": true,
      "requirements": {
        "width": 320,
        "height": 480,
        "file_types": ["jpg", "png", "webp"],
        "max_file_size_kb": 300
      }
    }
  ]
}

クリエイティブマニフェスト

シンプルな画像バナーマニフェスト

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_300x250"
  },
  "assets": {
    "banner_image": {
      "asset_type": "image",
      "url": "https://cdn.brand.com/banner_300x250.jpg",
      "width": 300,
      "height": 250
    },
    "landing_url": {
      "asset_type": "url",
      "url_type": "clickthrough",
      "url": "https://brand.com/spring?campaign={MEDIA_BUY_ID}"
    },
    "impression_tracker": {
      "asset_type": "url",
      "url_type": "tracker",
      "url": "https://track.brand.com/imp?buy={MEDIA_BUY_ID}&cb={CACHEBUSTER}"
    }
  }
}

アニメーション GIF マニフェスト

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_300x250"
  },
  "assets": {
    "banner_image": {
      "asset_type": "image",
      "url": "https://cdn.brand.com/animated_300x250.gif",
      "width": 300,
      "height": 250,
      "animated": true,
      "animation_duration_ms": 15000
    },
    "landing_url": {
      "asset_type": "url",
      "url_type": "clickthrough",
      "url": "https://brand.com/spring"
    }
  }
}

サードパーティタグフォーマット

JavaScript タグフォーマット

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_300x250_3p"
  },
  "type": "display",
  "assets": [
    {
      "asset_id": "tag",
      "asset_type": "javascript",
      "asset_role": "third_party_tag",
      "required": true,
      "requirements": {
        "width": 300,
        "height": 250,
        "max_file_size_kb": 200,
        "https_required": true
      }
    }
  ]
}
JavaScript タグマニフェスト:
{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_300x250_3p"
  },
  "assets": {
    "tag": {
      "asset_type": "javascript",
      "content": "<script src=\"https://ad-server.brand.com/serve?campaign={MEDIA_BUY_ID}&size=300x250&cb={CACHEBUSTER}\"></script>"
    }
  }
}

HTML タグフォーマット

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_728x90_html"
  },
  "type": "display",
  "assets": [
    {
      "asset_id": "tag",
      "asset_type": "html",
      "asset_role": "third_party_tag",
      "required": true,
      "requirements": {
        "width": 728,
        "height": 90,
        "max_file_size_kb": 200,
        "https_required": true
      }
    }
  ]
}
HTML タグマニフェスト:
{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_728x90_html"
  },
  "assets": {
    "tag": {
      "asset_type": "html",
      "content": "<iframe src=\"https://ad-server.brand.com/render?campaign={MEDIA_BUY_ID}&size=728x90&cb={CACHEBUSTER}\" width=\"728\" height=\"90\" frameborder=\"0\" scrolling=\"no\"></iframe>"
    }
  }
}

HTML5 複数アセットフォーマット

HTML5 フォーマットは複数アセットを指定し、パブリッシャー側アドサーバーがインタラクティブクリエイティブに組み立てます。

HTML5 バナーフォーマット

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_300x250_html5"
  },
  "type": "display",
  "assets": [
    {
      "asset_id": "background_image",
      "asset_type": "image",
      "asset_role": "background",
      "required": true,
      "requirements": {
        "width": 300,
        "height": 250,
        "file_types": ["jpg", "png"]
      }
    },
    {
      "asset_id": "logo",
      "asset_type": "image",
      "asset_role": "logo",
      "required": true,
      "requirements": {
        "max_width": 100,
        "max_height": 50,
        "file_types": ["png", "svg"]
      }
    },
    {
      "asset_id": "headline",
      "asset_type": "text",
      "asset_role": "headline",
      "required": true,
      "requirements": {
        "max_length": 25
      }
    },
    {
      "asset_id": "cta_text",
      "asset_type": "text",
      "asset_role": "call_to_action",
      "required": true,
      "requirements": {
        "max_length": 15
      }
    }
  ]
}
HTML5 マニフェスト:
{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_300x250_html5"
  },
  "assets": {
    "background_image": {
      "asset_type": "image",
      "url": "https://cdn.brand.com/bg.jpg",
      "width": 300,
      "height": 250
    },
    "logo": {
      "asset_type": "image",
      "url": "https://cdn.brand.com/logo.png",
      "width": 80,
      "height": 40
    },
    "headline": {
      "asset_type": "text",
      "content": "Spring Sale - 50% Off"
    },
    "cta_text": {
      "asset_type": "text",
      "content": "Shop Now"
    },
    "landing_url": {
      "asset_type": "url",
      "url_type": "clickthrough",
      "url": "https://brand.com/spring"
    }
  }
}

レスポンシブディスプレイフォーマット

レスポンシブフォーマットはプレースメントの文脈に応じて複数サイズに適応します。

レスポンシブバナーフォーマット

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_responsive"
  },
  "type": "display",
  "responsive": true,
  "supported_sizes": ["300x250", "728x90", "320x50"],
  "assets": [
    {
      "asset_id": "background_image",
      "asset_type": "image",
      "asset_role": "background",
      "required": true,
      "requirements": {
        "min_width": 728,
        "min_height": 250,
        "responsive": true,
        "file_types": ["jpg", "png", "webp"]
      }
    },
    {
      "asset_id": "logo",
      "asset_type": "image",
      "asset_role": "logo",
      "required": true
    },
    {
      "asset_id": "headline",
      "asset_type": "text",
      "asset_role": "headline",
      "required": true,
      "requirements": {
        "max_length": 30
      }
    }
  ]
}

リッチメディアフォーマット

エキスパンダブルバナーフォーマット

{
  "format_id": {
    "agent_url": "https://creative.adcontextprotocol.org",
    "id": "display_970x250_expandable"
  },
  "type": "display",
  "expandable": true,
  "collapsed_size": "970x250",
  "expanded_size": "970x600",
  "assets": [
    {
      "asset_id": "collapsed_creative",
      "asset_type": "html",
      "asset_role": "collapsed_state",
      "required": true,
      "requirements": {
        "width": 970,
        "height": 250,
        "max_file_size_kb": 200
      }
    },
    {
      "asset_id": "expanded_creative",
      "asset_type": "html",
      "asset_role": "expanded_state",
      "required": true,
      "requirements": {
        "width": 970,
        "height": 600,
        "max_file_size_kb": 500
      }
    }
  ]
}

ディスプレイ専用マクロ

ユニバーサルマクロ に加えて、ディスプレイフォーマットでは以下をサポートします。

プレースメントコンテキスト

  • {PLACEMENT_ID} - IAB Global Placement ID
  • {FOLD_POSITION} - above_fold / below_fold
  • {AD_WIDTH} / {AD_HEIGHT} - 広告枠のピクセル寸法

Web コンテキスト

  • {DOMAIN} - パブリッシャードメイン(例: “nytimes.com”)
  • {PAGE_URL} - ページの完全 URL(URL エンコード)
  • {REFERRER} - HTTP リファラ URL
  • {KEYWORDS} - ページキーワード(カンマ区切り)

デバイスコンテキスト

  • {DEVICE_TYPE} - mobile / tablet / desktop
  • {OS} - iOS, Android, Windows, macOS
  • {USER_AGENT} - 完全な UA 文字列
ディスプレイマクロを用いた例:
https://track.brand.com/imp?
  buy={MEDIA_BUY_ID}&
  placement={PLACEMENT_ID}&
  domain={DOMAIN}&
  fold={FOLD_POSITION}&
  device={DEVICE_TYPE}&
  cb={CACHEBUSTER}

よく使われるファイル仕様

画像要件

  • ファイルタイプ: JPG, PNG, WebP, GIF
  • 最大ファイルサイズ:
    • 標準バナー: 150〜200KB
    • 大型フォーマット (970x250): 300KB
    • アニメ GIF: 500KB
    • HTML5 初期ロード: 200KB

サードパーティタグ要件

  • HTTPS 必須: すべてのタグ URL は安全なプロトコルを使用
  • 最大ファイルサイズ: タグ内容 200KB
  • 非同期ロード: ページ表示をブロックしないこと

アニメーション仕様

アニメ GIF フォーマットの場合:
  • animated: true
  • animation_duration_ms: アニメーション時間(ミリ秒)
  • よくある長さ: 15000ms(15 秒)

関連ドキュメント