为什么 <ol> 和 <dl> 不被弃用？答案

【问题标题】：Why are <ol> and <dl> not deprecated?为什么 <ol> 和 <dl> 不被弃用？
【发布时间】：2016-08-15 07:27:07
【问题描述】：

我最近遇到了一种情况，我被困在使用 <ul> 来处理 HTML 列表，但我真正想要的是 <ol>。我绞尽脑汁试图设置一个变量，以便我可以根据需要随时更改它。然后我突然意识到，我可以使用 CSS ul.class {list-style-type: decimal;}。这会让我得到我正在寻找的东西。

但后来我想，为什么我们还要有<ol>？不应该弃用吗？列表类型不是一种独特的样式选择，因此属于样式表吗？至少，这始终是您无法从 HTML 页面复制和粘贴列表项目符号的原因。然后我进一步想知道<dl>。是的，它稍微方便一点，但是您可以使用嵌套的<div>、<p>、<ul> 或<span> 轻松制作相同的效果。

In this other question，似乎有人会争辩说<ol> 和<dl> 具有语义质量。我可以买那个，尤其是<dl>，但是面对不断被告知列表类型是风格，而不是内容，它会飞。是否还有其他我没有看到的原因是为什么它们还没有被弃用？

【问题讨论】：

把这个论点发挥到极致，我们真正需要的只是 div 拥有大量的自定义类和一英里长的样式表……
@deceze 另一个极端是我们完全取消了样式表。你的意思是什么？
您似乎没有考虑到的是可访问性 - 不要忘记并非每个人都以与您相同的方式接收内容，并且那些使用屏幕阅读器的人依赖标签的语义含义。
@skyline3000 屏幕阅读器识别 list-style-type 属性并相应地宣布列表标记。我不知道他们是否仅依赖于此。
既然如此，为什么要保留 ul？列表样式可以通过 display: list-item 应用于 any 元素，因此理论上您可以仅使用 div 重新创建效果，正如您所说的可以使用 dl 元素完成。 @deceze 最初的观点并不像听起来那么极端——即使他是这样描述的。

标签： html css list deprecated semantic-markup

【解决方案1】：

ul、ol 和 dl 之间的区别不仅仅在于这些元素在渲染时的样子。存在巨大的语义差异。这就是为什么不能只弃用它们而支持 ul。

我可以只使用 CSS ul.class {list-style-type: decimal;}。这个会得到我想要的东西。

看，这就是你弄错了。你不会得到完全相同的结果。如果你仅仅因为它们的外观而使用 ol 或 dl，那你就错了。

列表类型不是一种独特的风格选择

绝对不是。当您使用 html 标记时，您应该知道为什么要这样做。所有 3 种类型的列表都有自己的含义和用途。

ul = 无序列表。 元素的顺序根本不重要。
一个基本的例子是购物清单。你不在乎你先买什么，你只想买清单上的所有东西。

ol = 有序列表。 顺序非常具体，先到先得很重要。一个很好的例子是蛋糕的食谱。不能先烤再加入配料。

dl = 描述列表。您通常使用它来包含 键值对，因为它包含术语对及其定义的列表。

当然，当涉及到这些列表的外观时，您可以将一个替换为另一个，然后应用 css 规则。或者甚至使用几个 div/span 标签并从头开始创建它。
然而，当谈到语义标记时，正如我所解释的那样，差异是巨大的。

HTML 中的标签不仅用于包装内容，而且还带有含义。它们描述了我们正在处理的内容类型。例如，当您关心 SEO 时，这一点很重要。

样式表仅用于改变元素在浏览器中的外观，但在解释内容时它们毫无用处。例如，网络爬虫根本不关心 CSS。

【讨论】：

也许你可以扩展你的想法。这是一个一半的答案。
所以你会说原因，可能唯一的原因，是语义？
@fredsbend，是的。因为这些列表是关于不同事物的，所以您不能用一个代替另一个。您可以更改它的外观，但标签的含义将保持不变。如果你需要 ul 看起来像 ol，你可能应该立即使用 ol。
“例如，网络爬虫根本不关心 css。” – 嗯……Google 会；越来越多。反正答案很好。
他们是否评估列表样式并不重要，@deceze。一个 ul 是一个 ul，一个 ol 是一个 ol。我不知道为什么一开始就将 CSS 引入图片中。

【解决方案2】：

面对不断被告知列表类型是样式而不是内容

谁说的？ HTML 标记是语义，它传达意义。总是想象你在解析 HTML 时没有样式表的上下文；说因为您是搜索引擎或因为您正在挖掘数据。那么ol、ul 和dl 之间的语义差异就很明显了。

【讨论】：

我同意。即使完全没有 CSS，网站也应该仍然可以合理使用。
我没有说 HTML 标记不是语义的。您引用了我实际上所说的话，如果您在帖子的前面阅读过，这就是我被告知在查看 HTML 页面时无法复制和粘贴项目符号的原因。我认为您正在关注某些事情，而不是真正回答问题。
@fredsbend 复制和粘贴是客户端实现的事情，它与 HTML 应该做的事情无关。绝对没有理由根本无法复制和粘贴列表；它只需要您的操作系统的剪贴板以及原始应用程序和目标应用程序来适当地支持列表标记。 FWIW，在 OS X 上运行良好：imgur.com/a/j1ADg
@deceze 我们都知道并非所有浏览器都做同样的事情。我很确定 HTML 的目的是以用户友好或可读的方式使内容可见。我认为有一个案例可能包括也可能不包括复制和粘贴。因此，当您在查看网页时选择列表时，浏览器会做出不同的响应。
@fredsbend 错误，是的，当然。但是，如果浏览器/剪贴板/目标根本不支持列表样式或其他任何内容，那么作为网站作者，您将无法避免这种行为。此外，您链接到的文章基本上说您通过 CSS/Javascript 添加的非标准标记和废话越多，复制粘贴行为就越不可预测。

【解决方案3】：

列表标记的类型不一定只是样式选择。作者可能希望使用“参见步骤 F.”来引用有序列表中的列表项。如果此列表标记样式 (upper-alpha) 仅在样式表中定义，则对于不支持 CSS 的用户代理或使用自己的样式表的用户将失败。这就是为什么ol 有一个type attribute¹。

但忽略这一点，ol 和 ul 之间存在语义差异，而不仅仅是表示上的差异。如果您想传达一个列表是（无）有序的，您必须在 HTML 级别执行此操作²。列表标记样式与此无关；你可以有一个带有项目符号的有序列表。

对于dl：您无法用div/p/ul/span 元素³ 或任何其他 HTML 元素来传达 dt/dd 组的语义987654337@，在某种程度上）。名称-值组可以有一个或多个名称 (dt) 和一个或多个值 (dd)，其中 represent alternatives (!)。

¹ 注意：under discussion 在 HTML 5.1/5.2 中使用 type 会发生什么。

² 它也可以是（虚构的）list 元素（<list ordered>、<list unordered>）或其他任何东西的属性，只要它是 HTML 的一部分。因此，您只需将 (ul)/ol 替换为其他一些 HTML 元素/属性。

³ 当然，可以重新定义其他现有的 HTML 元素以传达此含义。但是，同样，这必须发生在 HTML 级别。因此，您只需将 dl 替换为其他一些 HTML 元素/属性。

【讨论】：