html - 将 <article> 放在 <li> 中是一个好习惯吗?

标签 html html-lists accessibility semantics article

通常在博客的首页上,有几篇最近的博文,每篇博文都是一个<article>。 .通常博客评论使用 <article> 标记s也是。

我的问题是:将那些 <article> 放在一起是一种好的做法吗?里面的<li>秒?我曾经这样做是因为在我自己的解释中那些 <article> s一起以一定的数量/数量的方式呈现。因此,当涉及到列出一定数量/数量的元素时,<ul><ol>是最好的选择。

但是,也许我需要重新考虑我的解释,因为把 <article>里面的<li> s 似乎是对 <li> 的误用.我还想考虑可访问性。我不确定这样做是否会对辅助技术造成混淆。

最佳答案

问题实际上归结为:什么构成列表?如果它是一个文章列表,那么它应该使用 <li> 进行标记。 .屏幕阅读器用户的优势在于屏幕阅读器可以使用语义标记来传达有用的信息。例如,告知用户他们刚刚进入“5 项列表”有助于他们了解内容的组织方式以及内容的数量。

也就是说,如果列表中的每个项目都非常长或包含具有大量嵌套元素的复杂内容,我同意@IanY 这可能会造成混淆,因为用户很难跟踪它们在其中的位置列表。

当内容 block 相对较大时,如果有视力的用户不太可能查看该内容并将其识别为项目列表,那么您不应使用 <li> .如果你使用 <article>以及标记文章标题的标题,提供足够的语义以方便屏幕阅读器用户导航。

关于html - 将 <article> 放在 <li> 中是一个好习惯吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16213214/

相关文章:

ios - 使 UIButton 在 TableView header 中可访问(可访问性)

html - 如何防止 JAWS 在必填字段上说 "invalid entry"?

html - 如何在 SVG 中为外部图像添加替代文本?

javascript - 带有 `crossOrigin="匿名 "` can' t 的图像标签从 S3 加载成功

css - 带CSS的圆形导航动画?

html - 设置无序列表和填充样式时出现异常 : 0

css - 当一个 li 元素插入 ul 的高度时,li 元素不会扩展到 ul 元素的高度

jquery - Window.scroll 在 iframe 中

html - CSS JSP - 下拉菜单在子菜单焦点上保持打开

javascript - 从 Chrome 扩展弹出窗口中获取值(value)