在当今的数字世界中，在线广告已成为我们所有人喜爱的免费网络的重要组成部分。但是，如果广告植入不当，可能会导致浏览速度变慢、让用户感到沮丧并降低互动度。了解如何在不影响网页速度的情况下有效加载广告、确保提供顺畅的用户体验，以及为网站所有者带来尽可能多的创收机会。
网站高度依赖在线广告作为主要收入来源。不过，网站上展示广告有时可能会以牺牲用户体验和整体网页性能为代价。因此，在网站所有者、广告客户的创收、效果和用户体验之间取得平衡至关重要。
假设某个网站为了获得高收入而在其内容中大量投放广告。然而，广告数量过多，会让用户感到沮丧，从而导致用户体验不佳，跳出率较高。尽管广告有望带来可观的收入，但用户放弃操作会严重阻碍网站的成功。
另一方面，请考虑没有广告的网站。这种无广告环境因其快速的加载时间和顺畅的浏览体验而吸引了大量用户。然而，如果没有落实变现策略，该网站很难创收，这可能会妨碍其长期的可持续性和增长。
这两种情形都说明了平衡变现、用户和效果的重要性。
利用 Core Web Vitals
如要加载广告且不会对网页速度产生负面影响，测试测试必须具备核心网页指标。Core Web Vitals 由 Largest Contentful Paint (LCP)、Cumulative Layout Shift (CLS) 和 Interaction to Next Paint (INP) 等指标组成，是衡量网站用户体验质量的用户体验指标。
Largest Contentful Paint (LCP)
专注于优化 LCP 至关重要，因为此指标衡量的是最大内容元素在视口内显示所需的时间。通过最大限度地缩短广告内容的加载时间并优先采用异步加载技术，网站所有者可以减少 LCP 并缩短网页上最显眼的内容元素的呈现时间。
Interaction to Next Paint (INP)
其次，改进 INP 对于打造响应式用户体验至关重要。INP 衡量的是在网页生命周期内发生的每次点击、点按和键盘互动的延迟时间。最终值通常是用时最长的互动，代表网页对用户互动的快速响应的整体能力。
延迟用户互动的广告会对 INP 产生负面影响。这可能会让用户感觉迟钝，甚至在极端情况下甚至完全损坏，因而让用户感到沮丧。为广告实现延迟加载和延迟非关键 JavaScript 执行有助于减少网页的 INP，从而提高网页的整体响应速度。
Cumulative Layout Shift (CLS)
最后，CLS 通过衡量网页加载期间发生的意外布局偏移的数量来衡量网页的视觉稳定性。动态加载或调整大小的广告可能会导致布局不稳定，从而导致用户体验不佳，使用户无法跟踪自己在网页上的位置，甚至因意外的布局偏移而无意中点按了错误的元素。为缓解此问题，网站所有者应优化 CLS，确保广告预留空间以防止布局偏移，同时还应优化广告尺寸以避免突发的内容重排。
将网页分成不同的内容块
使用包含文字、图片和广告内容的内容块构建网页时，同时使用 CSS content-visibility: 属性可以显著缩短新型浏览器中的总体呈现时间。
通过有策略地在这些内容块中应用 content-visibility: 属性，您可以优化文字、图片和广告内容的呈现流程。这样可以确保只有视口中当前的内容才能完全呈现，从而加快初始网页加载速度，使用户互动更顺畅。在处理包含大量广告的冗长或页面时，这种效果增强尤其有用。
确定重要的广告位的优先级
并非所有广告位都相同。例如，就可见度和创收能力而言，首屏广告位通常比非首屏广告位更有价值。这是因为首屏广告更可能被用户看到，因为用户无需在第一个视口中滚动即可看到此类广告。用户向下滚动页面足够长的距离后，就能看到非首屏广告。
首屏广告
首屏广告位是指用户无需滚动即可看到的网页部分，在数字广告领域颇具价值。我们认为这些优质展示位置很有价值，原因如下：
- 用户加载网页时，会立即看到放在首屏的广告。用户更有可能注意到这些广告并与之互动，从而带来更高的点击率。
- 广告客户通常认为网页的顶部是最有价值的房地产信息。它是用户访问网站时获得的第一印象，因此成为展示高影响力和优质广告的重要区域。
- 首屏广告位于用户的直接视线范围内，因此可见率最高。这样可以确保访问相应网页的大多数用户无需向下滚动就能看到这些广告。
不过，在初始视图中使用首屏广告位时，一定要在变现和用户体验之间取得平衡。以下是一些重要注意事项。
- 第一个屏幕的广告位应在用户的初始视口中尽可能快地加载。加载速度缓慢的广告可能会对用户体验产生不利影响，并增加跳出率。优化广告加载时间对于保持流畅的用户体验和浏览体验至关重要。
- 虽然首屏广告展示位置很有价值，但切勿在这一黄金空间放置过多广告。过多的广告会让网页显得杂乱，破坏内容的可读性，还会对用户体验造成负面影响。您应努力在变现与维护简洁、人性化的布局之间取得平衡。
- 确保首屏广告位与不同的屏幕尺寸和设备兼容。自适应设计做法有助于保持一致且具有视觉吸引力的布局，无论用户屏幕大小如何。
非首屏广告
非首屏广告位（即放置在网页只有向下滚动后才能可见的广告部分）在数字广告领域也具有相当大的价值。这些展示位置具有独特的优势，可以补充首屏展示位置。
位于非首屏的广告可以在用户向下滚动浏览更多内容时受益。这些展示位置可吸引正在积极寻找额外信息的感兴趣用户的注意力，对于希望传达更复杂的信息或讲述内容的品牌而言，这类展示位置非常有价值。
- 最初不可见的广告位可以与旁边的内容对齐，从而有机会展示与内容相关的广告。这种一致性可以提高用户互动度，因为用户更容易发现与其正在浏览的内容相关的广告。
- 经过精心设计，非首屏广告可以与周围内容完美融合，对用户的干扰较小。这种集成（也称为原生广告）可以带来更和谐的用户体验。
- 需要滚动的广告展示位置在广告素材设计和格式方面更加灵活，以及充足的空间和自由度进行实验。您可以延迟加载视频广告、互动元素和较大的图片，从而在不中断用户体验的情况下吸引用户的注意力。
不过，对于非首屏广告展示位置，应考虑以下事项：
- 虽然非首屏广告展示位置可能效果出众，但一定要鼓励用户向下滚动页面。添加视觉提示或内容宣传语可以吸引用户进行深入探索，提高广告展示率。
- 将广告放置在非首屏位置不得影响内容的质量或可读性。平衡广告和内容，避免让用户应接不暇，并确保良好的用户体验。
- 与首屏广告展示位置不同，非首屏广告可能不需要立即加载。延迟加载这些广告，直到它们即将进入用户视口为止，有助于提高整体的网页加载速度，并缩短网页的初始呈现时间。
若有策略地使用，非首屏广告可以与首屏广告相辅相成，并为展示富有创意的广告格式和与情境相关的广告提供平台。然而，为了确保良好的用户体验，优化可见性、平衡内容和管理广告加载时间是关键考虑因素。
当前的 Google 发布商代码 (GPT) 最佳做法：
在适当情况下延迟加载广告
延迟加载是一种将非关键资源延迟到需要时再加载的技术。对无法立即显示的广告（即非首屏广告）应用延迟加载可确保这些广告仅在用户看到就加载时加载，从而节省带宽并提高整体网页速度。浏览器现在通过一个简单的 loading=lazy 属性为 iframe 提供了原生延迟加载。
通过实现延迟加载，系统会在广告即将进入用户视口时动态提取广告，从而减少在网页生命周期这个关键部分位于主线程上的初始加载时间和总阻塞时间 (TBT)（与 INP 高度相关），从而最大限度地减少对用户体验的负面影响。
刷新广告，但不刷新页面
另一种能够在网页性能与加载广告之间取得平衡的技巧，即每 30 到 240 秒刷新一次广告1，而无需重新加载整个网页。这种方法可以动态更新广告内容，而不会中断用户的浏览体验，也不会造成不必要的延迟。
在移动应用中，与重新加载整个页面或重新创建 WebView 相比，刷新现有网站视图中的广告可带来更好的效果，因为这样可以最大限度地减少数据和资源开销，从而加快内容更新速度，提供更顺畅的用户体验，而不会因从头开始而产生延迟。
通过异步刷新广告，网站所有者可以保持网页内容原封不动，同时就地实时无缝更新广告内容。这样不仅可以提高网页速度，让您不必重新加载整个网页，还可以确保展示的广告始终具有相关性和吸引力。通过这种方法，网站所有者可以在创收和效果之间取得平衡，及时提供引人入胜的广告内容，同时最大限度地减少对用户体验的负面影响。
对于用户往往停留更长时间的网页（例如食谱页、DIY 教程或其他内容丰富的网站），刷新广告位尤其有用。例如，用户在 DIY 手工页面上可能会花费大量时间跟随教程操作，在两个步骤间的休息间隙策略性地刷新广告位，或者在查看图库时有策略地刷新广告位，这样既能提升用户体验，又能提升广告收入。同样，在食谱页面上，在用户滚动浏览配料列表或说明后刷新广告位，也可以持续吸引用户。
优先考虑异步加载
在投放广告时提升网页速度的最有效策略之一是异步加载。异步加载与主网页内容分开加载广告，使网页可以继续呈现并具有互动性，而无需等待广告完全加载。 这可显著缩短感知加载时间，从而提升用户满意度。
在脚本标记定义中添加 async 属性。例如：
AdSense：
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
AdSense（自动广告）：
<script async data-ad-client="ca-pub-xxxxxxxxxxxxxxxx" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
Google 发布商代码：
<script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
优化广告尺寸、位置和格式
广告的尺寸、位置和格式会对网页速度产生重大影响。较大的广告尺寸会降低网页加载速度，导致用户感到沮丧。为缓解此问题，网站所有者应与广告客户密切合作，优化广告尺寸和格式。鼓励使用压缩图片格式和高效的广告素材设计有助于缩减文件大小，同时不影响视觉质量。这些优化不仅可以提高网页速度，还可以最大限度地减少带宽受限用户的数据消耗。
优质广告标准
请务必遵循优质广告标准来展示广告，因为这样做不仅可以减少侵扰性和干扰性广告格式，从而改善用户体验，还可以对广告投放位置和网页加载时间产生积极影响。
遵循这些标准后，广告更可能放置在干扰和干扰更小的位置，从而提高用户互动度和点击率。
此外，遵循这些指南还可以加快网页加载速度，因为更轻量且资源占用较少的广告格式更受欢迎，从而提高网站的整体性能和用户满意度。
对广告网络和提供商进行战略评估
并非所有广告网络和提供商在广告效果方面都一样。为了确保最佳的网页速度，网站所有者应仔细评估不同广告网络、标头出价实现和提供商的效果。
与重视速度优先且在高效投放精简广告内容的提供商建立合作伙伴关系，可以显著提升网页性能并改善用户体验。
总结
对于希望通过在线广告提供卓越用户体验、最大限度地提高收入的网站所有者来说，在创收和效果之间实现平衡至关重要。
通过使用异步加载、延迟加载、优化广告格式和尺寸、利用智能缓存、仔细评估广告网络以及标头出价和提供商等技术，网站所有者可以在不影响网页性能的情况下成功应对广告加载方面的挑战。优先确保高效分发广告最终可确保用户分层、提高互动度并持续创收。
脚注
- 广告服务器可能会有一些适用的限制和要求。例如，Ad Manager 要求发布商在界面中声明其具备刷新功能的广告资源。有些买方要求声明刷新时间大于或等于 240 秒。一般来说，刷新间隔越长，您的广告资源就越受买方欢迎。了解详情