hexo amp加速_如何验证加速的移动页面（AMP）

在上一期AMP教程中 ，我们向您展示了如何采用AMP（加速的移动页面）来显着提高速度，并在移动环境中更好地展示Google在您的网站上的移动搜索结果。

看到AMP的潜力后，我想您可能已经开始或计划开始对您的网站进行更改以符合AMP的要求 。 仔细遵循文档上的指南，并编写CSS来对AMP页面进行样式设置以适合您的视觉需求。

现在，还有最后一件事要做：验证那些页面。

AMP验证器

有几种方法可以验证您的AMP页面：

1. 在AMP页面URL的末尾添加＃development #development=1跟踪。 该报告将投影在DevTools下的Console选项卡中。
2. 或者，您可以使用在线AMP验证器 。
3. 您也可以使用Chrome AMP扩展程序 。

这些工具将生成报告，列出页面内的错误或警告。 基于此，您可以选择要解决的问题。

DevTools控制台中的AMP错误报告。

AMP验证主要控制HTML元素 ， s和样式声明的使用 。 确保页面中的所有内容均符合AMP，并且其中没有违反AMP准则的内容。 否则，您的AMP页面将不会出现在任何地方。

数据结构

AMP还需要Schema数据结构。 此数据以JSON格式布置在页面的head标签中。 它包含页面的上下文信息，包括标题，发布者徽标和名称，发布和修改的日期等。

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "NewsArticle",
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "https://example.com/article"
  },
  "headline": "Article headline",
  "image": {
    "@type": "ImageObject",
    "url": "https://example.com/thumbnail1.jpg",
    "height": 800,
    "width": 800
  },
  "datePublished": "2015-02-05T08:00:00+08:00",
  "dateModified": "2015-02-05T09:20:00+08:00",
  "author": {
    "@type": "Person",
    "name": "John Doe"
  },
  "publisher": {
    "@type": "Organization",
    "name": "Google",
    "logo": {
      "@type": "ImageObject",
      "url": "https://example.com/logo.jpg",
      "width": 600,
      "height": 60
    }
  },
  "description": "A most wonderful article"
}
</script>

根据页面的目的，要包含的数据可能有所不同：文章，评论，食谱，视频等。有关数据类型的详细信息，请参阅Google数据类型文档 。

如果没有提供某些数据，将会产生错误； 其他一些类型的数据是可选的，只会产生警告。 但是，这些类型的错误不会出现在上述AMP验证器中。

相反，它们将显示在Google结构化数据测试工具以及您的Google网站管理员帐户中。

AMP使用者或支持AMP的客户端（例如Google Search和Twitter Moments）可以使用这组数据在其结果页面中显示AMP内容。

Google SERP中的AMP轮播

因此，除了遵循AMP准则及其专有的自定义HTML元素外，还必须具备所需的架构数据。

被忽略的错误

大多数错误已在文档中明确指出，并且可以一目了然。 但是，一些错误是由变量引起的，这些变量可能无法引起我们的注意，例如“无效的属性值”，该变量表示"The attribute '%1' in tag '%2' is set to the invalid value '%3'." 。

此错误报告未提及或精确列出哪个值无效。 但是我知道的是，我们不能将<amp-img>元素的width和height设置为100%或auto 。 这些属性值必须是图像的确切大小，以保持图像比率。

这只是一个例子。 有许多自定义元素amp-img ， amp-iframe和amp-ads带有针对属性及其值的使用的自己的验证规则集。

这可能会使验证AMP Page成为一项艰巨的任务，尤其是如果我们考虑了数百年前（或也许是数千年）发布的旧内容的话。

最终思想

AMP仍处于早期阶段。 在Google和网络开发社区的共同努力下，它处于非常积极的开发状态。 但是AMP肯定会发展 。 与HTML5相似，将来可能会淘汰某些元素，属性和某些做法。 因此，请确保根据指南的最新更改不时对AMP页面进行持续验证 。

翻译自: https://www.hongkiat.com/blog/amp-page-validation/