让您的页面可被发现
现在您已经用 AMP 制作了一篇新闻文章,让我们确保用户可以找到并发现您的内容。
链接 AMP 内容
您的网站可以由全部 AMP 页面、部分 AMP 页面或没有 AMP 页面组成。本教程的这一部分将介绍如何将 AMP 合并到您网站的结构中。
在常规 HTML 页面中,规范链接是一种常见的技术,用于声明当多个页面包含相同内容时,应将哪个页面视为首选页面。
将 AMP 添加到网站时,一种常见的方法是生成传统非 AMP HTML 页面的 AMP 版本。这两个版本通常具有相同的内容(例如,文章的文本),但它们可能具有不同的呈现方式。在这种情况下,您应该将传统的 HTML 页面视为“规范”页面,并将 AMP 页面与这些 HTML 页面配对。
如果可以,请像使用任何其他 JavaScript 库一样使用 AMP 来构建您的网站,而无需考虑规范链接。使用 AMP 构建整个网站会大大减少您的维护负担。
在本教程中,我们将重点介绍您有一个页面的 AMP 版本和非 AMP 版本的情况。在本教程中,我们的网站包含一篇新闻文章,该文章具有一个非 AMP HTML 页面 (article.html
) 和一个页面的 AMP 版本 (article.amp.html
)。我们将通过 link
链接这些页面。
我们已经在 AMP 文档中迈出了实现此目标的第一步,方法是在 <head>
中包含一个链接标记,指向规范页面
<link rel="canonical" href="/article.html">
下一步是将规范文章链接到 AMP 页面。这可以通过在规范文章的 <head>
部分中包含一个 <link rel="amphtml">
标记来实现。
在 article.html
文件中,将以下代码添加到 <head>
部分
<link rel="amphtml" href="/article.amp.html">
下图说明了链接标记的方向
有必要设置这种双向链接,以便搜索引擎了解我们的常规 HTML 规范文档和我们的 AMP 文档之间的关系。如果未提供链接,则爬虫程序不一定会清楚哪些文章是常规 HTML 文档的“AMP 版本”。通过明确提供这些链接,我们可以确保没有歧义!
添加结构化数据
有效的 AMP 页面不需要 schema.org 结构化数据,但是某些平台(例如 Google 搜索)需要它来实现某些体验,例如热门新闻轮播。通常,包含结构化数据是个好主意。结构化数据可以帮助搜索引擎更好地理解您的网页,并在搜索引擎结果页(例如,在富媒体摘要中)更好地显示您的内容。结构化数据通过 application/ld+json
类型的脚本标记包含在 AMP 页面的 <head>
标记中。
对于我们的新闻文章,将以下结构化数据添加到 AMP 文档的 <head>
部分底部
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "NewsArticle",
"mainEntityOfPage":{
"@type":"WebPage",
"@id":"https://example.com/my-article.html"
},
"headline": "My First AMP Article",
"image": {
"@type": "ImageObject",
"url": "https://example.com/article_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": "⚡ AMP Times",
"logo": {
"@type": "ImageObject",
"url": "https://example.com/amptimes_logo.jpg",
"width": 600,
"height": 60
}
},
"description": "My first experience in an AMPlified world"
}
</script>
在浏览器中重新加载页面,并验证是否未引入 AMP 验证错误。
验证结构化数据
为了验证您的结构化数据是否正确,许多平台都提供了验证工具。在本教程中,我们将使用 Google 结构化数据验证工具验证我们的结构化数据。
- 在新的浏览器窗口中,打开 Google 结构化数据验证工具。
- 选择代码段选项卡。
- 将 AMP 页面的完整源代码复制并粘贴到验证工具的文本编辑器面板中。
- 点击运行测试。
如果您的结构化数据有效,则应该看到0 个错误和0 个警告。
做得好!您已经完成了您的 AMP 新闻文章。