在我的网络应用程序中，我有一个标题栏，它既是应用程序的面包屑导航，也是当前页面的标题。
所以在标题中你会看到:
App Name > Section Name > Current Page
“当前页面”是页面的 H1 标签。
从可访问性(ARIA 规则)的角度来看，这是否有意义？
这是我的代码:
<header class="route__header">
<nav aria-label="Breadcrumb" class="crumbs">
<a href="" class="crumbs__link">App Name</a>
<a href="" class="crumbs__link">Section Name</a>
<h1 aria-current="page" class="crumbs__link crumbs__link--active">Current Page Name</h1>
</nav>
</header>
这样做的原因是我每个页面有一个 H1 标签，然后内容可以有 H2 和更低的标签。
或者我应该将当前页面保留为 span 标签，并在内容中允许多个 H1 标签吗？
最佳答案
节内的标题属于该节。 nav 元素创建这样一个部分。这意味着“当前页面名称”是导航的标题，而不是页面的标题。但这当然是错误的(导航的标题，如果有的话，可能类似于“导航”)。
这是否会造成实际的可访问性问题无法判断(用户可能会使用利用大纲的工具，甚至可能是自定义工具)。但即使当前不影响可访问性，您也不应违反规范(除非您有充分的理由这样做)。
(顺便说一下，为了可访问性，您应该为面包屑项提供文本分隔符，或者使用像 ol 这样的标记。)
如果您不使用 nav，则可以以符合规范的方式实现您想要实现的目标，例如:
<body>
<header>
<a href="">App Name</a> → <a href="">Section Name</a> →
<h1>Current Page Name</h1>
</header>
</body>
但传统的方法是不将页面标题集成到面包屑中:要么复制当前页面的标签(将其放在标题和面包屑中)，要么省略当前页面的面包屑项。
关于html - 面包屑中的 H1 标签是否可以访问？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48956218/