2020 年峰会主题演讲：未来 Web 的性能和用户体验

在 WP Engine 的 2020 年峰会上，Google 产品经理 Mariya Moeva 讨论了网络的未来以及隐私、速度和培养优质用户体验在其中必须发挥的重要作用。 了解 AMP、Site Kit 和 Web Stories for WordPress 等工具，您可以使用它们来评估和提升 WordPress 网站的性能。

会议幻灯片

Google 产品经理 Mariya Moeva 讨论：

• Google 如何与 WordPress、WP Engine 和社区紧密合作以推进和支持 WordPress 生态系统。
• 分享有关 Google 帮助保持网络蓬勃发展和健康并使其在未来发挥作用的三种主要方式的见解：
  • 速度和性能：定义与用户体验相匹配的指标，并以可操作的方式与社区分享。
  • 出色的用户体验：确保网站所有者和最终用户在需要时在正确的上下文中获得来自各种 Google 产品的最相关信息。
  • 隐私和安全：在尊重用户隐私的同时设计支持生态系统的新模式。

这不仅仅是因为如果体验缓慢，用户会去其他地方，而且还因为用户的期望向上移动，因为他们在日常数字生活中使用令人愉悦的本机应用程序体验。

全文成绩单

[00:00:00.03]

大家好。 我叫 Maria，是 Google 搜索团队的一名产品经理。 我大部分时间都花在构建产品上，以帮助网站所有者在网络上取得成功。

[00:00:09.08]

因此，今天我非常高兴能与您分享 Google 认为保持网络健康和繁荣的重要性，以及我们正在为此做些什么，以及我们如何合作。

[00:00:21.03]

但为了向前看，让我们先环顾四周，我们现在在哪里？ 网络环境是什么样的？

[00:00:27.07]

CMS 平台对于网络的成功变得越来越重要。

[00:00:32.03]

我们看到使用 CMS 平台构建的网站的总体百分比稳步增长。

[00:00:37.08]

它们很重要，尤其是对于尾部和躯干业务，而且对于也使用 CMS 的大型网站也是如此。

[00:00:44.04]

我们在 Google 与一系列 CMS 平台密切合作，以保持

网络健康和私密。

[00:00:51.02]

当然，我们致力于与 WordPress 和社区密切合作，以推进和支持 WordPress 生态系统。

[00:00:59.04]

我们以多种方式做到这一点。 例如，通过为核心 WordPress 平台做出贡献来提高延迟加载图像等性能，或增加站点地图等内容的发现。

[00:01:12.03]

我们还构建插件，这些插件提供来自各种 Google 产品的重要功能，或者展示如何在您的 WordPress 网站上启用特定技术，例如 AMP。

[00:01:23.01]

我们将它们提供给 WordPress 插件目录中的每个人。

[00:01:26.09]

最后但同样重要的是，我们通过演讲和赞助各种活动来积极参与社区活动，例如欧洲、亚洲和美国的各种 WordCamps，以及当地较小城市和其他行业活动。

[00:01:41.06]

当它与 WP Engine 一起出现时，我们也确实拥有蓬勃发展的关系，它跨越了我刚才提到的 WordPress 的所有相同领域。

[00:01:51.01]

例如，WP Engine 的平台现在提供谷歌云平台的计算优化虚拟机，这使得服务器执行时间大幅下降。

[00:02:01.00]

例如，像 boardingarea.com 这样的网站迁移到这个新的基础架构后，backend_processing_times 立即下降，从而使网站性能提高了 40%。

[00:02:13.00]

WP 引擎解决方案中心提供 AMP 插件和 Site Kit 等关键插件，Genesis Framework 与 AMP 兼容，可帮助客户构建高性能和美观的网站。

[00:02:25.06]

最后但并非最不重要的一点是，我们在 WordCamp US 或今天在这里的 WP Engine 派对等重要活动中齐聚一堂。

[00:02:34.04]

除了 CMS 平台在网络上的重要性之外，我们不能忽视的一个因素是，由于 COVID-19 大流行，世界在短短几个月内在所有活动领域发生了翻天覆地的变化。

[00:02:46.09]

这也影响了网络。 一些网站的访问量和流量过载，而另一些网站则不得不暂时停止活动。

[00:02:57.07]

网络现在对增长至关重要，在某些情况下，它是许多企业生存的唯一机会。

[00:03:05.01]

让企业保持活力并帮助他们上网和在线发展是关键

在我们看来优先。

[00:03:12.08]

这对最终用户也很重要，因为许多重要的服务和信息由于大流行而转移到了网上。

[00:03:22.07]

了解所有这些后，让我们看看我们认为对于保持网络的繁荣和健康并使其在明天有用的真正重要的三个关键方向。

[00:03:32.08]

我们认为有三个关键领域。

[00:03:35.08]

确保网站速度快、性能高且可访问。

[00:03:39.09]

确保网站所有者和最终用户都能在网络上享受出色的用户体验。

[00:03:46.00]

然后还要确保我们维持一个繁荣的生态系统，同时我们承认最终用户的隐私和选择。

[00:03:53.04]

所以，我现在想做的是告诉您我们在 Google 正在为这些领域中的每一个领域做些什么，以及我们如何合作。

[00:04:01.01]

对于这三个重要领域中的每一个领域，我都想与您分享我们认为重要的内容以及我们正在采取的与生态系统中的合作伙伴合作的步骤，包括 CMS 平台、网站所有者和托管服务提供商。

[00:04:15.06]

在速度和性能方面，我们正在努力定义尽可能接近实际用户体验的指标，并以可操作的方式与社区分享。

[00:04:26.04]

为了获得出色的用户体验，我们努力确保网站所有者和最终用户都能在他们需要的时间和正确的上下文中获得来自各种 Google 产品的最相关信息。

[00:04:38.05]

最后但同样重要的是，为了隐私和安全，我们正在努力帮助设计一种支持生态系统同时尊重用户隐私的新模式。

[00:04:49.00]

那么，让我们从速度和性能开始。

[00:04:51.07]

针对这些因素进行优化可以让所有网络浏览器和服务的用户都更喜欢网络，并帮助网站朝着用户对移动设备的期望发展。

[00:05:02.00]

我们相信这将有助于网络上的商业成功，因为用户的参与度越来越高，并且可以以更少的摩擦完成他们需要的事情。

[00:05:12.01]

所以，我想我们都知道这一点，但值得重申的是，用户至上对当今的网络至关重要。

[00:05:18.08]

这不仅仅是因为如果体验缓慢，用户会去其他地方，而且还因为用户的期望向上移动，因为他们在日常数字生活中使用令人愉悦的本机应用程序体验。

[00:05:33.06]

这里只是两个统计数据，它们展示了相对较小的改进或延迟如何对用户体验产生重大影响并影响转化率。

[00:05:45.02]

我们专注于高质量体验的三个关键领域。 首先，快速加载。 所以你可以马上看到一些东西。 然后是响应迅速的交互，最后是一个流畅、令人愉悦的页面，不会移动或卡顿。

[00:06:00.09]

我们试图衡量这三个属性，我们很高兴向您介绍它们并获得您的反馈。

[00:06:06.03]

让我们来看看吧。 这些是新指标，核心网络生命力。

[00:06:12.03]

它是一组真实世界中以用户为中心的指标，用于限定用户体验的关键方面。 他们测量网络可用性的维度，例如低时间、交互性和内容加载时的稳定性。 这样您就不会不小心点击了您不想点击的那个按钮。

[00:06:30.06]

我们的目标是帮助网站所有者衡量和改善网络上的用户体验。

[00:06:35.03]

对于其中的大多数指标，我们同时提供现场和实验室数据，即基于用户如何在 Chrome 中体验此页面的汇总统计数据，以及基于我们在页面上运行的分析的数据。

[00:06:49.02]

因此，第一个指标是最大内容绘画。 这是我们较新的指标之一，用于衡量网页主要内容的加载速度和对用户可见的速度。

[00:07:01.08]

该指标是大量研究和指标开发的结合。 它的前身是速度指数和第一次有意义的绘画等指标。

[00:07:11.03]

LCP 旨在捕获最大的内容元素何时在浏览器的视口中可见。 服务器响应时间、CSS 阻塞时间和资产子资源加载时间等主要因素会影响 LCP。 它在实验室和现场数据集中均可用。

[00:07:32.02]

第二个指标是首次输入延迟，它是一个仅限字段的指标，因为它需要真实的用户交互。 它衡量的是浏览器第一次实际响应用户在页面上提供输入所花费的时间。

[00:07:47.00]

查看首次输入延迟非常重要，因为它可以指示用户对网站响应能力的第一印象。

[00:07:56.04]

改善此指标的解决方案包括预先加载 JavaScript、代码拆分等。

[00:08:03.06]

任何超过 300 毫秒的时间都会被用户视为糟糕的体验。 任何超过 100 毫秒的时间都是好的。

[00:08:14.01]

最后但同样重要的是，Cumulative Layout Shift 或 CLS。 在幻灯片上，您可以看到一个示例，说明当该指标不是特别好时会发生什么。

[00:08:24.03]

这会给用户带来很多挫败感。 它测量视口中的元素在加载期间移动的量。

[00:08:32.09]

CLS 正在尝试衡量一些事情，例如，以增加意外点击广告的机会的方式将广告添加到列表中，或者拥有一个新闻页面，其中故事照片在完全加载时将文本内容移到页面下方。

[00:08:47.08]

为了计算布局偏移分数，浏览器会查看视口大小和视口中不稳定元素在两个渲染帧之间的移动。

[00:08:57.04]

布局转换分数是该运动的两个测量值的乘积。 影响分数和距离分数。

[00:09:04.04]

换句话说，您正在测量实际移动了多少内容以及移动了多远。

[00:09:11.00]

为了提供良好的用户体验，站点应努力使累积布局偏移小于 0.1。

[00:09:18.09]

CLS 可以在现场和实验室中测量，类似于 Largest Contentful Paint。

[00:09:24.04]

然而，正如我之前提到的，对于简单的延迟，只是在现场。

[00:09:30.01]

我们正在使用我们所有不同的工具，以确保它们得到有效和一致的检测，以便您可以获得有关特定页面或网站在这些指标上的表现的信息，并与您的团队或与您的客户。

[00:09:46.05]

当然，当我们谈论性能时，要记住的一件事是，我们需要提及 AMP 框架。

[00:09:53.06]

这是一个 Web 组件框架，可轻松创建用户至上的网站、电子邮件和故事。 它已经解决了网络上的许多常见性能问题。

[00:10:03.05]

举几个例子，AMP 会自动处理诸如延迟加载非关键内容之类的事情。

[00:10:10.02]

因此，它会更快地加载可见内容，而页面其他地方的其他元素则在后台下载。

[00:10:17.05]

它让用户更好地了解网站的重要性。 它还优化了对您网站的跟踪。

[00:10:24.01]

借助 AMP 分析组件，您可以一次测量行为和与​​您网站的交互，然后将它们有效地传送到许多分析后端。

[00:10:35.02]

最后，它还使您能够像向 HTML 标记添加属性一样轻松地实现响应式设计。

[00:10:42.08]

因此，如果您关心性能，这是一个有趣的框架来调查它是否适合您当前的站点设置，并且它将解决您的许多性能问题。

[00:10:52.05]

我们今天关注的第二个关键领域是出色的用户体验。

[00:10:57.09]

使企业主和内容创作者能够采取正确的步骤，上网，扩大影响力，吸引更多访问者并将他们转变为客户。

[00:11:08.07]

当我们与企业主和内容创建者交谈时，我们一次又一次听到的是，他们发现很难从各种复杂的报告中推断出他们应该采取什么步骤，尤其是当他们需要从多个报告中提取信息时产品，以便全面了解他们网站上发生的事情。

[00:11:28.02]

他们需要专注于自己的业务，他们没有知识或时间也成为网络专家。 他们不应该这样做。

[00:11:36.05]

我们可以为他们提供关于如何改进和成长的直观、易于理解和可操作的建议。

[00:11:44.06]

我们利用这些反馈来定义我们构建产品时的指导原则。 例如，WordPress 的插件，如 Site Kit。

[00:11:52.08]

我们的目标是在用户需要的时间和地点准确地显示信息。 直接在他们的 WP 管理仪表板中，我们消除了复杂的报告并仅显示最相关的统计数据。 我们通过各种不同的 Google 产品来做到这一点。

[00:12:09.08]

无论指标来自分析、AdSense 还是页面速度洞察，我们都会将其显示在同一个易于使用的仪表板中，这样人们就可以在一个地方检查与其网站和 Google 相关的所有内容。

[00:12:24.01]

在实践中应用这些原则的一个很好的例子是 Site Kit。 那是谷歌的 WordPress 官方插件。

[00:12:30.05]

它将目前来自四种不同谷歌产品的统计数据结合到一个非常简单的仪表板上，直接在 WordPress 网站的管理仪表板上。

[00:12:40.09]

它一目了然地提供有关站点运行情况的信息。 让真正忙碌的网站所有者可以轻松地定期跟进。

[00:12:50.00]

提供正确见解和上下文的方法确实引起了 WordPress 网站所有者的共鸣。

[00:12:55.09]

自 2019 年 11 月推出以来，我们看到了非常强劲的有机采用，目前我们的活跃安装量超过 400,000，并且每天都在稳步增长。

[00:13:09.06]

那么，Site Kit 有何特别之处？ 它旨在改善网络旅程开始时的摩擦。

[00:13:16.06]

尤其是在初始设置期间，很多用户不知道如何编辑他们的网站、放置跟踪片段或标签以便从各种产品收集和访问重要数据。

[00:13:29.05]

在用户许可的情况下，Site Kit 可以代表他们处理这些问题，并在发送网站和连接正确的产品帐户的最初时刻消除瓶颈。

[00:13:42.04]

这是一个例子。 一旦连接了这些产品，Site Kit 如何在需要时直接在用户的仪表板中提供相关信息。

[00:13:51.08]

许多用户更喜欢主动共享信息，让他们知道什么时候发生了重要的事情，而不是不得不自己一次又一次地检查。

[00:14:01.03]

这也是将来自多种产品的信息组合成洞察力的机会。

[00:14:06.06]

比如，您最快的加载页面也是页面停留时间最长和访问收入最高的页面。

[00:14:13.01]

因此，这是来自 P 速度洞察力、口音和分析的三个统计数据，我们将它们放在一起是为了让用户了解正在发生的事情。

[00:14:23.00]

对于网站所有者和最终用户而言，卓越用户体验的另一个关键方面是了解人们追求什么内容以及如何有策略地创建内容以吸引更多访问者和用户。

[00:14:36.02]

我们在整个生态系统中观察到一些变化，即正在消费的内容类型和受欢迎的内容。 我想和大家分享一下我们正在做些什么来推动网络朝着这个方向前进。

[00:14:50.01]

你们中的大多数人可能已经熟悉故事。 它们是第一种移动原生内容格式。 近四分之三的智能手机用户在社交媒体上阅读或查看可点击的故事

媒体，至少每周一次。

[00:15:05.04]

64% 的用户更喜欢故事格式，超过 75% 的用户对阅读热门阅读内容类别中的可点击故事感兴趣。

[00:15:16.08]

我们相信故事格式的作用超越了短暂的用例，它可以成为媒体领域的支柱。

[00:15:25.03]

故事是可以在任何可以看到网页的地方看到的网页，但在 Google，我们会加倍努力让它们大放异彩。

[00:15:34.07]

因此，在选择查询时，例如，在纽约要做的事情。 我们将通过发布者故事触发这样的视觉块。

[00:15:44.01]

Discover 是另一个故事浮出水面的产品，它在 Android 和 iPhone 用户中都非常受欢迎，月活跃用户超过 8 亿，而这已经是两年前的事了。

[00:15:59.04]

对于那些经常使用 Discover 的用户，您可能已经在 Discover 中看到了这种外观非常独特的大型故事预览体验。

[00:16:08.06]

这些故事在提要中占据了相当多的空间，如果您点击其中一个，它会直接将您带到发布者的故事中。

[00:16:16.06]

这已经成为今天的生活，它为许多出版商提供了可观的流量。

[00:16:23.01]

我们希望帮助 WordPress 网站所有者更轻松地访问故事格式。 因此，我们为 WordPress 插件创建了一个重新设想的故事。

[00:16:33.01]

我们着手构建一个编辑器，使制作视觉上令人惊叹的故事变得简单而有趣。

[00:16:39.02]

它具有众多模板和许多功能，如屏蔽预设、将图像拖放到其他图像中、编辑字体、文本图像、形状和视频的广泛选项，所有这些都集成到一个非常简单和直观的 UI 中。

[00:16:54.04]

如果您希望在更好的版本发布时收到通知，您可以在这张幻灯片上的短链接上表达您的兴趣。

[00:17:01.08]

如果您想了解更多相关信息，您可以观看

我的同事 Paul Bakaus，他今天将讨论网络故事插件并进行预览。

[00:17:15.07]

最后但同样重要的是，我想简要概述一下我们对网络隐私的愿景，解释实现该愿景的途径，并讨论在该过程中共享反馈和协作的选项。

[00:17:29.07]

您可能已经看到有关 Chrome 计划终止支持第三方 cookie 的头条新闻。

[00:17:35.03]

但这一愿景比头条新闻所暗示的更广泛、更微妙。

[00:17:40.06]

这实际上是关于发展网络以更好地尊重用户隐私，同时确保它继续支持核心业务模型和用例，使网络对每个人都充满活力和健康。

[00:17:55.05]

网络社区需要做更多工作来支持用户隐私和选择。

[00:18:01.03]

这意味着，解决支持内容和广告相关性或欺诈预防等用例的相同技术也用于不需要的问题

在网络上进行跟踪。

[00:18:15.04]

我们主要谈论的是第三方 cookie 和秘密跟踪方法，例如指纹识别。

[00:18:21.05]

例如，虽然用户可以通过浏览器设置控制基于 cookie 的跟踪，但他们无法真正选择退出指纹识别，而且通常甚至无法知道它正在发生。

[00:18:31.07]

默认情况下，这些机制都不是私有的。

[00:18:36.02]

这就是为什么我们认为负责任的方法是用新的隐私保护解决方案取代传统做法。

[00:18:45.08]

将这项工作分为三个阶段。 首先，我们今天已经可以做一些事情来提高 cookie 的安全性和选择。

[00:18:55.01]

一个例子是新的 cookie 标签政策，称为 SameSite cookie，默认情况下使 cookie 成为第一方，从而提高安全性并减少秘密跟踪的机会。

[00:19:08.03]

它还确保通过安全连接访问第三方 cookie。 4 月，Chrome 临时回写了 SameSite cookie 更改，以确保稳定性并避免对网站造成任何干扰，从而在 COVID-19 危机期间提供必要的服务。 此推出最近刚刚恢复。

[00:19:29.07]

其次，我们支持开放和协作的努力，以开发新的网络隐私标准。 这就是隐私沙盒倡议。

[00:19:39.09]

这项工作包括创建新技术和支持关键用例而不识别跨站点用户，以及通过限制被动数据收集来减轻秘密跟踪的努力。

[00:19:55.00]

只有在这些新的隐私保护解决方案到位并满足生态系统的需求后，我们才会打算在 Chrome 中逐步停止对第三方 cookie 的支持。

[00:20:08.06]

因此，我们认为这三个领域对于继续努力和改进至关重要，以确保今天和明天的网络蓬勃发展。

[00:20:19.01]

我希望现在您能更好地理解为什么每个人都如此重要，以及每个人正在发生哪些重大变化。

[00:20:26.06]

不用说，这也取决于您，无论是为了确保您的客户或合作伙伴了解站点性能指标并从中受益，还是为了让您的团队或客户访问正确的统计数据和正确的上下文，或者也许为围绕新隐私标准的讨论做出贡献。

[00:20:47.03]

我们可以一起让最终用户和网站所有者等人的网络更安全、更快、更令人愉悦。 谢谢。