如何为广告服务器准备 HTML5 横幅

横幅在你的屏幕上可能看起来完美无缺，却仍被广告服务器拒绝。通常原因都一样：有一个技术细节没有人检查。本指南按顺序列出上传HTML5 横幅前值得确认的事项。

开始之前

请询问发布方（或查阅目标平台的文档）三件事：接受哪些尺寸、每个文件最大多少，以及是否允许外部资源。这三项决定了其余的一切，而每个平台都有自己的规定。

素材包：根目录中有 index.html 的 .zip

横幅以 .zip 文件交付。在压缩包内，index.html 必须位于根目录（不能放在文件夹里），图片或字体等资源与它放在一起或放在子文件夹中。一个非常常见的错误是压缩整个文件夹而不是它的内容：广告服务器打开 .zip 后在根目录找不到 index.html，于是拒绝它。

如果你有多种尺寸或语言，每种组合都是一个独立的素材，各有自己的 .zip。BannerMotion 默认这样打包（「每个素材一个 .zip」），也可以把语言放进文件夹中（「每种尺寸一个 .zip」）。

声明的尺寸

横幅通过 <head> 中的 meta 标签声明自己的尺寸。平台读取它来决定如何显示，并核对它是否与你购买的广告位相符。

<meta name="ad.size" content="width=300,height=250">

标签中的尺寸、横幅容器的尺寸以及购买的广告位尺寸必须精确到像素一致。把 300×250 的横幅放进 300×600 的广告位是投放错误，而不是平台的问题。

clickTag：目标链接

目标链接不会直接写死在横幅里。横幅读取一个名为 clickTag 的变量（由平台定义），并在有人点击时使用它。这样广告服务器可以在跳转到你的页面之前统计每一次点击。

<script>
  var clickTag = "https://tu-sitio.com";
</script>

<div id="hit" role="link" tabindex="0"></div>
<script>
  document.getElementById("hit").onclick = function () {
    window.open(window.clickTag, "_blank");
  };
</script>

三个容易被忽略的细节：变量必须写成完全一样的 clickTag（大小写敏感）；文件里填写的地址只是测试用的，许多平台在投放时会替换它；横幅应当只有一个点击动作，覆盖整个素材。有些平台使用自己的库或不同的名称，请查看其指南。

.zip 的最大大小

每个平台都对 .zip 设定了上限。请始终测量最终的 .zip，而不是未压缩的文件夹，并留出余量：上传前缩小比被拒绝后再修正更容易。有些平台还会区分初始加载和总加载（即polite load）。

BannerMotion 在导出时测量每个素材的大小，并与你设定的可配置上限比较；这个上限不能替代你平台的真实限制。横幅不包含第三方库，这有助于保持较小的体积。[PLACEHOLDER：可公开的单个素材典型大小，待有测量数据时补充。]

按影响从大到小排列，最占空间的是：视频、图片（尤其是为视网膜屏准备的双倍分辨率图片）、字重很多的字体，以及库。要减小体积：尽量用文字和矢量形状（SVG）代替图片，把小图标合并到一张精灵图中，压缩照片，只加载你实际用到的字体字重。

不使用外部资源

横幅需要的一切都必须放在 .zip 之中：图片、字体和库。许多平台会阻止或降低向其他服务器请求文件（例如来自 CDN 的字体、托管在外部的库）的素材，因为它们无法保证这些文件可用或安全。在 BannerMotion 中，素材包是自包含的：它不会向其他域名发出请求。

动画、时长和重复次数

平台通常会限制动画的时长以及重复的次数（常见的是最多约 30 秒，循环次数较少）。确切数值由各平台决定。BannerMotion 导出器在其通用预设中以 30 秒为最长时长。

两条不依赖任何人的好做法：让信息和按钮在最后一帧就已完整（因为那一帧会停留在屏幕上）；动作使用平滑的缓动，并基于少量精心选择的关键帧，而不是许多急促的动作。

备用图片

有些平台要求提供一张相同尺寸的备用图片（JPG、PNG 或 GIF），在浏览器无法运行 HTML5 时显示。通常使用动画的最后一帧。请确认你的平台是否要求它、它应放在素材包内还是另外提供，以及最大大小。在 BannerMotion 中，静态备用图在导出页面中显示为「即将推出」。

上传前先测试

将 .zip 解压到一个新文件夹，在浏览器中打开 index.html。检查：动画能完整播放，文字没有被截断，点击会打开你预期的地址，并且浏览器控制台中没有任何错误。在活动中最小和最大的尺寸上各重复一次。

无法测试的横幅就不算完成。

检查清单

• .zip 的根目录中有 index.html。
• ad.size 标签与横幅尺寸以及购买的广告位一致。
• 点击使用 clickTag，并且只有一个点击动作。
• .zip 小于平台的大小限制（BannerMotion 会按你设定的上限提醒你）。
• 没有外部资源：不向其他域名请求任何内容。
• 时长和重复次数在平台允许的范围内。
• 最后一帧包含完整的信息和按钮。
• 已在浏览器中测试，最小和最大尺寸都已测过。

上传时：什么是投放

上传横幅并将其分配到活动、日期和广告位，是投放的工作。当素材包准备得当时，这一步只需上传、在平台的预览中测试并分配。发布后，请在广告服务器的报告中确认点击正在被统计。

BannerMotion 导出每个素材时都包含声明的尺寸、已加入的 clickTag 以及已验证的大小，并在缺少某项时提醒你。直接发送到广告服务器的功能已列入产品计划：目前你需要下载素材包并手动上传。