Question

页眉应代表页面的结构，并进行相应的嵌套。 w3.org声明以下内容：

固定页面部分的例外情况

在页面的固定部分中，例如在侧边栏中，标题等级不应随内容区域中的等级而变化。在这种情况下，跨页面的一致性更为重要。

模式对话框也是如此吗？毕竟，它们通常通常都不是实际页面结构的一部分。模态对话框应该使用哪个标题？

引导程序似乎always use h5s。

作为示例，我们在页脚中使用引导程序模式，该模式显示有关应用程序版本的其他信息：

<div id="v-modal" class="modal fade" tabindex="-1" role="dialog">
  <div class="modal-content">
    <div class="modal-header">
      <h5 class="modal-title">Version</h5>
    </div>
    <div class="modal-body">
      <p>Copyright © 2020 Foobar</p>
      <p>Version 1.3.7124.19131</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-secondary" data-dismiss="modal" aria-label="Close">Close</button>
    </div>
  </div>
</div>

我们最近在一次11y测试中将其标记为潜在问题。

Answer 1

由于HTML 5.1即将进行更改（我们不知道多个H1是否仍然有效以及HTML中的位置），因此我始终建议每页始终{@ {1}}可访问性（和SEO），因为这是长期存在的公认做法。

这使您在使用<h1>的情况下得到答案。

我建议您这样做，因为您的模式位于文档其余部分之外，因此从逻辑上讲应该是“顶层”标题级别。

唯一的例外是，如果您的模式在文档流中，那么最好使用适合其在文档流中位置的<h2>级别。

尽管我不确定为什么有人会希望在文档流中使用模式，因为这首先不是一个好习惯。

我们应该为模式对话框选择哪个标题？

1 个答案: