Simon Willison 5 月 23 日在个人博客转引 Ben Meyer 的文章，重新把 HTML <dl> 元素拉回前端开发者视野。文章提到的几个细节并不新，却很容易在日常项目里被误用：<dl> 自 2008 年 HTML5 草案起已被称为 description list，而不是 definition list。

这件事的重要性不在于发现了一个冷门标签，而在于它提醒开发者：HTML 语义不是装饰品。对产品详情、作者信息、元数据、账单条目这类“标签—描述”关系，<dl> 往往比一组随手堆出的 <div> 更准确，也更便于可访问性处理。

<dl> 的现代含义不是词典条目

早期教材常把 <dl> 讲成“定义列表”，这让很多开发者只在术语解释、FAQ 或词汇表里使用它。HTML5 在 2008 年草案中改称 description list，语义范围已经放宽：它描述的是一组名称和值、术语和说明、标签和内容之间的关系。

一个典型例子是作品署名：Author 后面可以跟多个 <dd>，分别写 Jeffrey Zeldman 和 Ethan Marcotte。这不是语法漏洞，而是合法结构，适合一个标签对应多个描述值。

写法是否合适判断
<dt>Author</dt> 后接多个 <dd>合法适合多作者、多邮箱、多地址等场景
用 <div> 包住一组 <dt> / <dd>合法方便样式处理，但只能用 <div>
用 <section>、<li> 等替代分组容器不应这样写规范并未把任意容器放开
用 aria-labelledby 给列表命名可行有助于让辅助技术理解这组信息的标题

这张表背后的现实问题是，很多前端团队为了排版统一，会把所有结构都写成 <div class="row">。短期省事，长期会把语义、可访问性和维护成本都推给后来的人。

合法写法有边界，ARIA 不是万能补丁

Ben Meyer 提到的另一个容易被忽略的点，是 <dt> 和 <dd> 可以用 <div> 分组。这个能力对样式很实用，比如每个字段和值要做网格布局、加边框或控制间距。但边界也清楚：这里允许的是 <div>，不是任意 HTML 容器。

ARIA 标注同样要谨慎。示例中用标题元素的 id 配合 <dl aria-labelledby="credits">，可以给描述列表提供可访问名称。这比只靠视觉标题更稳妥，尤其在页面有多组元数据时，屏幕阅读器用户更容易知道自己进入的是哪一组信息。

不过，Adrian Roselli 对 description list 的屏幕阅读器支持做过提醒：不同屏幕阅读器、浏览器组合对 <dl> 的表达并不完全一致。开发者不能把“语义正确”直接等同于“所有用户听到的体验一致”。公开规范给的是结构，行业现实还要经过辅助技术的实现层。

受影响的是写组件的人，不是普通网页访客

这类讨论最该影响的是设计系统、CMS 模板和前端组件库维护者。产品参数表、用户资料页、文章元信息、发票明细、版权署名，都是 <dl> 可能比表格或普通列表更合适的场景。

和 <table> 相比，<dl> 不适合表达二维数据；和 <ul> 相比，它又能保留“名称—描述”的成组关系。真正的判断标准不是哪个标签更熟，而是内容本身有没有键值或术语说明关系。

接下来要观察的不是浏览器是否“支持” <dl>——主流浏览器渲染早已不是核心问题。更该看的是团队是否会在组件规范里写清使用边界，并用真实屏幕阅读器测试关键页面。语义写对只是起点，能被不同用户稳定理解，才算交付完成。