<meta> 标签无强制必填属性，但 name 或 http-equiv 必须其一才能生效；charset 是唯一可独立使用的属性，且须置于 <head> 最前。
HTML <meta> 标签的必填属性有哪些
没有“必填”属性，但不写 name 或 http-equiv，<meta> 就几乎没用——浏览器和爬虫只靠这两个字段识别元数据意图。
常见错误是只写 content，比如：<meta content="en">，这行代码完全被忽略，因为没告诉浏览器“这是语言声明”还是“这是作者名”。
-
name用于页面级描述（如description、keywords、author），配合content使用 -
http-equiv模拟 HTTP 响应头（如Content-Type、Refresh），此时content值需符合对应协议规范 -
charset是唯一可单独存在的属性：<meta charset="UTF-8">，它不依赖name，且必须放在<head>最前面
SEO 相关 <meta name> 哪些还有效
Google 已明确不使用 keywords，Bing 也基本忽略；description 仍是搜索结果摘要的主要来源，但仅当它比页面正文更贴切时才会被采用。
容易踩的坑：堆砌关键词、超长（建议 ≤155 字符）、与页面内容无关。实际中，很多 CMS 自动生成的 description 是空值或模板占位符，反而让搜索引擎 fallback 到截取正文。
立即学习“前端免费学习笔记（深入）”；
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 有效且推荐：
<meta name="description" content="简明概括本页核心内容"> - 已失效：
<meta name="keywords" content="seo,优化,关键词">（纯冗余） - 有条件有效：
<meta name="robots" content="noindex, nofollow">，但优先级低于X-Robots-TagHTTP 头或robots.txt
<meta http-equiv> 还有哪些真正在用的场景
绝大多数 http-equiv 已被淘汰（如 Expires、Cache-Control 应由服务器头控制），目前真正被广泛支持且有实际价值的只剩两个：
-
Content-Type：已被<meta charset>取代，仅在无法修改 HTML 开头时作为兼容方案（不推荐） -
Refresh：仍被支持，但仅限跳转用途，例如<meta http-equiv="Refresh" content="0; url=https://example.com/">；禁止用于页面内定时刷新（影响可访问性和 SEO） - 注意：
<meta http-equiv="X-UA-Compatible" content="IE=edge">在 IE 停服后已无意义，现代项目应直接移除
移动端适配和 Open Graph 元数据怎么写才不白写
不加 <meta name="viewport">，响应式 CSS 就等于没写；不加 Open Graph 标签，分享到微信、微博、Discord 时就只能显示标题+默认图，控制权全交给平台自动抓取。
关键点在于：Open Graph 属性名必须带 og: 前缀，且 og:url、og:title、og:type 是基础三件套；图片 og:image 推荐尺寸 ≥1200×630px，否则可能被裁切或降质。
- 必备视口：
<meta name="viewport" content="width=device-width, initial-scale=1"> - 基础 Open Graph：
<meta property="og:url" content="https://example.com/page">、<meta property="og:title" content="页面标题">、<meta property="og:image" content="/thumb.jpg"> - 注意：
property不是name，混用会导致社交平台完全读不到
复杂点在于动态页面：URL、标题、图片往往来自 CMS 或前端状态，硬编码 <meta> 会失效。这时候得靠服务端渲染注入，或用 JS 在 document.head 中动态写入——但后者对爬虫不友好，得权衡。
