必须唯一且置于最前，否则致乱码；为响应式必需，最简写法是content="width=device-width, initial-scale=1"，禁用user-scalable=no以保可访问性。
HTML4/5混用时
浏览器不会因 标签缺失或写法老旧直接崩溃，但现代构建工具（如 Webpack、Vite）、Lighthouse 审计、SEO 工具会报 Missing charset declaration、Viewport not configured 或 no description meta 等警告；更实际的影响是：移动端页面缩放失控、搜索引擎摘要截断、社交媒体分享图/标题不显示。
HTML5 废弃了 这种冗余写法。新标准强制使用简短、无歧义的 ，且必须出现在 最前面（在任何 之前）。
- 若同时存在旧写法和新写法，部分浏览器会忽略后者
- 若
charset声明位置靠后（比如在 - 值必须是
UTF-8（全大写），写成utf-8或UTF8在某些旧版 IE 中可能失效
页面标题
没有该标签，移动端 Safari、Chrome 会以桌面视口宽度（通常约 980px）渲染页面，导致内容被压缩、字体过小、点击区域难操作。HTML5 文档中它已成事实标准，虽未写入规范正文，但所有现代浏览器强制依赖。
- 最简可用写法：
- 避免使用
user-scalable=no—— 会破坏可访问性，WCAG 不合规 - 不要设死
maximum-scale或minimum-scale，影响视力障碍用户缩放 - 若项目需兼容 iOS Safari 旧版本（shrink-to-fit=yes（仅 Safari 识别，无害）
SEO 和社交分享依赖的 name / property 元数据不能只靠 description
单纯保留 HTML4 风格的 只能服务搜索引擎摘要；微信、微博、Facebook、Twitter 等平台读取的是 Open Graph（og:）或 Twitter Card（twitter:）协议字段。这些不是 HTML5 新增，但已成为元数据事实子集，漏掉会导致分享时图/标题/描述全为空白。
立即学习“前端免费学习笔记（深入）”；
-
og:title、og:description、og:image是最低三件套，og:url强烈建议补上 -
twitter:card推荐设为summary_large_image（带大图） - 所有
og:image路径必须是绝对 URL（含https://），相对路径会被忽略 - 避免多个
og:image标签堆叠——部分平台只取第一个
真正容易被忽略的不是“加哪些标签”，而是顺序、编码位置、URL 绝对性、以及 viewport 的 scale 行为是否与 JS 动态缩放逻辑冲突——这些地方一出错，问题往往延迟暴露，等上线后才从用户反馈里发现。
