头部和底部标签应该放在主标签内吗？

Question

我正在使用main标签 - 我应该将我的头部（header）和脚部（footer）标签放在main标签内还是它们应该是独立的？

此外，main标签需要添加role="main"吗？

- panthro

---

请查看http://html5doctor.com/the-main-element/。 - Gabriele Petrioli

这取决于它们是特定页面内容的页眉和页脚（是）还是网站的页眉和页脚（不是）。 - Francisco Presencia

Answer 1

来自HTML5doctor文章 The main element @Gaby aka G. Petrioli

简述

经验法则：

• 每页只能有一个<main>；
• 顶级元素（在大多数情况下）；
• 不要将网站的标题/菜单/页脚（重复的内容）放在<main>中。
• 如果特定，则可以包含文章标题/页脚。

目的

<main>的主要目的是将ARIA的地标角色main映射到HTML中的一个元素。这将帮助屏幕阅读器和其他辅助技术了解主要内容的开始位置。 W3C规范描述为：

规范说明

这是草案规范所说的：

主要内容区域包括与文档的中心主题或应用程序的核心功能直接相关或扩展的内容。

页眉/页脚 排除网站的页眉/页脚/菜单：

排除一组文档中重复出现的内容，例如站点导航链接、版权信息、站点标志和横幅以及搜索表单（除非文档或应用程序的主要功能是搜索表单）。

继续使用role ='main' 但是在本文中，史蒂夫·福克纳还写道：

在所有浏览器将角色映射到<main>元素之前，仍应使用ARIA角色。

- Édouard Lopez

---

感谢提供的信息，这让问题变得非常清晰。我想在我的主要元素中使用一个标题元素来描述仅限于主内容的标题（我已经有另一个标题标签用于顶部导航栏）。看起来这不应该会产生问题，并且有助于更具体地描述。谢谢，最佳答案！ - BDB88

Answer 2

由于它代表页面的核心部分 - 如果你愿意的话，就是页面的"肉" - 而且标题和页脚被认为是相邻内容，我认为标题和页脚不应该是子元素。

理论上，是的，使用<main>的意思与添加role="main"是一样的。但由于目前的支持有限，建议使用<main role="main"> 。

- janfoeh

---

永远不要在具有相同名称的元素上使用role=属性。该属性用于辅助技术和已经具有该名称的元素自动与角色相关联。因此，永远不要在<footer role="footer">或<main role="main">中使用它，这是毫无意义且被认为是一种不良实践。 - pjk_ok

Answer 3

请查看规范，它对此有很好的解释：http://www.w3.org/html/wg/drafts/html/master/grouping-content.html#the-main-element 作者不得将main元素作为

、

、

、

或

元素的后代。

规范只提到main不能嵌套在上述元素中，但没有关于反过来的限制。我认为，在大多数情况下，header和footer应该与main完全分开。 main包含您的“主要内容”，而页眉和页脚通常与此分开。

至于ARIA角色，它应该是隐式的，但暂时建议您手动赋予它角色。正如规范所说：

作者被建议在main元素上使用ARIA role="main"属性，直到用户代理实现所需的角色映射。

- Nix

Answer 4

有很多方法可以解释语义，但我建议使用头部和尾部作为单独的元素，不要放在主标签中间，而是放在中间。

<header></header>
<main role="main"></main>
<footer></footer>

但我相信你想要做的方式也不会错。

<main role="main">
<header></header>
<footer></footer>
</main>

- Malthe