AMP 详细指南 - Google 的加速移动页面
已发表: 2018-05-21AMP是如何工作的? 如何创建和自定义加速移动页面? 网站所有者可以在流行的 CMS 上使用哪些工具,包括 WordPress、Joomla!、Drupal、OpenCart? 站长在实施 AMP 时会面临哪些陷阱以及如何解决问题?
在以下手册中检查这些和其他问题的答案!
内容
什么是 AMP 及其工作原理
AMP 代表加速移动页面。 该术语是指为移动用户显示网站页面的技术,可提供最大的网站加载速度。
AMP 是传统网页的根本截断版本。 在加速页面上仍然是主要内容。 大多数辅助元素,包括小部件、评论表单、推荐内容块、传统广告在加速页面上都没有。
Accelerated Mobile Pages 是一个由 Google 领导的开源平台和项目负责人。 因此,任何人都可以免费使用该倡议。
该项目的思想启蒙者和代言人是谷歌。 世界上最大的搜索引擎使用 AMP 页面将其显示在搜索结果页面 (SERP) 上。 此外,谷歌缓存加速的移动友好页面并充当它的 CDN。 因此,移动用户即使在低速数据连接下也能快速下载 AMP 内容。
这张图表和解释来自 Will Critchlow 的周五白板,简化了这个过程:
加速页面由带有特殊标签的 HTML 标记和专用的 JavaScript 库组成。
- AMP 强制您使用精简版的 CSS;
- 根本不允许使用 Javascript;
- 您被迫使用 AMP 为您提供的现成 Javascript 库——这会强制您的图像延迟加载。
在 AMP 页面上,您可以使用一组有限的标签和脚本。 这会降低页面的功能和外部吸引力,但会显着提高加载速度。 此外,谷歌的预缓存技术减少了页面加载时间。
网络冲浪者可以以两种完全不同的方式使用 AMP。 第一个涉及将数据从站点所有者的服务器传输到访问者的计算机,并在浏览器中显示页面的加速版本。 例如,在启用 AMP 的网站上,您可以设置将所有移动用户自动重定向到加速页面。 访问者可以通过移动设备访问 AMP 或在浏览器地址栏中的 URL 中添加后缀“/amp”。
第二种方法涉及从 Google 服务器查看 AMP 的缓存版本。
世界上最大的搜索引擎在 SERP 中以轮播格式显示指向加速页面的链接,或使用 AMP 徽标图标标记 AMP 内容。
在查看页面时,用户并没有访问该站点,而是从发布者的页面浏览相同的内容。
不幸的是,谷歌认为没有必要在为这些设备生成的问题页面上显示 AMP 轮播。 因此,感谢 Search Engine Land 的一个例子。
是否值得使用 Accelerated Mobile Pages?
要回答这个问题,您需要注意实施 AMP 的优点、缺点和结果。
AMP的优势
AMP 的主要优势是显着的加载速度优化。 该表显示了通过几个流行的指标服务测试页面的基本和加速 AMP 版本的结果。
服务/页面 | 基本的 | 安培 |
来自 Google 的 PageSpeed 见解 | 移动端 62 分,台式机 77 分。 | 移动设备 88 分,台式机 94 分。 |
Pingdom的加载速度 | 加载时间为 5.94 秒, 页面大小为 3.5 MB。 | 加载时间为 2.46 秒, 页面大小为 381.4 KB。 |
GTmetrix 加载速度测试 | 加载速度为18.6秒, 页面大小为 3.49 MB。 | 加载时间为 3.4 秒, 页面大小为 314 KB。 |
低加载速度会对用户体验产生负面影响。 超过一半的访问者等待内容显示的时间不超过 3 秒。 加速页面的加载速度比标准页面快得多。
这是可能的,因为使用 AMP 技术传输的数据量显着减少。
此外,如果一个在线购物网站每天赚取 100,000 美元,那么 1 秒的页面延迟可能会导致您每年损失 250 万美元的销售额。
快速加载对于移动设备用户来说至关重要。 这就是为什么谷歌会预先缓存 AMP 并为使用慢速互联网的人提供 CDN。
网站的加载速度和用户体验是谷歌排名的主要因素之一。 Accelerated Mobile Pages 本身是否在 Google 排名中提供了额外的优势?
2016 年年中,在芝加哥举行的 Google 搜索引擎期刊峰会上,Google 发言人 Harry Illes 表示,Accelerated Mobile Pages 不在排名因素之列。 但谷歌代表无法明确表示 AMP 不会成为未来的排名因素。
这是什么意思? AMP 技术本身并不能为网站带来排名优势。 尽管如此,它显着提高了网站的加载速度,Rankbrain 分析了谷歌排名算法的行为因素。
新闻网站和内容项目在进入 AMP 轮播时受益于 AMP 实施。 此元素显示在搜索结果上方的 SERP 顶部。 这为发布商提供了额外的点击次数,并间接提高了搜索引擎和 SEO 的排名。
因此,加速页面的主要优点是加载速度快。 它改善了用户体验,并可以间接影响网站在 Google SERP 中的位置。 此外,由于 AMP 轮播,资源可以获得额外的视图。
加速移动页面的缺点
AMP 几乎没有缺点。 以下是主要内容:
- AMP 页面的访问者无法通过网站主版本上的标准 Google Analytics 代码进行跟踪。 要跟踪 AMP 视图和访问者,您需要向 AMP 页面添加专用跟踪代码。 您可以使用 Glue for Yoast SEO & AMP 插件轻松完成此操作。
- 与基本页面相比,加速页面的功能有所减少。 所有经典模块,如导航菜单、相关帖子块、侧边栏、评论表单都必须手动或通过插件添加。
- 为了高加载速度,你牺牲了网站的视觉效果。
- 如果谷歌在轮播中显示网站的加速页面,用户可以在不离开 SERP 的情况下阅读它们。
为了高速加载,您必须为页面的功能和外观付出代价。 值得注意的是,大部分缺点都可以完全或部分消除。 但是,AMP 将始终是网站基本页面的简化版本。
AMP 实施结果
Google 可以快速识别网站上的 AMP。 在网站上推出 AMP 后的几天内,有关已编入索引的 AMP 页面的信息会显示在 Search Console“搜索外观 >> 加速移动页面”部分中。
几乎在编入索引后,Google 会将流量发送到您网站的 AMP 版本。 截至 2018 年 5 月末,大约 50% 的访问者从 Google 直接访问加速版页面而不是基本版。 以下是一些有趣的统计数据:
- 从 5 月 20 日到 26 日的一周内,有 1812 名访问者从 Google 来到考场。
- 1812 人中有 1011 人是移动用户。
- 来自 Google 的 842 名用户登陆了加速移动页面。
使用特定资源的示例而不声称具有代表性,很明显 Google 愿意将访问者发送到 AMP 页面。 在搜索引擎的加速页面上出现了 46% 的用户总数或 83% 的移动用户。 其余 17% 的智能手机和平板电脑用户使用自适应布局进入基本页面。
以下是您应该注意的数据:
- Accelerated Mobile Pages 的跳出率明显高于标准页面。 根据谷歌分析,它在常规页面上达到 86%,而在常规页面上达到 55%。 这可能是由于 Google Analytics 服务对加速页面性能的错误跟踪所致。 当用户从 AMP 移动到基本页面时,监控系统会计算一次新访问。 在这种情况下,加速页面的跳出率会增加,会话深度会降低。
- AMP 访问者的每次会话页数比率低于自适应页面或常规页面的访问者。 与常规页面的访问者相比,用户使用相关帖子的一部分移动到网站的其他页面的可能性要小得多。
实施 AMP 后,来自 Google 的流量略有增加。 搜索流量适度增长的动力依然存在。
为了评估使用 AMP 的结果,仅使用一种来自 Google 的平均每天大约 150 名独立访问者的资源是不够的。 因此,值得参考别人的经验。 以下是一些有趣的数据:
根据研究结果,谷歌表示与基本页面相比,AMP 上的上下文广告效率更高。 显示在屏幕可见部分的 AdSense 块增加了 80%,广告块的 CTR 增加了 90%。
来自 Search Engine Watch 的好奇数据。 得益于 AMP,Wired Magazine 的搜索结果中的 CTR 链接增加了 25%。 加速页面上的广告点击率增长了 63%。 实施 AMP 后,Slate 杂志网站的月访问量增长了 44%。
CNN 的代表在接受《华尔街日报》采访时表示,AMP 和基本页面在广告的帮助下同样有效地货币化。
AMP 的加载速度比基本页面快得多。 但是您必须牺牲页面的功能和外观。 在测试站点上,AMP 实施后流量没有突然增加。 然而,谷歌将三分之一的访问者引导至三分之二的移动用户加速而不是标准的测试博客页面。
一些网站管理员认为 AMP 是 Google 不必要的突发奇想,另一方面,互联网上的许多发布商报告网站访问者数量增加并提高了广告的有效性。 此信息将帮助您自行决定是否使用加速移动页面。
如何在 WordPress 上安装 AMP
为了 WordPress 用户的好运,Accelerated Mobile Pages 可以在一分钟内实现。 为此,您需要安装并激活来自 WordPress 开发团队的 AMP for WordPress 插件。 Automattic 的 AMP 插件没有设置,但它在常规博客文章中完美运行,并且与几乎所有 WordPress 主题兼容。
您可以在 AMP 验证器上测试您的 AMP 页面。
为了扩展功能并改善 AMP 页面的外观,我们建议为 WP 插件使用替代 AMP。 安装并激活插件后,进入管理面板中的快速页面设置菜单。

如有必要,在“常规”部分中,上传站点徽标。 推荐的图像尺寸为 190×36 像素。 使用 Resize 按钮,您可以指定徽标的任意大小。 与 Automattic 的 AMP on WordPress 插件不同,如果您需要 AMP 版本的静态页面,请将按钮切换到 On 位置。
在分析部分,使用 Google Analytics 启用 AMP 访问跟踪。 为此,请输入 Google Analytics ID。 此外,您可以在此处使用 Google Tag Manager 启用 Google Analytics。
在设计部分,您可以更改 AMP 页面的主题和布局。 在这里您可以选择现成的设计选项。 您还可以使用 AMP 主题框架创建自己的自定义主题。
在 SEO 部分,您可以配置来自 Yoast SEO 插件的元数据在加速页面上的显示,将任意 HTML 代码添加到标题中,还可以配置档案和类别页面的索引。 如果您不使用 Yoast SEO 插件,请保留默认设置。
在广告部分,配置 AdSense 广告的显示。 该插件提供四种广告选项:所有页面的页眉上方、所有页面的页脚下方以及出版物页面内容的上方和下方。
要在发布页面的内容下方放置广告,请打开按钮 AD # 4。选择广告的尺寸。 在您的 AdSense 帐户中创建一个广告,并将用户 ID 和广告单元 ID 添加到建议的字段中。 从创建的广告代码中获取数据。
您可以在需要时在加速页面上显示匹配的内容块。 匹配内容是一种免费的推荐工具,它为您提供一种简单的方式来向您的网站访问者宣传您的内容。 通过为您的读者提供更多与他们相关的内容,您可以增加网站的页面浏览量、在网站上花费的时间、读者忠诚度、广告印象以及最终的广告收入。 为了使它发生,请在插件的相应字段中指定块 ID。
在 Single 部分中配置帖子页面的外观和功能。 您可以启用附加在屏幕底部的社交图标、指向上一个和下一个帖子的链接,还可以配置相关帖子块。
在社交分享部分,启用社交分享按钮。 在结构化数据部分中,加载加速页面微标记的图像。 谷歌可以使用它来生成搜索结果。 此外,指定在社交网络上发布指向加速页面的链接时将在片段中使用的图像大小。
在通知部分,您可以配置通知的显示。 例如,您可以告知访问者有关 cookie 使用政策的信息并显示 GDPR 通知。
在 Disqus 评论部分,您可以在加速页面上启用评论系统 Disqus。 为此,将 Disqus Comments Support 按钮切换到 On,指定 Disqus 系统中资源的 URL,以及服务器上评论文件的路径。
如果不启用评论系统,AMP页面将显示基本页面访问者留下的评论文本和“评论”按钮。 通过单击按钮,用户将被重定向到页面的基本版本。
在高级设置部分,您可以启用主页的加速版本以及标题和档案的页面。 对于此功能,请使用主页支持和存档页面支持按钮。
移动重定向按钮可将所有移动用户从自适应版本的站点自动重定向到 AMP。
不要将所有用户重定向到 AMP。 并非所有访问者都需要网站的加速页面。 重定向将迫使智能手机和平板电脑用户使用功能有限的缩略版页面。 这可能导致网站转化率下降。
此外,如果 Google 看到该网站和 AMP 的桌面版本,它会为移动优先索引选择桌面版本。 由于缺乏对移动设备的资源适应性,这可能导致流量丢失。
请务必使用页脚按钮中的“链接到非 AMP”按钮启用页脚中完整版页面的链接。 这将帮助用户导航到具有额外功能的基本页面。
在扩展部分,您可以购买和启用插件的附加组件。 例如,您可以使用其他工具来管理加速页面上的广告或将微标记“评级”添加到 AMP。
在修复 AMP 错误部分,您可以启用付费支持。 该插件的开发人员将帮助您了解设置并摆脱 Search Console 中的错误通知。
导入/导出块允许您将加速页面的设置从一个站点迁移到另一个站点。
因此,在 WordPress 网站上,您可以在几分钟内实现加速页面。 多一点时间花在使用 AMP for WP 插件自定义布局和功能上。
用于 Drupal 的 AMP
要在 Drupal 站点上实施 Accelerated Mobile Pages,请使用以下工具:
- AMP 模块。
- AMP 主题。
- AMP 库 HTML。
要使用 AMP 模块,需要插件 Token 和 Chaos Tools。 如果您计划在 AMP 页面上展示 AdSense 广告,请安装 Google AdSense 集成扩展。
在配置选项卡的 AMP 设置页面上,启用显示出版物和页面的加速版本。 选择将用于创建加速页面的主题。 输入 Google Analytics ID 以跟踪页面访问。 此外,您可以使用 AMP-pixel 来计算观看次数。
在 AMP 元数据选项卡上,输入站点的名称。 如有必要,下载徽标并选择其大小。
配置后检查页面加速版本的显示。 为此,将值“?amp”添加到 URL。
Joomla 的 AMP!
在 Joomla 上实现加速页面! 网站使用扩展名 wbAMP。 这个插件的完整版每年将花费你 44 美元。 社区版是免费提供的。
安装并激活插件后,进入设置页面。 该插件的免费版本功能有限,因此您只能配置显示加速页面的基本参数。
保留 AMP URL 的默认后缀值。 在这种情况下,您只需要添加 amp 值即可查看加速页面。
此外,请在主设置页面上提供有关网站和发布者数据的信息。 选择适当的微标记类型:NewsArticle 用于新闻注释,BlogPosting 用于博客文章。
选择要为其创建加速版本的页面。 为此,请切换到“选择页面”选项卡。
完成“com_content 规则”部分。 如果您计划仅为出版物显示加速页面,请在“查看”字段中指定文章的值。 在“类别”字段中,选择其出版物将具有 AMP 版本的类别。 输入字段 ID、物料 ID 号和“任务”,输入值“*”。 在这种情况下,将为所选类别中的所有出版物创建 AMP。
免费版插件中的其他设置不可用。
在 Joomla 上创建加速页面还有另一个商业工具! 网站:Jamp 插件。 它的价格为 39 欧元。 在插件的测试站点上,您可以看到该工具如何将标准页面转换为加速页面。
与 WordPress 和 Drupal 不同,对于 Joomla! 没有用于创建 AMP 的完全免费的工具。
用于在线商店的 AMP
AMP 技术主要用于内容项目:新闻资源、博客。 我应该为电子商务网站创建加速页面吗?
AMP 项目的作者认为,在线商店可以而且应该使用加速页面。 支持在电子商务资源上实施技术的主要论据——提高移动页面的加载速度对转换产生积极影响。 顺便说一句,eBay 从 2016 年年中开始就在试验 AMP。
用于 OpenCart 的 AMP
为了为 OpenCart 创建加速页面,请使用 Accelerated Mobile Pages 模块。 这是一个付费的解决方案。 并且始终能够从链接中查看借助此模块创建的加速移动页面的测试版本。
您还可以测试产品页面模块的 AMP。 这是一个免费的解决方案。 该插件仅为产品页面创建 AMP。 对于产品页面的 AMP 工作,您需要 SEO Friendly URLS 模块。
此时最好不要推荐用于产品页面模块的免费 AMP,因为现在在先前的资源上测试了一个半工作日并且无法正常工作。 在 OpenCart 版本 2.3.0.2 上安装和激活程序后,网站上的加速页面不会出现。 该插件会在页眉中添加指向 AMP 版本的链接。 单击链接时,会出现 404 错误。
此外,由于安装了该模块,该站点会定期变得无法访问,并且在浏览器的屏幕上会出现不同种类的涂鸦和 mojibake。 移除并重新安装模块后,可维护性恢复。
也许问题与缺乏管理 OpenCart 网站的实际经验有关。 个人资料论坛的用户主要对产品页面模块的 AMP 给予正面反馈。
Magento 的 AMP
如果您的在线商店在 Magento 平台上运行,请使用付费插件 Accelerated Mobile Pages。 该模块为主页面、类别页面和产品页面创建 AMP。
PrestaShop 的 AMP
PrestaShop 商店的加速页面可以使用付费模块 PrestaShop AMP 创建。 它生成主页面、类别页面和产品卡片的加速版本。
可以在测试站点上评估模块功能。
是否实施 AMP,这是个问题!
如果您有一个在 WordPress 上运行的内容项目,则可以快速且经济高效地实施 AMP 页面。 您将花一分钟安装基本插件和半小时来安装和配置替代 AMP 插件。
Drupal 管理的站点也有一个可以快速安装和配置的免费解决方案。 但是对于 Joomla! 并且必须购买用于创建 AMP 的在线商店插件的 CMS。
但是,在某些情况下,AMP 结果可能不像您期望的那样明亮和闪亮。 在 AMP 实施案例研究中,Kinsta 分享了非常重要的见解——当时在 Kinsta 博客上启用了 AMP:
- 移动潜在客户下降了 59.09%。
- 来自移动设备的时事通讯电子邮件注册量下降了 16.67%。
- 来自移动设备的帐户创建量下降了 10.53%。
此外,当 AMP 完全移除 Kinsta 后,排名实际上上升了。 为什么会这样? 可能最大的原因之一是 AMP 可以提高广告密集型和面向新闻的项目的 SERP 性能,与此同时,如果您的网站在移动设备上已经相当快,那么 AMP 不会产生巨大的积极影响。
据谷歌称,到 2020 年,全球 70% 的蜂窝网络连接将以 3G 或更慢的速度发生。因此,尽管针对移动设备进行优化非常重要,但那些已经拥有良好优化网站的网站可能不会注意到巨大的差异。
如果Accelerated Mobile Pages的功能和外观不如标准页面,并且在排名上还没有明显优势,那么使用Accelerated Mobile Pages是否有意义?
搜索市场的全球领导者谷歌显然只会在这个项目上走得更远,其他人将不得不遵守它的规则。 逻辑很简单:移动流量的份额正在增长,并将继续增长。 人们不仅会在手机和手表的帮助下上网。 甚至咖啡机和洗衣机现在也在线。 因此,在移动设备的屏幕上显示内容的技术将会发展。
顺便说一句,几年前,网站所有者对调整网站以适应移动流量的必要性持怀疑态度。 今天,移动版本或自适应布局是有效运营在线资源的必要条件。
在可预见的未来,AMP技术极有可能成为网站有效性的基本条件之一。