我确定这是重复的，但我刚刚花了 15 分钟在 Google 上搜索、阅读 W3C 文档和大量可访问性网页，但我并不明智，所以我觉得我们需要使用这些 Google 关键字提出问题 :)
我有一个简单的个人主页。现在我的 HTML 是这样的：
<header>
<h1>My Name</h1>
</header>
<main role="main">
<h2>Writing</h2>
// hundreds of links
<h2>About</h2>
</main>
我想以某种方式标记“写作”和“关于”部分，以便使用屏幕阅读器的人在进入“关于”部分之前不必听“写作”部分中的数百个链接。
上面的 HTML 是否足够容易让屏幕阅读器浏览？或者我应该使用额外的标签，以便屏幕阅读器在需要时更容易跳过？
【问题讨论】：
标签： html accessibility
您正在使用标题标签 (h1, h2)，所以这对屏幕阅读器有很大帮助。跳转到不同的标题很容易。
地标也不错。您可以使用
所以任何一个都可以。
但不要忘记仅使用键盘的用户。如果您有一堆导航链接，最好让键盘用户跳过该部分。您可以使用旁路链接来做到这一点。以 webaim.org 为例。只需打开他们的网站并点击 TAB。你会看到一个红色的“跳到主”链接出现。效果很好。
【讨论】：
<nav> 或 role="navigation" 或绕过链接？
<nav> 还是role='navigation'，都不会影响您的代码行为。见w3.org/TR/aria-in-html/#role-not。这些标签给你的唯一东西是辅助技术的更多语义含义。您必须编写自己的旁路块。正如我所提到的，以 webaim.org 为例并使用键盘对其进行测试。
您可以使用以下方法让屏幕阅读器用户更轻松地进行页面导航：
在适当的地方使用标题元素 (h1-h6)。
它允许用户从一个标题跳转到另一个标题。
（你已经在使用它了。）
在适当的情况下使用分段元素（例如，section、article 等）。
默认情况下，它们具有 WAI-ARIA 区域映射。您的写作部分可能会获得region 角色。您的 About 部分可能会获得 contentinfo 角色，但这取决于内容是否合适。
它允许用户跳转到（或跳过）特定区域。
使用指向某些标题/部分的链接 (a)。
根据页面内容，它可能是一个 ToC（类似于 Wikipedia 用于较长文章的内容），或者只是一个或多个跳过链接。在您的情况下，您可以提供一个链接，上面写着“跳转到 About 部分”，但如果您可以提供菜单，则带有两个部分链接的 nav 元素可能是更好的选择（它默认获得navigation 角色）。
它允许用户跳转到（或跳过）特定部分。
所以您的示例可能如下所示：
<header>
<h1>My Name</h1>
</header>
<nav>
<ul>
<li><a href="#writing">Writing</a></li>
<li><a href="#about">About</a></li>
</ul>
</nav>
<main>
<section id="writing">
<h2>Writing</h2>
<!-- hundreds of links -->
</section>
<section id="about">
<h2>About</h2>
</section>
</main>
（请注意，should 仅在使用非默认值时才使用 role 属性（用于 WAI-ARIA）。所以我从 main 元素中删除了它，因为它具有 main 角色默认情况下。）
【讨论】：
将ARIA landmark 指定的<nav> HTML 标记与分层部分链接一起使用将帮助您的用户更轻松地跳过指定部分。对于非 HTML5 代码，您也可以使用role="navigation" 作为替代。
我发现this stack overflow link 对理解层次结构的基础知识很有帮助。
【讨论】：
<nav>，但我真的很难找到任何明确的信息。我确实点击了链接，但它没有解释在哪里使用<nav> 标签或如何标记它们。我确定这是我昏暗的。但是您能否准确解释一下如何将标签添加到我的页面以使其更易于访问？