html - 在导航栏上使用 `aria-expanded` 是否有意义？

Question

_{经过十年的中断之后，我再次涉足网络开发。对我来说，这仍然是一堆非常令人困惑的不断变化的标准，使得我们不清楚哪些浏览器支持什么以及最佳实践是什么。}

目前，我专注于使用 new semantic elements of HTML5 。我发现 ASP.NET Core 默认 Bootstrap 模板不使用 <nav>导航栏的元素，因此正在研究如何正确应用它。

default navbar template in Bootstrap 是否建议使用<nav> 。然而，我很困惑aria-expanded背后的目的是什么。应用于它的属性。之后learning about the benefits it offers to screen readers (指示导航栏是否折叠，在这种情况下，当屏幕尺寸较小时，即对于智能手机)，我仍然很困惑它是否应该存在。 (和 whether or not aria-controls should be applied ，它不在默认引导模板中。)

让我解释一下:

• 其中一些咏叹调属性似乎描述了视觉行为。向失明者描述他们看不到的东西是否有意义？
• 与 <nav>和<main>如果正确应用了语义元素，屏幕阅读器是否已经拥有了快速跳过导航栏所需的所有必要信息(相当于为视力正常的人隐藏了导航栏)？

对于盲人完全隐藏导航切换机制难道不是更好的选择吗？我的问题是，如何解决这个问题。可以隐藏按钮using role="presentation" and/or aria-hidden="true" ？

Answer 1

使用您在 https://getbootstrap.com/examples/navbar/ 引用的示例，它需要 aria-expanded。

在较大的视口(viewport)中，“下拉”菜单隐藏了所有子项目。它们不仅在视觉上隐藏，而且对屏幕阅读器也隐藏。 aria-expanded 有助于为用户提供上下文，无论是否有更多可用的内容，并且还提供一些有关后续制表位可能会将用户带到何处的线索。

在较窄的视口(viewport)中，导航变成了汉堡包，这仍然适用。更是如此，因为它也适用于汉堡本身。

这个上下文很重要，因为 aria-controls 支持是粪便(引用 Heydon)。

在某些情况下，菜单中的每个项目都可以通过选项卡访问，即使在视觉上不存在。在这种情况下，aria-expanded 并不那么重要，但 aria-controls 会有更多值(value)。

另外，该菜单需要为有视力的键盘用户提供更好的 :focus 突出显示，以及菜单的 DOM 序列与狭窄视口(viewport)中的 Logo (这是我的观点)。