nav role=navigation

Question

我对角色有点困惑。如果在我的页面中，我有一个包含在nav元素中的导航，并指定了role="navigation"。

<nav role="navigation">
    ...
</nav>

nav 元素本身不已具有语义明确的导航含义吗？

即使页面上还有其他导航部分，如果我仅为其中一个指定了角色，那么这个部分就成为页面上最重要的部分了吗？而没有role="navigation" 的其他导航就变得无聊了吗？

- Artem Svirskyi

Answer 1

虽然现代浏览器/技术大多数都将HTML5的<nav>元素识别为导航并给予同样的关注，但明确设置role="navigation"属性可以确保更多的技术可以识别它。

例如，对于残疾人用户的屏幕阅读器和其他技术通常很少完全符合标准（特别是如果它们必须向后兼容到IE6或更低版本！），因此明确添加角色属性始终可以确保覆盖尽可能多的用户。

另外（这只是一个猜想），一些较不知名的搜索引擎可能还没有完全认可HTML5，因此添加这些角色应该有助于网站的爬取能力。

- Mike

---

我认为没有任何证据表明任何搜索引擎“识别HTML5”（如nav），更不用说ARIA了。 - Jukka K. Korpela

确实没有“证据”，因为搜索引擎方法的细节非常保密，但标记可用于帮助识别页面结构。我不喜欢假设，但在搜索引擎技术中，它们有时是必要的恶 - 因此我假设他们将利用所有可用的工具来显示最佳结果，我们也应尽力帮助他们这样做。 - Mike

关于您的第二个问题，涉及角色的不同优先级和其他方面，建议您在该主题上进行一些研究，因为有很多信息可供参考。这里有一个不错的概述 here ，可以帮助您入门。如果需要的话，您甚至可以深入阅读官方文档。 - Mike

此外，请参阅http://www.w3.org/TR/html5/dom.html#wai-aria以获取默认映射。 - unor

在2021年，Mozilla表示：“使用<nav>元素将自动通知该部分具有导航角色。开发人员应始终优先使用正确的语义HTML元素，而不是使用ARIA。”（https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Navigation_Role） - djibe

Answer 2

请看W3C的这篇文章，它说：

在大多数情况下，设置与默认隐含ARIA语义匹配的ARIA角色和/或aria-*属性是不必要和不推荐的，因为这些属性已经由浏览器设置好了。

因此，<main role="main">是不必要和不推荐的。 话虽如此，Bootstrap的导航栏示例（包括我在内的每个人都复制粘贴）都使用了<nav role="navigation">。

老实说，我不确定哪个是正确的。

- Albert Vila Calvo

---

似乎不再需要了 - 目前的示例代码为<nav class="navbar navbar-default"> - 另外，W3C验证器也发出警告：'警告：元素nav不需要role属性。' - maxschlepzig

@maxschlepzig 我在过去的一年里没有使用过Bootstrap。随意编辑问题！ - Albert Vila Calvo

Bootstrap v4 alpha 6: “通过使用<nav>元素或者如果使用更通用的元素如<div>，则为每个导航栏添加role="navigation"来明确标识它作为辅助技术用户的地标区域，以确保可访问性。” - Cato Minor

Answer 3

W3C建议：“为了使结构更易于支持ARIA的用户代理访问，并确保不支持HTML5的用户代理也能理解该结构，建议添加ARIA role =“navigation”。”https://www.w3.org/WAI/GL/wiki/Using_HTML5_nav_element

- Hans Grimm

Answer 4

使用<nav>元素将自动指示一个部分具有导航的角色。开发者应该始终优先使用正确的语义化HTML元素，而非ARIA。

来源：MDN关于ARIA: 导航角色的文章

- patternina