建站学院

铸就企业 服务社会 成就自己

网站TDK 怎么写

发布时间:2025-08-10点击数:49

什么是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