在HTML5中，可以嵌套NAV元素吗？

Question

我有一个站点范围的主菜单，我目前正在使用它

<nav>

。我还有一个子菜单，它就在主导航下方，并且对于网站上的每个 product 都是不同的。处理这个问题的最佳做法是什么？

目前，我在主导航下方有一个单独的

<div id="secondary-nav">

。但由于它们都在页面的

<header>

内，我正在考虑使用嵌套的

<nav>

。这在 HTML5 中是正确的做法吗？

Answer 1

在那里使用

nav

是完全可以接受的。您可能还想查看

aside

是否可以删除，或者查看在

section

中使用

nav

标签以更好地划分内容。这又回到了整个语义辩论，我的立场是，如果有道理，就去做。它不需要 100% 语义正确，因为除了查看源代码的人之外没有人知道。

Answer 2

目前规范中没有任何内容表明不允许嵌套

nav

s。并且看到

<nav>

是一个块级元素，嵌套它们没有错。

Answer 3

关于网络可访问性...

NVDA 屏幕阅读器软件似乎可以处理嵌套的地标，例如标题内的导航。 NVDA 快捷键仍然适用于嵌套的地标元素。

“地标角色可以嵌套以识别所呈现信息的父/子关系。”

“如果一个页面包含多个导航地标，每个导航地标都应该有一个唯一的标签。”

“如果导航地标与页面上的另一个导航地标具有相同的链接集，请为每个导航地标使用相同的标签。”

ARIA 地标示例

我会说，基于这些信息，当您有子菜单时，嵌套导航可能非常合适。