什么是 Open Graph 标签?不懂你还做什么社交营销优化?!

Open Graph 标签是社交媒体优化(SMO)的标配,作为社交媒体营销者怎能不了解呢?

不好意思,今天标题党了一把,实际也没那么严重,咳咳。

话不多少,直入主题。

什么是 Open Graph Protocol?

什么是 Open Graph 标签?不懂你还做什么社交营销优化?!

Open Graph Protocol(开放图谱协议),简称 OG 协议或 OGP。它是 Facebook 在 2010 年 F8 开发者大会公布的一种网页元信息(Meta Information)标记协议,属于 Meta Tag (Meta 标签)的范畴,是一种为社交分享而生的 Meta 标签。

和阿狸一样从事数字营销推广的猫友一定不会陌生,它可是目前社交媒体优化(SMO)的标配了哦,只要你在 Facebook、Pinterest、Twitter 和 Google Plus 等社交平台混就不能不用到它。

为了让信息内容加速流动和准确呈现,Facebook 早年极力推动这个协议,到目前几乎主流的社交媒体网站都支持 OG 协议。包括 Twitter、Pinterest、LinkedIn 和 Google+ 都可以识别 OG 协议。虽然 Twitter 也有自家的 Twitter Cards 协议,但是 Twitter 只要发现网页上没有使用自家的协议,就会用 OG 协议代替。国内的百度、360 搜索、微博、微信、人人网等也支持该协议。

Facebook 牢牢把持着海外社交的大部分流量,大家都不得不向大佬低头了(开个玩笑)。

什么是 Open Graph 标签?不懂你还做什么社交营销优化?!

OG 协议有什么作用?

什么是 Open Graph 标签?不懂你还做什么社交营销优化?!

OG 协议是通过 OG Tags (OG 标签)实现的,它属于 Meta 标签的一种,可以用来标识网页类型和元素,让分享到社交网络的内容可以被有效的抓取,还可以控制我们想呈现的内容。

等等,你一直说 Meta 标签是什么?能说人话吗?
好的老板…

比如说,网页里 AAA 是标题,但是社交平台或搜索引擎它傻啊,分不清哪个是哪个,所以你得定义个 Meta 标签帮助它确认 AAA 是标题,BBB 是描述,CCC 是网址,DDD 是图片诸如此类。而 OG 标签是为社交分享而生的,当然现在影响范围不仅于此了,手机移动 App 也运用上了。

OG 标签长什么样?

下面就是一段 OG 标签的例子。只要看到以 og: 为前缀的 Meta 标签就可以判断该网页支持 OG 标签了。

<meta property=”og:title” content=”什么是 Open Graph 标签?不懂你还做什么社交营销优化?!”>
<meta property=”og:site_name” content=”瓦特研究所”>
<meta property=”og:type” content=”article”>
<meta property=”og:url” content=”https://www.watelab.com/what-is-open-graph-tags/”>
<meta property=”og:image” content=”https://www.watelab.com/uploads/cover-004.jpg”>
<meta property=”og:description” content=”Open Graph Protocol(开放图谱协议),简称 OG 协议或 OGP。”>

▲ 向左滑动代码框看更多内容,试试

og:后面紧跟着的就是元素的类型了,有标题 title、网站名 site_name、网页类型 type、网址 url、图片 image、摘要 description 等等。

更多类型可以到以下网址查询。

Facebook Open Graph 开发者指南
https://developers.facebook.com/docs/sharing/opengraph/object-properties

The Open Graph Protocol 官网
http://ogp.me/

有 OG 标签的内容分享后的效果是什么样的?

直接给个对比图,清晰直观。

什么是 Open Graph 标签?不懂你还做什么社交营销优化?!

看到了吧?如果没有加 OG 标签(右图),你分享到社交平台的网站、文章、产品会有多苍白。社交信息那么多那么杂,你说容易引起用户注意吗?会带来多少点击呢?

OG 标签对搜索引擎优化(SEO)有影响吗?

因为 OG 标签是专用于社交媒体优化的,是独立的一套标签,Google 等搜索引擎会识别并忽略(当然了,丰富的 OG 标签对 SEO 是有加持的作用的)。
这样呢,我们就可以个性化的创建一套独立的适合社交分享的文案,如带 Emoji 的标题、鬼畜的图片,而不会影响到正常的 SEO 效果,是不是很棒?

怎么添加 OG 标签?

  • 如果是用 WordPress 等建站程序

插件市场有很多支持生成 OG 标签的插件,选一个安装人数多的不会有错。WordPress 上推荐 Yoast SEO,不仅可以生成 OG 标签,还可以生成Twitter Cards 标签、Google+ 标签

什么是 Open Graph 标签?不懂你还做什么社交营销优化?!

  • 如果是自行搭建的网站

请联系你们的网页开发人员,手动添加相关代码到后端,这里就不展开了。

怎么检查 OG 标签是否安装正确?

虽然 Facebook 提供了

Facebook Open Graph Debugger 在线检测工具
https://developers.facebook.com/tools/debug/

但我还是推荐下面这个 All In One 的在线检测工具。

KnowEm Social Media Optimization (SMO) Tool
http://smo.knowem.com/

它不仅可以查询标准的 Schema Meta 标签,还可以检测 Open Graph 标签、Twitter Cards 标签、Google Rich Snippets 标签和查看 LinkedIn 上的显示效果等等。

什么是 Open Graph 标签?不懂你还做什么社交营销优化?!

部署 OG 标签的过程还有许多要注意的地方,先按下不表,有需要再另行开篇。

阿狸觉得你该收藏这篇文章,以后如果再有建站小哥问你:“Open Graph 标签干嘛用的?”请将这篇文章甩给他,哈哈!

好久没写那么长的文章了,累死了,让我歇会儿。

原创文章,作者:阿狸,如若转载,请注明出处:https://www.watelab.com/what-is-open-graph-tags/

(18)
上一篇 2018-01-28 19:11
下一篇 2018-02-01 17:39

相关推荐

发表评论

登录后才能评论