什么是AMP？ 您的终极指南

在一个分秒必争的世界中，网页加载速度在创造积极的用户体验方面起着至关重要的作用。

随着越来越多的用户转向移动浏览，对更快、无缝在线体验的需求持续增长。

为了满足这一需求，Google 率先推出了一个名为 Accelerated Mobile Pages (AMP) 的开源项目，主要旨在增强移动 Google 搜索体验并提高 Web 性能。

让我们在本文中深入了解此 AMP 的详细信息。

什么是加速移动页面 (AMP)？

AMP 是一个开源 HTML 框架，致力于创建快速加载、针对移动设备优化的网页。 从本质上讲，AMP 页面是常规网页的精简版本，可以快速提供内容而不影响用户参与度。 Google 于 2016 年首次推出 AMP 页面，最初仅限于搜索引擎结果页面 (SERP) 顶部的“热门故事”部分。

AMP核心组件

AMP 框架基于三个基本组件构建：AMP HTML、AMP JavaScript (JS) 和 AMP 缓存。 AMP HTML是专为提高速度而设计的 HTML 变体， AMP JS是用于移动页面的高效 JavaScript 库，而AMP Cache是一种内容分发网络 (CDN)，可实现更快的页面获取和加载。

AMP HTML

AMP HTML 是 HTML 的子集，它结合了对标准 HTML 的一些修改和限制，以确保快速页面加载。 某些降低网页速度的元素和属性将被删除或更改，从而有助于改善移动浏览体验。 因此，AMP 文档必须遵守特定的结构准则，以保持其以速度为导向的设计。

AMP JavaScript (JS)

AMP JS提供了一个高效框架和组件库，可加快页面构建速度，而无需额外的 JS 或第三方库，从而提高了 AMP 页面的速度。 过多的 JavaScript 可能会导致页面无响应且速度缓慢，而 AMP 的 JavaScript 可以快速构建和维护页面速度。

AMP 缓存

就页面加载时间而言，AMP Cache 改变​​了游戏规则。 它是一个基于代理的 CDN，甚至可以在用户请求 AMP 页面之前对其进行预获取和预呈现。 AMP Cache 主要有两个提供者：

• Google AMP 缓存：使用 AMP 格式时存储您的页面。
• Bing AMP Cache：与Google类似，Bing也支持AMP缓存功能。

AMP 如何提高 Web 性能？

通过优先考虑 JavaScript 的异步执行、资源的静态大小调整、扩展机制、字体触发、样式重新计算和动画触发，AMP 显着优化了 Web 性能。 这种勤奋的策略确保了快速、无缝的移动浏览体验，鼓励用户更多地参与网站并消费更多内容。

JavaScript 的异步执行

AMP 采用 JavaScript 的异步执行来防止任何元素阻碍页面渲染。 所有自定义 JavaScript（指定为 AMP 组件）旨在确保零性能下降。 这样，脚本就不会阻止或延迟页面渲染，从而提供更快、更有效的性能。

静态资源大小调整

AMP HTML 的独特功能之一是要求所有资源具有明确的尺寸。 通过在加载资源之前计算每个元素的大小和位置，AMP 可以呈现快速的页面布局。

扩展机制和渲染

借助 AMP 高效的扩展机制，即使额外的 HTTP 请求也不会阻塞页面渲染。 此功能增强了网页的整体渲染速度和性能。 允许动态内容，AMP 通过指示用于可预测加载的自定义标记来实现这些扩展，而不会影响速度。

高效的字体触发和样式重新计算

AMP 的强大功能之一在于其高效的字体触发机制。 通过优先使用零 HTTP 请求进行字体下载，可以加快渲染过程。 另外，AMP 还可以最大限度地减少样式重新计算。 它通过确保在 DOM 写入之前执行所有文档对象模型 (DOM) 读取来实现此目的，从而减少每帧的耗时样式重新计算。

使用 AMP 的优点

在移动网页上实施 AMP 的主要好处包括：

• 快速加载： AMP 优化页面以几乎立即加载，从而提高用户参与度。
• 简单的构建过程：构建 AMP 页面非常简单，即使是非技术用户也可以轻松访问。
• 移动用户体验： AMP 采用移动优先的方法设计，可增强移动用户体验。
• 平台支持：包括 Google 和 Bing 在内的主要平台都支持 AMP 格式，扩大了覆盖范围。
• 增强的 SEO：快速加载 AMP 页面可以提高搜索引擎排名，从而为网站带来更多流量。

AMP 的限制和限制

虽然 AMP 具有许多优势，但了解其局限性也很重要：

• 设计限制： AMP 实施了某些设计限制以保持其速度，这可能会限制其视觉吸引力。
• JavaScript 限制： AMP 页面上不允许自定义 JavaScript。
• 有限的广告标签： AMP 页面每页仅允许一个广告标签，这可能会限制广告的覆盖范围。
• 有限的分析跟踪：缺乏对第三方 JavaScript 的支持可能会影响某些分析跟踪能力。

如何实施AMP？

实施 AMP 涉及创建和验证 AMP 页面以及监控其性能。 它需要遵守特定的 HTML 和 JavaScript 准则，并利用 AMP 缓存来加快加载时间。

创建和验证 AMP 页面

创建和验证 AMP 页面可确保它们满足最佳性能所需的标准。 AMP 页面是使用 HTML 创建的，带有用于图像、视频和 iframe 等各种功能的特定标签。

您必须确保 AMP 页面经过验证，以确认其符合 AMP 项目指南。 验证对于识别和纠正任何错误至关重要，确保页面在移动设备上无缝加载，从而有助于改善用户体验。

实施结构化数据还可以增强 AMP 内容在搜索引擎结果中的外观。

移动搜索结果有利于 AMP 优化的页面，提高可见性并有可能提高搜索排名。 在您的网络内容中采用 AMP 可以显着影响移动搜索结果和用户体验。

监控和提高 AMP 性能

监控和改进 AMP 性能需要利用先进技术来增强用户体验。

分析平均加载时间和资源加载至关重要，因为它直接影响移动搜索结果和搜索排名。

实施网络字体优化和良好的 CSS 卫生有助于加快页面加载时间，对整体移动体验产生积极影响。

此外，优化 AMP 缓存的功能和最小化 HTTP 请求对于提高性能至关重要。 通过确保高效的资源加载和实施响应式设计，移动网站可以实现高水平的用户体验，符合 Google 的移动搜索结果标准。

此外，定期监控分析可以深入了解 AMP 页面的性能，从而促进功能和速度的持续改进。

结论

对于移动优先时代的企业来说，AMP 提供了增强用户体验和提高 Web 性能的重要工具。

通过在移动网页上实施 AMP，您不仅可以为用户提供更快、更无缝的浏览器体验，还可以利用它在 SEO 和多平台支持方面提供的优势。 然而，与任何平台一样，它也面临着一系列挑战。 尽管如此，通过仔细的规划和实施，AMP 的好处远远大于其缺点。