cite标签只能包裹作品标题，不可用于作者名、昵称或ID；正确用法仅限用户主动提及书名、影名等独立作品名时，且应配合blockquote与footer结构使用。
评论区里用 cite 包作者名是错的
几乎所有老项目评论区都这么干：<cite>张三</cite> 说：……——这违反 HTML5 规范。cite 只能包裹作品标题，不是人名、ID、昵称或链接。浏览器渲染成斜体，只是巧合，不代表语义成立。屏幕阅读器不会把“张三”识别为作品，反而可能误导辅助技术理解上下文。
常见错误现象包括：SEO 工具报出「cite 内容非标题类文本」警告；W3C 验证器提示 Element cite must not be empty, and its content must be a work title；部分无障碍测试工具直接忽略该标签或标记为无效引用。
- 作者名应放在
<footer></footer>或普通<span></span>中，配合<blockquote></blockquote>使用 - 若需强调发言者身份，可用
<strong></strong>或带role="author"的容器 - 昵称/用户 ID 属于元数据，不属于「被引用的作品」，不满足
cite的语义前提
cite 在评论区唯一合法的用法
只有当评论内容本身在引用某部作品时，才轮到 cite 出场。比如用户留言：“《三体》里‘宇宙社会学’的设定让我重思文明关系”，其中《三体》是小说标题，可且仅可被 cite 包裹。
使用场景很窄：用户主动提及书名、影名、文章名、游戏名等，并且该名称独立成词、无附加说明（如不带“作者是刘慈欣”“2008年出版”这类元数据）。
立即学习“前端免费学习笔记（深入）”；
- ✅ 正确：
我反复看了<cite>肖申克的救赎</cite>，每次都有新体会 - ❌ 错误：
用户<cite>阿伟</cite>提到<cite>Vue 官方文档</cite>（前者人名，后者是文档集合，非单一作品） - ⚠️ 模糊但可接受：
参考<cite>HTTP 权威指南</cite>第7章（前提是“HTTP 权威指南”作为书名独立存在，未混入章节号或版本信息）
想标作者又不想乱用 cite？用 footer + blockquote 组合
HTML5 明确推荐把引用内容和出处分开：引用文本放 <blockquote></blockquote>，出处信息（含作者、作品名、时间等）放其子元素 <footer></footer>。这才是评论区该有的结构。
例如一条带来源的评论，应写成：
<blockquote> <p>“不要温和地走进那个良夜”——这是狄兰·托马斯最著名的诗句之一。</p> <footer>— <cite>不要温和地走进那个良夜</cite>, 狄兰·托马斯</footer> </blockquote>
这里 cite 只包诗题，作者名“狄兰·托马斯”在 footer 里裸写，不加任何语义标签——因为作者不是作品标题，也不属于引用内容本身。
-
footer不是必须用，但比塞在段落末尾或用small更符合语义层级 - 若评论系统需支持机器提取作者，建议用
data-author="..."属性，而非强套语义标签 - 避免嵌套
a到cite里（如<cite><a href="...">代码大全</a></cite>），W3C 允许但不鼓励；更推荐<a href="..."><cite>代码大全</cite></a>
CSS 样式不能补救语义错误
即使你给 cite 加了 font-style: normal，或者用 JS 动态插入，只要里面包的是人名、URL、日期，它就还是错的。语义错误无法靠视觉掩盖——搜索引擎不读 CSS，屏幕阅读器不听样式，验证器只看内容类型。
真正容易被忽略的点在于：很多团队把「看起来像引用」当成目标，结果批量替换旧模板时，把所有评论头像旁的昵称都套上 cite，以为“统一风格”。这反而让整页的引用语义失效，后续想用自动化工具提取书目或做学术引用分析时，根本没法区分真假作品名。
