你需要了解的关于 Google AMP 和 SEO 的一切


Google 于 2015 年首次推出 AMP(加速移动页面)。借助开源 AMP 框架,网页设计师可以创建加载速度快的移动页面。该框架的创建是为了应对越来越多的人使用移动设备访问互联网的趋势。从那时起,Google 一直大力推广使用 AMP 来提升 SEO 和移动设备上的用户体验。在这篇文章中,我们将更详细地了解 AMP,并讨论它如何影响 SEO。

什么是 Google AMP?

如前所述,AMP 是一个开源框架,允许开发者创建加载速度快的移动页面。AMP 使用精简版的 HTML、CSS 和 JavaScript 来大幅减少页面加载时间。AMP 还将页面缓存到 Google 的服务器上,使用户点击页面时几乎可以立即加载。使用 AMP 的页面会显示在移动设备搜索结果顶部的轮播图中,使其更容易被用户看到。

为什么 Google 大力推广 AMP?

Google 推广 AMP 的原因有很多。首先,AMP 改善了移动设备上的用户体验。使用 AMP 的页面加载速度更快,使用户更容易快速访问所需内容。更快的加载时间还可以降低跳出率,这是 Google 的一个重要排名因素。其次,Google 将 AMP 看作是让用户留在网络上而不是在应用内的一种方式。最后,Google 希望通过提供卓越的移动体验来保持其竞争优势。

Explore our latest online courses and learn new skills at your own pace. Enroll and become a certified expert to boost your career.

AMP 如何影响 SEO?

AMP 对 SEO 有重大影响。使用 AMP 的页面会受到 Google 的优先对待。启用 AMP 的页面更有可能在移动设备搜索结果中排名第一。如前所述,AMP 页面会显示在搜索结果顶部的轮播图中。出现在轮播图中的页面比没有出现在轮播图中的页面获得更多点击。

AMP 对 SEO 的影响不仅限于移动设备。Google 已表示,AMP 也是台式机搜索结果的排名因素。

如何在你的网站上实现 AMP

在你的网站上实现 AMP 非常简单。第一步是创建你页面的 AMP 版本。你可以手动创建 AMP 版本,也可以使用插件或扩展程序来自动创建 AMP 版本。

创建页面 AMP 版本后,你需要添加一些代码来告诉 Google 在哪里可以找到 AMP 版本。你可以通过在 HTML 代码的 head 部分添加 rel="amphtml" 标签来实现此目的。此标签告诉 Google 在哪里可以找到你页面的 AMP 版本。

为确保你的 AMP 页面符合 AMP 规范,你必须对其进行验证。你可以使用 Google 提供的 AMP 验证器工具来验证你的 AMP 页面。AMP 验证器会检查你的页面是否存在错误,并提供修复方法的建议。

AMP 最佳实践

在你的网站上实施加速移动页面 (AMP) 时,你应该遵循一些最佳实践,以确保你的页面性能良好并提供良好的用户体验。以下是一些主要的 AMP 最佳实践:

  • 使用 AMP 缓存 - AMP 缓存是一个内容分发网络,它将你的 AMP 页面缓存到 Google 的服务器上。使用 AMP 缓存可以显著提高 AMP 页面的性能。当用户点击指向你的 AMP 页面的链接时,AMP 缓存会从缓存中提供页面,从而加快加载过程。为了使用 AMP 缓存,必须在 HTML 代码的 head 部分包含以下代码:

<link rel="canonical" href="https://www.example.com/amp/page.html">
<link rel="amphtml" href="https://www.example.com/amp/page.html">

第一行代码告诉 Google 你页面的 AMP 版本是规范的,第二行代码告诉 Google 在哪里可以找到你页面的 AMP 版本。

  • 优化图片 - 图片可能是页面加载时间的重要来源。确保优化图片的大小和格式。使用图片压缩工具来减小图片的文件大小,而不会牺牲质量。为每张图片使用正确的图片格式。例如,对照片使用 JPEG,对具有透明度的图片使用 PNG。

  • 使用 AMP Analytics - Google 提供 AMP Analytics,这是一项允许你监控 AMP 网站上用户活动的服務。使用 AMP Analytics 可以帮助你找出需要改进的地方,并优化页面以获得更好的性能。为了使用 AMP Analytics,必须在 HTML 代码的 head 部分包含以下代码:

<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

你还需要在 HTML 代码的 body 部分添加以下代码:

<amp-analytics type="googleanalytics" id="analytics1">
<script type="application/json"> 
{
   "vars": {
      "account": "UA-XXXXXX-Y"
   },
   "triggers": {
      "trackPageview": {
         "on": "visible",
         "request": "pageview"
      }
   }
}
</script>
</amp-analytics>

将 "UA-XXXXXX-Y" 替换为你 Google Analytics 的跟踪 ID。

  • 避免外部资源 - 外部资源(如 JavaScript 和 CSS 文件)可能会减慢 AMP 页面的速度。尽可能避免在 AMP 页面上使用外部资源。而是使用 AMP 组件库,它提供你可以用来构建页面的预构建组件。如果你需要外部资源,请使用异步加载来减少对页面加载时间的影响。

  • 使用结构化数据 - 使用结构化数据可以提高页面在搜索结果中的可见性。AMP 页面支持结构化数据,因此请将其包含在你的页面中。使用结构化数据标记的 AMP 版本以确保与 AMP 的兼容性。你可以使用 Google 提供的结构化数据测试工具来测试你的结构化数据。

  • 测试你的页面 - 在发布 AMP 页面之前,请彻底测试它们。使用 AMP 验证器和移动友好性测试等工具来确保你的页面符合 AMP 规范并提供良好的用户体验。AMP 验证器会检查你的页面是否存在错误,并提供修复方法的建议。移动友好性测试会检查你的页面是否适合移动设备,并提供改进建议。

通过遵循这些 AMP 最佳实践,你可以确保你的页面提供快速加载、用户友好的体验,并针对移动设备进行了优化。这可以帮助提高你网站的搜索引擎排名并提高用户参与度。

  • 使用正确的 HTML 语法 - 创建 AMP 页面时,请确保使用正确的 HTML 语法。AMP 页面需要严格的 HTML 语法,因此错误会导致页面验证失败。使用 AMP HTML 样板代码以确保你的页面使用正确的语法。

  • 使用 AMP 组件 - AMP 组件是预构建的 HTML 和 JavaScript 模块,它们为你的 AMP 页面提供了许多功能。这些组件针对 AMP 进行了优化,因此它们很轻量级,不会导致页面速度出现任何问题。一些流行的 AMP 组件包括 amp-img、amp-carousel 和 amp-video 组件。

  • 使用内联 CSS - 内联 CSS 可以帮助减少 AMP 页面上加载的外部资源数量。你可以通过直接在 HTML 文档中包含 CSS 代码来避免需要外部 CSS 文件。但是,请尽可能保持 CSS 代码的简洁,以避免任何潜在的性能问题。

  • 使用正确的广告格式 - 如果你计划使用广告来获利你的 AMP 页面,请使用与 AMP 兼容的广告格式。Google AdSense 是 AMP 网站最受欢迎的广告网络之一,因为它提供各种适合 AMP 的广告类型。

请遵循 AMP 广告指南,以确保你的广告不会对用户体验产生负面影响。

结论

总而言之,AMP 是一个强大的工具,可以提高移动页面的性能并提升你的 SEO。通过遵循 AMP 的最佳实践,你可以确保你的页面提供快速、用户友好的体验,并针对移动设备进行了优化。AMP 可以帮助提高你网站在搜索结果中的可见性并提高用户参与度。如果你还没有,请考虑在你的网站上实现 AMP。

更新于:2023年3月30日

151 次浏览

开启你的职业生涯

完成课程获得认证

开始
广告