元信息基础概念
- 定义与作用：描述文档属性（字符集、视口、作者等）
- 常见标签类型：
<meta>、<title>、<link>、<base>
字符集声明陷阱
- 必须优先声明：
<meta charset="UTF-8">置于<head>顶部 - 避免省略或错误编码：如使用
ISO-8859-1导致乱码
视口配置误区
- 移动端适配必备：
<meta name="viewport" content="width=device-width, initial-scale=1"> - 错误示例：未设置
initial-scale导致缩放异常
标题与描述的SEO优化
<title>长度限制：建议50-60字符<meta name="description">需简洁且含关键词，避免堆砌
缓存与重定向问题
- 禁用缓存误用：
<meta http-equiv="cache-control" content="no-cache">可能不生效 - 正确方案：配合HTTP头或
.htaccess配置
兼容性与安全相关
- X-UA-Compatible过时标签：
<meta http-equiv="X-UA-Compatible" content="IE=edge">仅针对旧版IE - CSP安全策略：推荐通过HTTP头而非
<meta>实现
扩展元信息实践
- OpenGraph协议：
<meta property="og:title" content="...">用于社交媒体分享 - 图标与主题色：
<link rel="icon">和<meta name="theme-color">的规范写法
验证与调试工具
- W3C验证器检查语法错误
- 浏览器开发者工具查看实际生效的元信息