skip to content
声控烤箱 | KazooTTT 博客

open graph 简述

Updated:

摘要(由llm生成)

在使用Twitter时,我们可能会注意到有些链接会显示预览卡片,而有些则不会。这主要是因为一些网站设置了Open Graph协议,而有些则没有。Open Graph是由Facebook在2010年推出的协议,用于在社交网络上分享链接时显示预览卡片。此外,Twitter也有自己的Twitter Card协议,如果两者同时存在,Twitter会优先显示Twitter Card的内容。文章还介绍了一些检查和预览Open Graph设置的工具,以及提供Open Graph示例的网站。

Open Graph 简述

场景

在我们使用 twitter 的时候,会发现有的链接会显示预览卡片,有的不会。

Pasted image 20240409203435 Pasted image 20240409204440

这是因为有的网站设置了 open graph,有的没有。

Pasted image 20240409103122

那么什么是 open graph?

open graph 是一个由 facebook 在 2010 年发布的协议,用于在社交网络上分享链接时,显示预览卡片。

Pasted image 20240409204654

我觉得无论是它的名称还是意图,都能看出 facebook 以及其他支持这种协议的社交平台的开放性, 特别是在某些平台会屏蔽外链或者限流带有外链的衬托下。

Pasted image 20240409205145

和 open graph 类似还有 twitter 自己的 card,如果 twitter card 和 open graph 同时存在的话,会先显示在 twitter card。如果 twitter card 没有定义,才会显示 open graph。

Pasted image 20240409213244 Pasted image 20240408163056

预览和检查工具

OpenGraph - Preview Social Media Share and Generate Metatags - OpenGraph

Pasted image 20240409201933

OpenGraph - Preview Images and Generate Open Graph Meta Tags

Pasted image 20240409195616 Pasted image 20240409131420

一些例子

Open Graph Examples

Pasted image 20240409131603
感谢阅读到这里,期待收到更多的反馈
欢迎关注公众号
kazoottt
公众号二维码