HTML怎么定义页面的元数据与关键词 HTML页面配置技巧【进阶】-html教程-PHP中文网

必须写的标签包括：（须置于最前）、、和；keywords已无seo价值，不应使用。

html怎么定义页面的元数据与关键词 html页面配置技巧【进阶】

<meta> 标签是唯一合法且被广泛支持的 HTML 元数据定义方式，<title></title> 和 <link rel="canonical"> 等也属于元数据链路，但关键词（keywords）已无实际 SEO 价值，现代页面应聚焦于 description、viewport、charset 和结构化数据。

哪些 `<meta>` 是必须写的

不是所有 <meta> 都等价。浏览器和爬虫只认特定 name 或 http-equiv 属性值，其余会被忽略：

<meta charset="utf-8"> —— 必须放在最前，否则可能触发字符重解析，导致中文乱码或样式错位
<meta name="viewport" content="width=device-width, initial-scale=1"> —— 没它，移动端页面默认按 980px 渲染，文字小到无法点击
<meta name="description" content="..."> —— 搜索结果摘要唯一可控字段，长度建议 50–160 字符，避免堆砌
<meta name="robots" content="index,follow"> —— 明确告诉爬虫是否索引/跟随链接；生产环境禁用 noindex 时务必检查是否误留

`keywords` 还要不要写

不要写。Google 自 2009 年起完全忽略 name="keywords"，Bing 也早已弃用。实测添加该标签对排名、点击率、收录均无正向影响，反而可能暴露配置疏漏（如过期词、拼写错误）。若团队有历史遗留要求，可保留但内容设为空或占位符，例如：<meta name="keywords" content="">。

Doc To HTML

使用 MinerU 文档处理引擎将 Word 文档（.doc、.docx）转换为保留结构和格式的干净 HTML。

下载

容易被忽略但关键的元数据配置

这些字段不显眼，但直接影响渲染行为、安全策略与跨域协作：

<meta http-equiv="X-UA-Compatible" content="IE=edge"> —— 仅 IE 有效，现代项目可删；若需兼容旧内网系统，必须紧贴 <meta charset> 后，顺序错位会导致 IE 强制文档模式降级
<meta name="theme-color" content="#4285f4"> —— Chrome/Edge 地址栏、PWA 启动屏配色，Android 上生效明显；不支持透明色，HEX 或 RGB 均可
<meta property="og:title" content="..."> —— Open Graph 协议字段，Facebook、微信等分享时读取；必须配合 <meta property="og:url"> 和 <meta property="og:type"> 才完整，缺一不可
<link rel="canonical" href="https://example.com/page"> —— 解决重复内容问题，尤其适用于带参数的 URL（如 ?ref=abc），href 值必须是绝对路径且可访问

结构化数据该放哪儿

JSON-LD 是当前最推荐的结构化数据嵌入方式，必须用 <script type="application/ld+json"></script> 写在或顶部，不能包裹在 HTML 注释里，也不能用 document.write 动态注入。Google 不解析 <script></script> 外部引用的 JSON-LD，也不支持 itemscope + itemtype 的旧式微数据写法。示例：

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "WebPage",
  "name": "HTML 页面元数据配置",
  "description": "如何正确设置 meta 标签与结构化数据"
}</script>

验证工具用 Google Rich Results Test，别依赖浏览器开发者工具的 Elements 面板——它不显示解析后的结构化数据。