HTML5 <nav> 元素能否用于对过滤或重新排序主要内容的链接进行分组？

Posted 2023-04-12

【中文标题】HTML5 <nav> 元素能否用于对过滤或重新排序主要内容的链接进行分组？

【英文标题】：Can the HTML5 <nav> element be used to group links that filter or reorder main content?

【发布时间】：2012-05-06 08:08:31

【问题描述】：

我们的网站有两个指向两个完全不同页面的主要导航链接。像这样的：

<section>
    <header>
        <nav>
            <ul>
                <li><a href="link1.html">Link 1</a></li>
                <li><a href="link2.html">Link 2</a></li>
            </ul>
        </nav>
    </header>
</section>

在其中一个页面上，我们还有一个由链接列表组成的过滤组件，这些链接使用 Ajax 更改主要内容区域中列出的结果集（类似于 kayak.com 如何实时过滤他们的航班选项当您调整滑块、单击复选框等时）

我的问题是，该组过滤链接是否应该包含在 <nav> 元素中？

看起来像这样：

<section>
    <nav>
        <ul>
            <li><a href="#filter1">Filter 1</a></li>
            <li><a href="#filter2">Filter 2</a></li>
            <li><a href="#filter3">Filter 3</a></li>
            <li><a href="#filter4">Filter 4</a></li>
            <li><a href="#filter5">Filter 5</a></li>
        </ul>
    </nav>
</section>

让我困惑的原因是the spec不清楚通过过滤等方法对页面内容进行实质性更改是否构成“主要导航”。另外，从可访问性的角度来看，我不确定在页面上有两个这样的导航元素是否会在语义上造成混淆。

【参考方案1】：

你可以，但它在语义上不正确。我会在这里使用command 标签，因为您不是在浏览内容，而是根据某些标准发出命令来显示/隐藏某些内容。

【讨论】：

感谢您的更新，我希望有办法为您提供代表。

这里不是刻薄的，但我很好奇您（以及其他任何徘徊于此的人）的想法。如何过滤内容以找到您想要的内容，即“给出显示/隐藏某些内容的命令”与带有列出类似功能的下拉菜单的导航栏不同。我在想博客上的类别之类的东西，这些类别通常位于某种类型的菜单中，过滤器也可能使用这些类别。