在当今的数字世界中，在线广告已成为我们所有人享受的免费网络的重要组成部分。然而，广告植入不合理可能会导致浏览体验变慢，导致用户感到沮丧并降低互动度。了解如何在不影响网页速度的情况下有效加载广告、确保提供顺畅的用户体验，以及尽可能增加网站所有者的创收机会。
网站主要依赖在线广告作为主要收入来源。不过，在网站上展示广告有时可能会降低用户体验和网页整体效果。因此，一定要在网站所有者和广告客户的获利和效果以及用户体验之间取得平衡。
假设某个网站为了获得高收入而在其内容中大量投放广告。然而，广告数量过多会使用户感到沮丧，从而导致糟糕的用户体验和高跳出率。尽管广告有可能带来可观的收益，但放弃已严重阻碍了网站的成功。
另一方面，假设网站没有广告。这种无广告打扰的环境因其加载速度快、浏览体验流畅，吸引了大量用户。然而，如果没有制定变现策略，网站难以实现创收，这可能会阻碍其长期可持续性和增长。
这两种场景都说明了平衡变现、用户和效果的重要性。
利用 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 与 INP 高度相关），从而最大限度地减少对用户体验的影响。
刷新广告而不刷新网页
另一种可以在网页性能与加载广告之间取得平衡的方法是，能够每 30 到 240 秒刷新一次广告1，而无需重新加载整个页面。这种方法可以动态更新广告内容，而不会干扰用户的浏览体验，也不会造成不必要的延迟。
在移动应用上，与重新加载整个页面或重新创建 WebView 相比，刷新现有 Web 视图中的广告可实现更好的效果，因为这样可以最大限度地减少数据和资源开销，从而加快内容更新速度并实现更顺畅的用户体验，而不会因从头开始而产生的延迟。
通过异步刷新广告，网站所有者可以保持网页内容不变，同时原地实时无缝更新广告内容。这样不仅可以加快网页加载速度，让您无需重新加载整个网页，还可以确保所展示广告的相关性和吸引力。通过这种技术，网站所有者可以在获利与效果之间取得平衡，及时提供引人入胜的广告内容，同时将对用户体验的负面影响降到最低。
在用户往往会停留更长时间的网页（例如食谱网页、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 秒。一般情况下，刷新间隔越长，您的广告资源就越受买方青睐。了解详情