IAB认证的标准广告尺寸包括：300×250（中矩形）、728×90（横幅）、160×600（竖幅）、320×50（移动横幅）、300×600（大矩形）；旧尺寸如468×60已降权，小图标尺寸如120×60仅限特定平台内部使用。
网页广告尺寸没有“全局强制标准”，但存在被主流广告平台、浏览器兼容性、响应式布局和IAB（互动广告局）广泛采纳的**事实标准尺寸**。直接按这些尺寸做，能避开80%的投放失败、审核驳回或展示错位问题。
哪些尺寸是IAB认证的“标准广告尺寸”
IAB在2023年更新的《Display Advertising Guidelines》中明确列出以下为“Recommended Standard Ad Sizes”，所有主流广告联盟（Google Ad Manager、腾讯优量汇、穿山甲）均优先支持：
-
300x250（中矩形）：最常用，适配PC侧栏、APP信息流内嵌 -
728x90（横幅/Banner）：页眉通栏首选，比老式468x60更适配现代宽屏 -
160x600（竖幅/Skyscraper）：PC右栏固定位，注意移动端会自动隐藏或折叠 -
320x50（移动横幅）：iOS/Android APP底部常驻广告，必须用viewportmeta 控制缩放 -
300x600（大矩形/Megaboard）：高转化率位，但部分媒体要求预加载完成才触发展示
旧尺寸如468x60、234x60仍可运行，但Google AdSense已默认降权；120x60等小图标尺寸仅限特定广告平台（如某些电商导购站）内部使用，外部程序化购买基本不接受。
HTML中写广告尺寸时，width/height该用px还是rem
必须用px，且需与广告资源实际像素严格一致。原因很实际：
- 广告联盟返回的JS或iframe代码里，
document.write或postMessage通信依赖原始像素值校验，用rem会导致尺寸误判，触发“ad size mismatch”错误 - CSS媒体查询可以响应式控制是否显示某尺寸广告，但广告容器本身不能靠
max-width“撑开”——比如给728x90容器设width: 100%，在窄屏下会压缩图片导致模糊或裁切 - 唯一例外是H5广告包内嵌的
iframe，可用width="100%" height="auto"配合aspect-ratio: 728/90，但前提是广告方明确支持CSS宽高比
为什么<img>直接贴广告图经常出错
单纯用<img src="banner.jpg" style="max-width:90%" style="max-width:90%">看似简单，但实际埋了三个坑：
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
- 没加
loading="lazy"：首屏广告图会阻塞渲染，Lighthouse评分直接扣分 - 没设
decoding="async"：大尺寸GIF或WebP在低端安卓机上解码卡顿，用户看到白块而非动画 - 没处理
srcset：高清屏（dpr=2）下728x90图会模糊，应提供728x90@2x版本并用srcset切换
更稳妥的做法是用<picture></picture>包裹，或直接走广告平台提供的异步加载脚本——它们已内置设备探测、缓存策略和错误回退。
移动端适配时最容易忽略的meta和viewport设置
哪怕尺寸写对了，如果页面里缺这行，320x50广告在iPhone上也会被缩放成一团糊：
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
关键点只有两个：
-
width=device-width让CSS像素匹配设备独立像素（DIP），否则320px在iPhone 14 Pro上实际渲染为640物理像素，广告被拉伸 - 去掉
user-scalable=yes：广告区域禁止双指缩放，避免用户误操作导致广告容器变形
复杂点在于，有些老系统（Android 4.4 WebView）不识别initial-scale=1.0，得补一句<meta name="format-detection" content="telephone=no">防电话号码自动识别干扰布局。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
