html - 语义 HTML5 中的标头

Question

我正在设计我的 HTML 页面的语义标记。该页面由一个主要内容块和一个侧边栏组成。侧边栏中有几个独立的块，如最新消息、链接、统计信息等每个块都有一个带有块名称的标题：“统计”、“链接”等

这个问题。如果我在标签header中放置一个块名称，header如<section id="News"><header>News</header><ul>...</ul></section>.

将部分的名称放在<h*>标签中是否在语义上正确？

选项之间有什么区别，为什么应该使用其中一个选项？

Answer 1

当您使用分段元素（section在您的情况下，但您可能想要使用aside）时，这些部分已经有一个隐式的大纲条目。

您可以使用标题 ( h1- h6) 提供显式条目。

所以是的，您应该使用标题元素 ( h1- h6) 来指定每个块的标题 (→ 部分)。

此外，您可以使用header元素。但这不是必需的（如果您的标题不仅仅包含标题，则使用它是有意义的）。

所以我会选择：

<aside>
  <h1>News</h1>
  <!-- content -->
</aside>

<aside>
  <h1>Statistics</h1>
  <!-- content -->
</aside>

对于复杂的标题：

<aside>
  <header>
    <h1>News</h1>
    <!-- more header content -->
  </header>
  <!-- content -->
</aside>

<aside>
  <header>
    <h1>Statistics</h1>
    <!-- more header content -->
  </header>
  <!-- content -->
</aside>

Answer 2

使用标头是有效的 - 这就是节的使用方式 - 请参阅此定义以了解节的使用https://stackoverflow.com/a/6941170/3529814

Answer 3

这是完全有效的，但如果它只是一个简单的标题，我会说一个H*标签就足够了，并且在语义上是正确的。

如果有几个元素描述了部分内容，例如标题、描述和日期标签或沿着该路径的东西，我会将它们包装在<header>标签中。