2

我在问自己对博客条目列表的标记。

可能是这样的：

情况1 ：

<article>...</article>
<article>...</article>
<article>...</article>

或案例 2：

 <ol reversed>
    <li><article>...</article></li>
    <li><article>...</article></li>
    <li><article>...</article></li>
 </ol>

该示例似乎是逻辑：“它是按 desc 日期排序的条目列表”

另一个示例是使用产品的重要步骤列表：

<ol>
     <li><section><h1>step 1</h1></section></li>
     <li><section><h1>step 2</h1></section></li>
     <li><section><h1>step 3</h1></section></li>
</ol>

要获得如下大纲：

product name
    description
    how to use
       step 1
       step 2
       step 3
    customer reviews
    etc

您是否认为此内容的标记过多？

我的目的是获得最好的 HTML5 语法和大纲，但我不想用无用的标签填充 HTML。

编辑：真正的问题不是什么更好，而更像是了解开发人员对这种不同方式的看法。因为有很多方法可以做事，但有时如果两种方法都是正确的，那么可能会有一种更“合乎逻辑”或“相关”的方法来做。

4

2 回答 2

2

ol只能在“改变顺序会改变含义”时使用。仅仅因为内容以某种方式排序并不一定意味着这ol是适当的。

如果您应该使用列表（是否ol）ul取决于您的实际内容及其上下文，通常无法回答。HTML5 规范将这些列表定义为“项目列表”，但没有指定列表是什么或有资格作为item。

一个可能/主观的经验法则（有许多例外）：查看您的内容并问自己是否将其称为列表，以及是否可以用典型的要点来描绘它。

一个标题为“博客”的页面，显示 10 篇全文博客文章？可能不是。
一个标题为“相关文章”的侧边栏，显示 10 个博客文章链接？大概是。

这表明内容的“复杂性”也可能发挥作用，因此另一个可能/主观的经验法则（甚至更多例外）：如果一个项目有一个标题（即，它是一个部分）和长内容，你可能不需要清单。

使用产品的步骤，其中每个步骤都包含带有图像的长解释？可能不是。
使用产品的步骤，每个步骤都包含一个简短的句子？大概是。

于 2014-12-30T04:58:09.753 回答
0

同意unor。

根据标准：

虽然它符合在 li 元素中包含标题元素（例如 h1），但它可能没有传达作者想要的语义。标题开始一个新的部分，因此列表中的标题隐式地将列表拆分为跨越多个部分。

https://html.spec.whatwg.org/multipage/grouping-content.html#the-li-element

所以我认为如果内容可以有标题 - 将其包含在列表中是不合适的。

于 2021-02-10T21:05:25.760 回答