页面 · 功能Open Graph · OG图片 · KakaoTalk链接预览
Open Graph（分享预览）
Open Graph（分享预览）是一项设置，用来指定在KakaoTalk · Instagram · Facebook上发送链接时显示的标题 · 描述 · 封面图片。
它就像店铺传单的封面。收到链接的人会看着它决定要不要点开。
再详细一点
不设置的话，可能会冒出不相干的图片，或者只孤零零地显示一个标题。同样的链接，预览整齐的话点击的人会更多。
封面图片常用横向的1200×630尺寸。图片里的文字要写得大而简短，缩小后也能看清。
KakaoTalk会把读取过的预览记住一段时间。如果换了图片却还显示旧的，可以在Kakao开发者网站的分享调试工具（Share Debugger）里重置。
Open Graph标签里包含哪些内容？
Open Graph标签是写在页面头部的一张简短说明表，最基本的四项是标题 · 类型 · 代表图片 · 网址。Open Graph协议官方文档（ogp.me）把这四项规定为每个页面都必须有的属性。
在此基础上再加上描述 · 网站名称 · 语言 · 图片说明，预览会更加规整。顾客看到的主要是标题 · 描述 · 图片，但其余的值也能帮助各个平台准确理解这个链接。
这些标签写在顾客看不到的地方。所以在实际发送链接之前，很难发现有没有漏掉，最好把它列入上线前的检查清单。
表格可以左右滑动查看
| 标签 | 含义 | 店铺网站示例 |
|---|---|---|
| og:title | 预览标题（必填） | 延南洞手冲咖啡馆○○ |
| og:type | 页面类型（必填） | website |
| og:image | 代表图片网址（必填） | 店内空间照片或招牌菜单照片 |
| og:url | 该页面的规范网址（必填） | https://店铺地址/menu |
| og:description | 一两句话的描述 | 每天早上亲手烘焙咖啡豆，10点开始营业 |
| og:site_name | 整个网站的名称 | 咖啡馆○○ |
| og:image:alt | 说明图片的内容 | 放在窗边座位上的手冲咖啡 |
| og:locale | 语言和地区 | ko_KR |
分享预览图（OG图片）要做多大、怎么构图？
最常见的是做成横向长方形，比例约为1.91:1（例如：1200×630）。Meta（Facebook）开发者文档建议使用宽度1080像素以上的图片，以便在高分辨率屏幕上清晰显示，并建议用标签同时写明图片的宽 · 高尺寸。
每个平台裁切图片的比例都略有不同。所以店名或关键文字最好避开边缘，集中放在中间，这样比较保险。
如果要在图片里放文字，一句十个字左右的短文案就够了。在群聊里，预览图显示得比手掌还小，所以要在手机上亲自确认一下。
图片文件也不要太大。如果分享平台抓取图片耗时太长，预览可能会显示成没有图片的样子。
每个页面的分享预览都要设置得不一样吗？
是的，经常发给顾客的页面，最好每个页面单独设置。如果所有链接都显示成同一张Logo图，收到的人不点开就不知道是什么内容。
至少要把首页、菜单 · 价格页面、预约页面、活动页面分别设置好。标题写顾客能从这个页面获得的内容，图片则选最能体现这个内容的画面就行。
如果店铺经常发布新文章或新商品，逐一设置会很困难。设置成自动把文章的第一张图片或商品主图作为预览图，会方便很多。
- 咖啡馆：新品介绍链接配上新品照片和“秋季限定栗子拿铁上市”的标题。
- 美发店：活动链接配上“首次到店顾客护理项目介绍”的标题和店内照片。
- 手作工坊：课程招募链接配上成品作品照片和“11月周末课程招募”的标题。
- 网店：商品链接直接显示该商品的照片和商品名称。
分享预览的标题和描述怎么写？
分享预览的标题，要让收到的人在打开链接前就知道能得到什么。可以和搜索结果中显示的页面标题一样，但考虑到它是在聊天窗口里被阅读的，也可以润色得更像在跟人说话。
描述按照Open Graph官方文档的说法，一两句话就够了。把营业时间 · 位置 · 预约方式这类收到的人会想知道的信息放在前面。长句在预览中很容易被截断。
定好代表图片后，也一并写上图片说明（og:image:alt）。Open Graph文档也建议同时填写，这样使用读屏软件的人也能了解图片内容。
比起只重复店名的标题，能让收到链接的人看出要做什么的标题，更能给出点开的理由。比如与其写“○○工坊”，不如写“○○工坊 · 11月课程安排”。
- 标题示例：“咖啡馆○○ · 延南洞手冲，每天10点~22点”
- 描述示例：“窗边座位宽敞的手冲咖啡馆。咖啡豆在店里也能买到。”
- 欠佳示例：标题“首页”、描述“欢迎光临”这类看不出是哪家店的文案
分享预览不更新或显示异常，按什么顺序排查？
大多是因为漏了标签、图片网址有问题，或者平台还记着以前的预览。按下面的顺序检查，就容易找到原因。
Meta（Facebook）表示，用分享调试器重新抓取，就不必等待默认的更新周期（约24小时）。KakaoTalk也可以在Kakao开发者网站的分享调试器里做同样的操作。
如果打算把同一个链接发到多个平台，最好每个平台都确认一次。即使读取的是同样的标签，各平台裁切图片的方式和显示的字数也可能不同。
- 01确认该页面里是否真的有og:title · og:image标签。
- 02确认图片网址是以“https://”开头的完整网址。
- 03把图片网址直接输入浏览器，确认不登录也能打开。
- 04确认图片文件不会过大。
- 05把网址输入Meta分享调试器或Kakao分享调试器，重新抓取预览。
- 06用KakaoTalk的“发给自己”功能重新发送，确认结果。
Open Graph常见的错误有哪些？
最常见的错误是所有页面都放同样的标题和Logo图片。虽然设置了，但每个链接都没有区别，分享出去时给不了顾客点开的理由。
换了图片却没改文件名，平台有时会继续显示以前的图片。如果重新做了图片，把文件名也一起改掉最保险。
分享预览不仅用于您发出的链接，顾客转发给朋友的链接也同样会用到。这是顾客在替您做宣传的时刻，所以至少首页和预约页面一定要设置好。
关于Open Graph，该问网站制作公司哪些问题？
分享预览上线后再改比较麻烦，所以在设计稿阶段就问清楚下面四个问题。
- 每个页面能单独设置标题 · 描述 · 图片吗？
- 发布新文章或新商品时，预览图会自动设定吗？
- 会在KakaoTalk上亲自确认分享预览吗？
- 以后您自己能在管理后台修改预览吗？
举个例子
- 餐厅在群聊里分享预约链接时，“圣水手工汉堡Haru · 预约须知”和汉堡照片会以卡片形式显示出来。
- 普拉提工作室的活动页面会单独设置一张活动专用的封面图片。
只需确认这些
- 是否用KakaoTalk“发给自己”功能发送链接，确认过预览效果
- 每个页面的标题和图片是否各自合适、有所区别
- 图片里的文字在手机上是否也能看清
我的店需要吗？
如果您经常通过KakaoTalk · 社交媒体发送链接，一定要做好。
在ISSYMO
搜索 · AI曝光基础设置中包含分享预览（OG）。我们会按页面设定发到KakaoTalk · Instagram时显示的标题和图片。
了解SEO · GEO常见问题
参考资料
最后更新于