ページを読み込んでいます
アニメーションを使ったディスプレイ広告は、止まった画像に比べて目を引きやすい一方で、配信仕様の違いが成果検証を難しくします。本記事では、HTML5バナーとAPNG（Animated PNG）を取り上げ、それぞれの技術的な制約と計測のしやすさを一次資料で確認した範囲で整理し、効果検証の設計に活かすための観点を実務目線でまとめます。結論から言えば、「どちらが優れているか」を一般化するより、入稿先の仕様・計測できる指標・制作運用コストの三つを揃えて同条件で比較することが、意味のある検証への近道です。
01HTML5バナーとAPNGの位置づけを整理する
HTML5バナーは、HTML・CSS・JavaScriptと画像アセットをZIPにまとめた動くバナー広告で、Google広告などの主要ネットワークがネイティブに受け付けます。静的画像バナー、アニメーションGIF、そして入稿するHTML5広告は、Googleの「アップロード型ディスプレイ広告」の区分に含まれます Guide to Google Display Ad Sizes & Specs (2026)。インタラクティブ性の面では、HTML5はボタン・フォーム・スライダー・ホバー状態・インバナーゲームなど、クリックスルーだけでは実現できない操作をバナー内で完結させられる点が静止画やGIFとの違いです What Are HTML5 Ads? (And Why They Beat Static & GIF)。
一方のAPNGは、PNGにアニメーション制御チャンクを追加した画像フォーマットで、動画のような重い再生環境を必要としません。APNG仕様は2004年にMozillaのStuart ParmenterとVladimir Vukicevicが策定し、2021年9月14日以降はW3CのPNG Working GroupがPNG仕様の維持・発展を担い、2022年10月25日にAPNG拡張を含むPNG仕様第3版の公開作業草案が公表されました APNG。APNGファイルは有効なPNGファイルでもあるため、APNGに対応しないブラウザや環境では最初のフレームが静止PNGとして表示され、混在環境でも安全に配信できます APNG Explained: The Complete Guide To Animated PNG Files。
両者はそもそも用途が異なります。HTML5バナーはスクリプトで動きや相互作用を制御する「広告パッケージ」であり、APNGは「アニメーション画像」です。効果検証を考えるとき、この違いが計測できる指標の種類と直結します。
02配信仕様の違いが検証条件を左右する
効果検証は「同じ条件での比較」が出発点です。しかし、HTML5バナーとAPNGは入稿できる面も、要求される仕様も異なります。
Google広告のHTML5仕様
Google広告にHTML5をアップロードする場合、ファイル容量とアニメーション時間の制約があります。標準のGoogle広告アップロードではZIPアーカイブで提出し、ZIPは600KB以下、ディスプレイ側の厳しい要件では150KB未満、ZIP内のファイル数は40以下です Can You Use HTML5 Ads and Content on Google Ads?。アニメーションは30秒までで停止させ、短いループでも累計30秒で止める必要があります Can You Use HTML5 Ads and Content on Google Ads?。アカウント要件もあり、Googleはアカウント開設から90日以上経過し、累計で9,000米ドル超の支出とポリシー遵守の履歴がある口座に対してHTML5アップロードを許可し、申請後に承認する仕組みを採っています Google Ads (Display) HTML5 Banner Specs — Size Limits, clickTag and Requirements。
- 参考：foldwrap – Google Ads (Display) HTML5 Banner Specs
- 参考：revenuejack – HTML5 ad requirements for Google, DV360, and programmatic platforms
同じGoogleのプラットフォームでも、DV360はより大きな容量を扱えます。DV360は1広告あたり最大5MB、ファイル数100、HTTPコール100件までを許容します What Are HTML5 Ads? (And Why They Beat Static & GIF)。HTML5バナーで検証する場合、配信先が変わると許容容量が変わるため、同じ素材を使えるかを事前に確認する必要があります。
APNGが扱えるのは画像入稿枠
APNGは「画像ファイル」として扱われるため、HTML5枠ではなく静止画像の入稿枠に載せる形になります。ただし、現状のGoogle広告ヘルプなどで明確に「APNGをアップロード画像形式としてサポートする」と明記された公式記述は、今回の調査では確認できませんでした。Google広告のHTML5アップロードでZIPに含められる画像形式として明記されているのは、GIF、PNG、JPG、JPEG、SVGです What Are HTML5 Ads and How Can You Benefit From Their Use - The Brief AI。そのため、APNGを広告面で使うケースは、自社サイトのプロモーション枠、オウンドメディア内のバナー、特定のアドネットワークで画像として受け付けられる面など、入稿先ごとに個別に確認する必要があります。
一方で、技術的な再生環境は整っています。MDNによればAPNGのブラウザ対応はChrome 59、Edge 12、Firefox 3、Opera 46、Safari 8以降です Image file type and format guide - Media - MDN Web Docs。2017年にChromiumベースのブラウザがAPNGに対応し、2020年1月にMicrosoft EdgeがChromiumベースになったことですべての主要ブラウザがAPNGをサポートする状況になりました PNG。
共通する検証前提
比較を始める前に、次の条件を揃えておくと議論が明確になります。
- 入稿先と配信面（Google広告ディスプレイ、DV360、個別パブリッシャー、自社サイトなど）
- 許容される容量とアニメーション時間
- 計測できるイベント（インプレッション、クリック、インバナーの相互作用、動画完了率など）
- クリエイティブの意図と評価指標（CTR、エンゲージメント、認知、来訪後の挙動）
03効果検証で使える指標を見極める
アニメーションの効果を語るとき、CTRばかりが注目されがちです。ただ、HTML5とAPNGは計測できる範囲がそもそも異なります。
HTML5バナーはスクリプトを含むため、クリック以外の挙動を細かく計測できます。HTML5はクリックスルーに加えて、ボタン、フォーム、スライダー、ホバー状態、インバナーゲームなど、単なるリンク以上の相互作用を広告内で発生させられます What Are HTML5 Ads? (And Why They Beat Static & GIF)。HTML5広告ではGoogleのclickTagガイドラインに従ってクリックを正しく計測する必要があります Guide to Google Display Ad Sizes & Specs (2026)。ハンドリング次第ではクリック位置、ホバー時間、特定フレームの到達などを独自に計測することも可能です。
APNGは画像フォーマットのため、イベント計測はホスト側で用意した枠組みに限定されます。画像のインプレッションと、画像を囲むリンク要素のクリックが基本で、「どのフレームで止まったか」「どこで離脱したか」といった中間指標は取れません。検証指標としてはシンプルで、同じ配信面・同じランディングページの前提で、CTRとその後のコンバージョン率を素直に比較することになります。
検証で比較すべき指標の例
比較の粒度が揃うように、評価軸は次のように分けて考えると実務に乗せやすくなります。
- 到達・露出：インプレッション、ビューアビリティ
- 直接反応：クリック数、CTR
- 相互作用（HTML5のみ）：ホバー、特定ボタン押下、フォーム入力完了
- 事後効果：ランディング後の直帰、回遊、コンバージョン率
計測条件を揃えたうえで、「APNGにできない計測は比較対象から外す」「HTML5にしかできない要素はクリエイティブ差ではなく仕様差として記録する」という線引きが、誤った結論を避ける鍵です。
04容量・再生環境の制約と品質のトレードオフ
アニメーションの表現力と容量は常にせめぎ合います。配信プラットフォーム側の制約を理解したうえで、どちらの形式を選ぶかを決める必要があります。
容量とフレームレートの実態
Google広告の画像アップロード枠では、容量と時間、フレームレートに明確な上限があります。Googleは、アニメーションを30秒以下に収めること、ループする場合も30秒で停止すること、フレームレートを5フレーム毎秒未満にすることを求めています How to Compress Display Ads Under Google's 150KB Limit (2026)。この5fps未満という制約はGIFを想定したものですが、「動く画像」として検討されるAPNGを同じ枠に載せる場合も、面ごとの要件を確認する必要があります。
HTML5バナーの容量制約は、スクリプトとアセット全体で評価されます。Google広告のHTML5はZIPで最大600KB、ファイル40までで、相対パス参照が必要です。アニメーションGIFは150KBが上限で、30秒で停止、5fps未満という条件が別途課されます Google Display Ad Specs 2026: All 20 Sizes and Limits。「HTML5は150KBまで」と記載する資料がよくありますが、これは静止画・GIFの制限を混同したもので、実際には4倍近い容量予算を使えます Google Display Ad Specs 2026: All 20 Sizes and Limits。
IABのファイル重量ガイダンス
パブリッシャー側の受け入れ基準として、IABの「New Standard Ad Unit Portfolio」が参照されることがあります。このポートフォリオは、軽量・暗号化・AdChoices対応・非侵襲というLEAN原則に基づくアド体験を重視しています www.iab.com/newadportfolio #IABNewAdPortfolio © 2017 IAB Technology Laboratory。推奨される固定サイズのLEAN適合ファイル重量は、たとえば300×250（Medium Rectangle）で初期ロード150KB・サブロード300KB、300×600で200KB・400KB、160×600で150KB・300KB、728×90で100KB・200KBとされています IAB NEW AD PORTFOLIO TRANSITION GUIDANCE。HTML5バナーを設計する際は、ネットワーク側の上限だけでなく、こうした業界ガイダンスも併せて確認しておくと、パブリッシャーからの入稿差し戻しを減らせます。
- 参考：IAB – New Standard Ad Unit Portfolio Transition Guidance (PDF)
- 参考：manypixels – Google Display Ad Specs 2026
APNGと他フォーマットの関係
APNGは画像として軽量に扱える一方、動画より効率は劣ります。APNGとGIFはどちらも動画の代替としては非効率で、可能であればMP4を使うべきですが、短い透過付きアニメーションにはAPNGが適しています Video to animated PNG converter。MDNもAPNGを可逆のアニメーションシーケンスに適した選択肢と位置づけており、AVIFやWebPはより高い性能を示すもののブラウザサポートが限定的だと述べています Image file type and format guide - Media - MDN Web Docs。表現の軽さやロゴ・アイコンの短いモーションではAPNGの利点が出やすく、一方で複雑な演出やインタラクションが求められる場面ではHTML5が現実的な選択になります。
05検証設計の進め方：仮説・制作・運用の順に揃える
効果検証を一度きりのA/Bテストで終わらせず、知見が積み上がる形で回すには、設計の順番が大切です。以下は実務で取りやすい進め方の一例です。
仮説を数値ではなく挙動で定義する
「CTRが上がる」だけを仮説にすると、どのクリエイティブ要素が効いたのかが分からなくなります。たとえば「商品カットを1秒以内に提示するほうが、タイトルを先に出すよりも初動クリックが増えるか」「アニメーションのループ回数を2回に抑えると、過剰な動きで離脱するユーザーが減るか」といった、挙動と理由で仮説を立てると、結果の解釈が可能になります。根拠として提示できる数値が内製で蓄積されていない段階では、仮説自体は社内議論で定義し、検証後に数値で裏付けていく姿勢が現実的です。
制作時に「検証に使う素材」を明示する
HTML5バナーとAPNGを並べて比較するのか、HTML5同士でアニメーションの違いを検証するのかで、作るべき素材が変わります。配信先の仕様を踏まえて、同じ尺・同じ訴求要素で素材を揃えることが前提です。30秒という時間制約はGoogleディスプレイ関連製品とAdRollで共通して見られる上限です HTML5 Banner Ad Specs by Platform (2026 Guide)から、HTML5とGIF・APNGなど形式をまたいで比較する際も、アニメーション時間を揃えると議論が噛み合います。
計測ログと指示のナレッジを残す
比較結果だけを残しても、次の検証に活かすのは難しいものです。配信面、入稿時のファイル名、容量、アニメーション秒数、確認フロー、修正指示の内容と承認者をまとめて残す仕組みがあると、同じ条件での再現や後発施策への適用が進みます。Off Beatが提供しているAd Checkは、動画・バナーの確認、コメント・共有、修正指示をナレッジとして蓄積することを目的に、2026年10月13日に利用受付を開始した広告AIチェック・品質管理のプロダクトです。制作過程の確認履歴そのものが、効果検証の前提条件を揃える役割を果たします。
06運用で起きがちな落とし穴と対処の目安
検証を設計通りに走らせるには、入稿・配信の段階でつまずきを減らしておく必要があります。以下は、仕様の読み違いや運用上のミスでよく起きる例と、対処の目安です。
-
容量制限の取り違え：HTML5バナーの上限を150KBと誤認して、必要な演出をあきらめてしまう。実際はHTML5とAMPHTMLのZIPバンドルは600KBまで Google Display Ad Specs 2026: All 20 Sizes and Limits許容されます。
-
アニメーション停止の見落とし：アニメーション長は30秒以内で、ループさせる場合も合計30秒で止める必要があり、終わりなく回し続けることはできません Guide to Google Display Ad Sizes & Specs (2026)。制作段階からタイムラインの終端を設計に組み込むと差し戻しが減ります。
-
外部アセット依存：Google広告のHTML5では、原則としてZIP内に全アセットを含める必要があります。運用チェックリストでは、150KB未満、index.htmlがルートにあること、clickTagの実装、相対パス、JS・CSSの最小化、外部URLやCDN呼び出しがないこと、アニメーションが30秒で停止すること、コンソールエラーがないことが挙げられています HTML5 ad requirements: Google Ads & DV360。
-
APNGの非対応環境への配慮不足：APNG非対応環境では最初のフレームだけが表示されます Animated PNG (APNG)。先頭フレームでも訴求が成立するよう、1枚目に主要な要素を配置するのが安全です。
-
フォント運用の制約：Google Web DesignerでHTML5広告を作る場合、使用できるフォントはGoogle Web Fontsに限られるなどの制限があります What Are HTML5 Ads and How Can You Benefit From Their Use - The Brief AI。制作ツール側の制約も事前に押さえておく必要があります。
07効果検証の結果をどう活かすか
HTML5バナーとAPNGの比較は、「どちらが一律に強いか」という問いよりも、「どの配信面で、どの訴求と、どの計測軸で有効か」を切り分ける作業に近いものです。たとえば、相互作用の有無を数値で把握したいならHTML5一択に近くなります。一方、短くシンプルなアニメーションでロゴや商品特長を見せたい場合、入稿先が画像枠を受け付けるならAPNGも検討対象に入ります。
比較から得られる示唆を次回に活かすには、クリエイティブ側で起きた変化を「どの部分を変えたら数字がどう動いたか」の形で残すことが重要です。HTML5のインバナーログとAPNGのクリックデータを突き合わせる際、同じランディングページ・同じターゲティング・同じ時間帯で揃えれば、残差としてフォーマット由来の差分を見ることができます。
Off Beatは広告クリエイティブ制作とAI SaaS・AX事業を軸に、制作現場で培った知見をお客様自身が使えるプロダクトへと変える取り組みを進めています。IABのLEANガイダンスでも、初期ロードと分割ロードの配分、ファイル数、要求の順序など、設計上の制約は多岐にわたります www.iab.com/newadportfolio #IABNewAdPortfolio © 2017 IAB Technology Laboratory。こうした制約を一元的に点検できる確認フローを持ち、検証で得た判断材料を次の制作にフィードバックできる体制を作ることが、効果検証を単発の数字比べで終わらせないための基本線となります。Ad Checkは広告AIチェック・品質管理のプロダクトとして、確認と修正指示をナレッジとして残す役割を担っています。並行して開発・検証中のAd Loopは、広告の制作・運用を一つにつなぎ、「データと知見を次の判断に」という方向性を目指しているプラットフォームです。どちらのプロダクトも、仕様と計測が複雑化するアニメーションバナーの検証に向き合う実務担当者の支えになることを意識して設計しています。
