AMP 定义:什么是加速移动页面以及它如何运作?

无论您是发布商、电子商务公司、故事讲述者还是广告客户,AMP 都可以让您轻松打造出色的网络体验。您可以使用它为网站访问者提供以用户为中心的体验,这有助于提高 Google 排名和投资回报率。但首先,什么是 AMP?它对您有何影响?

内容
[展示]
什么是 AMP?
加速移动页面 (AMP) 是 Google 的一个项目,旨在制作速度极快的移动页面。它基本上是一种精简的 HTML,从根本上来说设计为超轻量级。

合适的号码资源帮助企业实现更好的客户覆盖和沟通影响力,通过WhatsApp平台,企业可以直接与潜在 哈萨克斯坦 WhatsApp 号码  客户建立联系,提高互动效率,促进业务增长。哈萨克斯坦WhatsApp号码数据库提供了扩大其在中亚市场的有效途径。

 

正式来说,AMP 是一个针对移动网页浏览进行优化的开源 HTML 框架,旨在帮助网页加载速度更快。它由 AMP 开源项目开发,谷歌将其创建为 Facebook Instant Articles 和 Apple News 的竞争对手。加速移动页面于 2016 年 2 月开始出现在谷歌移动搜索结果中。

AMP 页面可以由 CDN 缓存,例如 Microsoft Bing 或 Cloudflare 的 AMP 缓存,从而可以更快地提供页面。

回到目录 ↑AMP 对于网站的目标是什么?

加速移动页面旨在通过快速(有时几乎是即时)提供内容来改善用户体验。长期以来,Google 一直专注于页面加载时间;页面加载速度越快,在 Google 的 SERP 上的排名就越高。因此,AMP 可以大大提高页面速度,但也存在一些缺点。

AMP 页面的 3 个主要元素
AMP 页面由以下三个核心组件构建:

AMP HTML
AMP HTML 本质上是一种精简版 HTML,经过了一些调整以确保一致的性能。AMP HTML 中的大多数标签都是标准 HTML 标签,但有些标签被替换为 AMP 特定标签。这些自定义标签称为 AMP HTML 组件,它们使以高性能方式实现常见标签模式变得简单。HTML 标签允许搜索引擎和其他平台找到 AMP 页面。

AMP JS
AMP JavaScript 库可确保快速呈现 AMP HTML 页面。

呈现是一种网络开发过程,可将网站代码转换为用户访问网站时看到的交互式页面。

JS 库使用 AMP 的所有最佳性能实践,例如内联 CSS 和字体触发,来管理资源加载并提供自定义 HTML 标签以实现快速页面渲染。

AMP 缓存
Google AMP Cache(通常称为内容分发网络或 CDN)提供缓存的 AMP HTML 页面。CDN 负责抓取 AMP 内容并缓存,以便更快地进行分发。

AMP Cache 从同一个 HTTP 2.0 源加载文档、JS 文件和图片,以最大程度地提高效率。内部验证系统确保页面能够正常运行,并且不会依赖可能减慢其速度的外部因素。验证系统会检查页面的标记是否符合 AMP HTML 规范。

AMP 的三个核心组件协同工作,加快页面加载速度。以下是使 AMP 页面如此快速的七种优化技术。

回到目录 ↑Google 如何使用 AMP?

Google 使用 AMP 在移动设备上快速提供内容,而无需用户访问实际网站。如果您使用的是移动设备,则可以在此处查看 Google 搜索结果中的 AMP 示例。

具有有效 AMP 版本的页面将以轮播形式出现在给定主题的其余结果上方。

在该查询的新闻和常规结果上方,Google 的热门故事部分会显示相关新闻报道的 AMP 版本,因此创建 AMP 版本内容的发布商比没有创建 AMP 版本的发布商具有巨大优势。

哪些类型的网站需要 AMP?

AMP 最初专注于在线出版商的新闻报道,用户在移动搜索结果中看到的是 AMP 页面。其他类型的企业也可以从 AMP 的结果轮播和其他功能中受益。

在 WordPress 中设置 AMP
在 WordPress 中设置加速移动页面的第一步是安装 AMP 插件。在我们的分步指南中了解如何安装 WP 插件。
激活 AMP 后,转到外观> AMP 页面查看您的网站在移动设备上的显示效果。
在此页面上,您可以更改标题的背景和文本颜色。您为标题背景选择的任何颜色也将用于链接。如果您的主题允许,该插件还将使用您网站的图标或徽标。

保存更改。
您可以使用各种插件自定义 AMP 页面,添加相关文章、页脚小部件,甚至社交媒体图标。不过,安装任何附加插件后,您必须验证 AMP 页面。

回到目录 ↑如何查看网页的 AMP 版本

要查看网页的精简版 AMP 版本,请转到 URL 栏并在 URL 末尾添加 /amp/。

http://example.com/2022/10/blog-post/amp/

查看原始帖子的源代码时,您会在 HTML 中看到这行代码:

<link rel=”amphtml” href=”http://example.com/2022/10/blog-post/amp/” />

这行代码指示搜索引擎和其他使用 AMP 的应用/服务查找该页面的 AMP 版本。

AMP 网页故障排除
如果您在尝试查看 amp 版本时出现 404 错误,请按照以下说明操作。

转到 WordPress 管理员中的“设置”>“永久链接”,然后单击“保存更改”。您无需在此处编辑任何内容;只需单击“保存”按钮即可刷新您网站的永久链接结构。

如何在 Google Search Console 中查看 AMP 性能
通过 Google 搜索控制台,您可以轻松查看 AMP 在 Google 搜索中的表现。

登录您的 Google 搜索控制台帐户并选择“搜索外观”»“加速移动页面”。
Google 可能需要一些时间来索引并在 Search Console 中显示来自您的加速移动页面的数据,因此如果您没有看到任何内容,请不要担心。

获取 AMP 网页的准确分析

全局网站标签管理器允许您在 AMP 页面上安装 Google Analytics、Google Ads 和相关产品。标签管理器安装会设置一个 AMP 容器,并使您能够从标签管理器界面创建高级配置和部署第三方标签。AMP 的一个缺点是它可能会扭曲您的 Google Analytics 数据。访问您 AMP 页面的访问者无法准确跟踪,并且可能会被重复计算。

AMP 的优点和缺点是什么?
AMP 优点:

缩短网站加载时间:AMP 通过删除非必要元素来加快内容交付速度。这一点至关重要,因为世界上越来越多的人口完全依赖移动设备访问互联网。
提高搜索排名:虽然 AMP 从来都不是影响搜索排名的因素,但速度却是。这意味着让您的网页加载速度更快可以帮助您在 Google 上获得更高的排名。
在 WordPress 上设置很简单:AMP 在 WordPress 网站上设置也很简单。
AMP 缺点:

在 WordPress 之外实施可能会很困难。您需要编码经验和开发人员的帮助才能创建 AMP 页面。
广告收入较低:AMP 页面的广告较少,这对于速度来说很好,但如果广告是您的主要收入来源,那么就不太好了。
分析功能有限:由于页面托管在 Google 服务器上,因此您无法在 AMP 页面上使用标准分析标签。这导致您很难看到所做的更改对流量的影响。
对内容和设计的控制较少:虽然 AMP 删除了许多“不必要的”元素,但其中可能包括品牌和流量驱动功能。
限制潜在客户捕获:AMP 还删除了潜在客户捕获表单和可下载资产,从而降低了网站收集潜在客户的能力。
限制社交分享:由于大多数社交分享按钮都是用 JS 构建的,因此它们甚至可能无法正确显示。
回到目录 ↑

AMP 对于核心网络生命力意味着什么?

尽管 AMP 页面看起来是一个单独的类别,但它们也和其他页面一样遵循相同的搜索排名标准。不过,由于其构建方式,它们的表现可能比常规页面更好。

AMP 页面更稳定,内容加载速度更快,并且无需处理 JavaScript,因为它们使用有限的 CSS、不使用第三方 JavaScript、预定义图像和最少嵌入。虽然 AMP 本身不是排名因素,但它可以帮助您达到核心网页指标推荐的性能目标。

让我们看看如何构建 AMP 来满足每个核心 Web 重要性能要求。

回到目录 ↑
首次输入延迟 (FID)
AMP 默认仅支持异步 JavaScript。因此,当页面加载时,浏览器的主线程不会被缓慢、繁重的操作所占用,从而阻止用户与网站交互。响应时间通常少于 100 毫秒,远低于首次输入延迟的“良好”阈值。

分块进程

长任务会延迟用户交互,因为页面在这些任务完成之前会被锁定。AMP 使用进程分块将长任务拆分  英国华人资料 为小版本,以分解这些长任务(超过 150 毫秒)。由于小任务太多,如果加载被用户输入中断,浏览器可以立即执行新任务,而不是等待长任务完成。这就是 AMP 页面对任何交互响应如此之快的原因。

沙盒小工具
代码繁重的小部件不会阻止用户与页面交互,因为 AMP 在单独的容器中运行外部代码。

延迟布局
核心网页指标通常用于评估首次浏览时间。因此,为了节省时间,AMP 使用延迟布局来延迟渲染页面下方不必要的元素。

回到目录 ↑
累积布局偏移 (CLS)
页面上任何可能导致布局重新加载或移动的元素都必须由用户交互触发。由于 CLS 是在用户与页面交互之前测量的,因此您不应该在用户与页面交互或点击某些内容时显示小部件。

AMP 可确保布局稳定,因为框架会在下载资源之前推断其大小。具有指定高度和宽度的内置组件用于加载图片、视频和 iframe。

AMP 在页面首次加载时会识别容器的高度和宽度,并在下载实际元素之前预留适当的尺寸。提前设置它们可防止未指定尺寸的元素移动其他元素。

回到目录 ↑最大的内容涂料 (LCP)

AMP 页面采用最少的 JavaScript 和 CSS 设计,可快速加载内容。此外,系统会优先考虑用户最先看到的内容,因此只有位于首屏的图片和广告才会被下载。

通过优先考虑用户首先看到的内容来限制页面加载期间获取的资源,使得页面加载速度更快。

Google Cache 还会预加载和预渲染 AMP 页面。例如,当用户访问预渲染的页面时,浏览器已经下载了内容,这似乎是即时完成的。

结论
虽然使用 AMP 是提  WS号码   高核心网页指标得分的可靠方法,但有几个因素可能会阻碍页面满足要求。服务器响应时间慢、图像未优化以及文件过大都会降低任何页面的速度。此外,您无法为每个页面提供 AMP 版本:菜单和主页。

如果你有一个包含 Medium、Patreon 等文章的博客,那么你需要使用 AMP 作为主题。如果你有设计师作品集,那么它几乎没有帮助。在包含大量视频内容的页面上使用 AMP 时,你还需要小心。

滚动至顶部