咨询热线:
88888888
什么是TDK?
TDK,是指seo页面中的页面描述与关键词设置,
"T"代表页头中的title元素,
"D"代表页头中的description元素,
"K"代表页头中的keywords元素。
如何添加,在html顶面头部添加如下代码
<head> <title>百度一下,你就知道</title> <meta name="description"content='全球领先的中文搜索引擎'> <meta name='keywords’ content='百度,搜索'> <!-- 缩略图 --> <meta property="og:image”content="方形图片路径"> </head>
部署代码后,在钉钉α中聊天界面输入网址发送,会将网址自动美化,以卡片形式展示,如下图
核心OpenGraph元标签
以下是最常用的OpenGraph 标签(需放在网页的<head>部分):
1.基础属性 (必填)
标签 | 作用 | 示例 |
<meta property="og:title”content="页面标题"/> | 分享显示的标题 | <meta property="og:title”content="人工智能最新进展”/> |
<meta property="og:type” content="类型 /> | 页面类型(如文章、视频等) | <meta property=og:type* content=article” /> |
<meta property=og:url” content=页面URL”/> | 页面的永久链接(用于去重) | <meta property="og:url" content="https://example. com/article/123" /> |
<meta property="og:image” content=图片URL”/> | 分享时显示的缩略图 | <meta property="og:image" content="https://example. com/image. jpg" /> |
2.补充属性 (推荐)
标签 | 作用 |
<meta property="og:description”content=页面描述” /> | 分享显示的简短描述(类似<meta name="description">)。 |
<meta property="og:site_name”content="网站名称”/> | 网站的整体名称(如"知乎"豆瓣")。 |
<meta property="og:locale”content="语言地区”/> | 页面语言(如zh_CN简体中文)。 |
3.媒体资源 (针对视频/音频)
标签 | 作用 |
<meta property="og:video”content="视频URL"/> | 关联的视频地址。 |
<meta property="og:audio”content="音频uRL"/> | 关联的音频地址。 |
4.结构化内容 (如文章、产品)
<!--示例:文章--> <meta property="og:type" content="article" /> <meta property="article:published_time" content="2023-01-01T00:00:00z" /> <meta property="article:author" content="作者名" /> <meta property="article:section" content="科技" /> <!-- 分类 --) <!--示例:产品--> 8<meta property="og:type" content="product" /> <meta property="product:price:amount" content="99.99" /> <meta property="product:price:currency" content="CNY" />
其他扩展协议
1. Twitter Cards
类似 OpenGraph,但用于 Twitter 的富媒体展示,常用标签如:
<meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="页面标题" />
2. Schema.org
更复杂的结构化数据(用于搜索引擎优化),需结合JSON-LD格式使用。
完整示例
<head> <!--OpenGraph 基础 --> <meta property="og:title"content="人工智能改变世界"/> <meta property="og:type" content="article" /> <meta property="og:url" content="https://example.com/ai-article" /> <meta property="og:image" content="https://example.com/ai-image.jpg" /> <meta property="og:description"content="探讨AI技术如何重塑未来。”/> <meta property="og:site_name" content="科技新闻网" /> <meta property="og:locale" content="zh_CN" /> <!--文章附加信息--> <meta property="article:author" content="张教授" /> <meta property="article:published_time" content="2023-05-20T08:00:00z" /> <!-- Twitter Cards--> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="人工智能改变世界" /> </head>
验证工具
Facebook分享调试器:
https://developers.facebook.com/tools/debug/
(输入URL可检查OG标签是否生效)
钉钉/微信等平台:
直接粘贴链接到聊天窗口,观察预览效果。
文章来源
https://blog.csdn.net/qq_37004501/article/details/132533565