为文章中未显示的微数据使用不同的图像？

Question

我在一个有大量文章的网站上工作。

我正在寻找一种方法来添加不可见的图像，而无需将其放入隐藏的 div。

当用户添加一篇文章时，有一个 "main" 用户上传的特定比例的图像（我想将其用于微数据）。还有其他图片在他们上传的轮播中被抛出。

目前让微数据测试工具使用我的图像的唯一方法是执行以下操作：

<div class="hidden">
    <img itemprop="image" src="link/to/image.jpg" />
</div>

我想做的是使用元标记，但这似乎不起作用：

<meta itemprop="image" content="link/to/image.jpg">

虽然 Open Graph 和 Twitter Cards 支持图像的元标记，但我还没有找到任何与微数据相关的内容。有谁知道微数据是否可行，甚至 "that" 是否重要？

我只是不想让隐藏图片尽可能增加加载时间！

Answer 1

您可以使用 JSON-LD 而不是微数据。

这样您就可以在 JSON 数据中添加您想要的所有内容，这些数据不会显示在页面中，但会被大多数搜索引擎识别。

这里是取自 http://schema.org/CreativeWork 的示例：

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "CreativeWork",
  "name": "My Article",
  "image": "http://your.image.url.com"
}
</script>

Answer 2

使用 Microdata，您 may use meta 和 link 元素位于 body.

如果值是一个 URI，你 must use link 而不是 meta。

因此在您的情况下，标记为：

<link itemprop="image" href="link/to/image.jpg">

为文章中未显示的微数据使用不同的图像？

Using a different image for microdata that isn't displayed in the article?

html

meta

metadata

meta-tags

microdata