图片社交媒体元标签 - property="og:image" name="twitter:image" itemprop="image"

Question

当分享网址时，社交网络可以很好地从网站提取标题和描述，但对于图片，仍然需要创建自定义的meta标签：property="og:image" name="twitter:image" itemprop="image"。我的问题是，这会起作用吗？

<meta property="og:image" name="twitter:image" itemprop="image" content="http://example.com/image.jpg" />

所以我不需要为我的网站上的每个网页创建3个不同的meta标签。

- Dreadlord

---

这些中有一个回答了你的问题吗？在Facebook OG元标记上使用Schema.org itemprop ··· 是否可以使用相同的meta标签用于opengraph和schema.org - unor

非常接近，它说“property =” og：image“”和“itemprop =” image“”可以结合使用，但是没有任何地方提到Twitter。 - Dreadlord

Answer 1

property属性来自RDFa，itemprop属性来自Microdata，而name属性则来自普通的HTML。

使用itemprop和property属性是可以同时进行的，但是Microdata 不允许在带有itemprop属性的元素上使用name属性（尽管RDFa允许），因此您可以使用两个元素：

<meta property="og:image" name="twitter:image" content="http://example.com/image.jpg" />
<meta itemprop="image" content="http://example.com/image.jpg" />
<!-- note that this snippet is still invalid, see below -->

<meta name="twitter:image" content="http://example.com/image.jpg" />
<meta itemprop="image" property="og:image" content="http://example.com/image.jpg" />
<!-- note that this snippet is still invalid, see below -->

作为Schema.org还可以与RDFa一起使用，您可以省略Microdata（除非您需要支持不支持RDFa的消费者）：

<meta property="og:image image" name="twitter:image" content="http://example.com/image.jpg" />
<!-- note that this snippet is still invalid, see below -->

为什么这些无效？因为如果值是URI，必须使用link元素而不是meta元素。然而，在实践中，这会带来问题，因为：

- twitter:url被定义为meta扩展，而不是链接类型（但由于值是URL，它应该是链接类型） - Facebook似乎只识别meta，而不是link（我没有测试过，但在回答关于此问题的问题时，我多次阅读到这一点--例如，请参见：应该将og:image和og:url放在还是中？）

因此，尽管Twitter Cards和Facebook的OGP建议使用（并可能仅支持）无效标记，但这不一定适用于Schema.org消费者。因此，您可能希望结合无效和有效的方式：

<meta name="twitter:image" property="og:image" content="http://example.com/image.jpg" /> <!-- invalid, but expected -->
<link property="image" href="http://example.com/image.jpg" /> <!-- valid -->

（请注意，所有包含Schema.org的image属性的片段都需要一个带有的父元素。如果您没有提供它，那么image属性属于哪个词汇表就不清楚了。如果您无法提供，您应该使用schema:image代替。）

- unor