<meta charset="UTF-8">
声明页面字符集，避免中文等文字出现乱码。提示：通常放在 head 的前面，并与页面实际编码保持一致。
01
配置页面标签
输入内容后即时更新结果
字段变化时标签实时更新。
02
生成的 HTML
复制到页面 <head> 中
填写页面信息后自动生成。
03
摘要预览
检查搜索结果中的文字层级
example.com
页面标题预览
页面描述会显示在这里，用于检查摘要长度与可读性。
https://example.com/page
预览用于校对文字与图片比例，实际展示效果会因平台规则略有不同。
字段速览
常见 meta 标签说明
<meta name="viewport">
控制移动设备的页面缩放和布局宽度。提示：响应式页面建议使用 width=device-width。
<title>
页面主标题，显示在浏览器标签页与搜索结果标题中。提示：建议控制在 30 字以内，把核心关键词前置。
meta name="description"
页面摘要，常作为搜索结果中的描述文字。提示：80–160 字为宜，覆盖主要内容与搜索意图。
link rel="canonical"
向搜索引擎建议重复或高度相似页面的首选地址。提示：只有内容等价的版本才应指向同一地址；它是建议信号，不能保证收录或排名。
meta name="robots"
控制搜索引擎索引与抓取行为。提示：值用逗号分隔，例如 index, follow 或 noindex, nofollow。
og:title
页面分享到社交平台（微信、微博等）时使用的标题。
og:description
社交平台分享时展示的摘要，用于替代默认抓取文本。
og:url
分享链接的规范地址，避免同一页面出现多个分享版本。
og:image
分享卡片使用的配图。提示：建议 1200×630 左右，并使用 HTTPS 的绝对地址。
og:image:alt
为分享配图提供文字替代说明，提升可访问性。
og:image:width / height
提前告诉平台图片尺寸，帮助更稳定地生成卡片。
og:type
内容的类型，如 website（网站）或 article（文章）。
og:site_name
所属站点的名称，用于在分享时显示站点身份。
twitter:card
Twitter 卡片样式，summary_large_image 表示大图卡片。
twitter:title
Twitter 卡片上的标题，未配置时平台会读取 og:title。
twitter:site
关联发布内容的 Twitter 账号，通常填写 @账号名。
Meta 标签生成器
填写页面信息，生成 title、description、canonical 与 Open Graph、Twitter Card 等完整 meta 标签代码。
使用说明
三步完成操作
- 01 · 填写页面信息
输入标题、描述、规范 URL 与分享配图，选择内容类型和爬虫规则。
- 02 · 检查预览结果
查看搜索摘要与社交卡片预览，确认文字长度、地址和图片信息。
- 03 · 复制到页面
复制或下载生成的代码，并放进页面 <head> 中后再次校对字段。
常见问题
使用前先了解这些
title 与 og:title 需要同时存在吗？
title 是浏览器与搜索引擎的主要标题；og:title 服务于社交平台分享。多数分享平台在缺少 og:title 时会回退读取 title，但单独配置效果更可控。
description 为什么重要？
description 常被搜索引擎用作搜索结果摘要，也用于社交平台描述。它不直接影响排名，但清晰准确的描述能显著提升点击率。
og:image 有尺寸要求吗？
社交平台通常建议约 1200×630 的横图，并使用可公开访问的绝对 HTTPS URL。填写图片替代文本有助于无障碍阅读。