HTML5 - 文章结构：章节和标题答案

【问题标题】：HTML5 - Article Structure: Sections and HeadersHTML5 - 文章结构：章节和标题
【发布时间】：2014-08-20 16:21:53
【问题描述】：

我发现了很多关于 HTML5 最佳实践的相互矛盾的信息，我想知道我的文章结构是否正确。通常，此站点上的页面由带有导航、文章和页脚的页眉组成。

这是我的基本结构：

<body>
    <header>Header content
        <nav>Navigation</nav>
    </header>
    <article>
        <header>
            <h1>Beans, beans</h1> <!--Main title for article-->
            <h2>Good for your heart?</h2> <!--Subtitle for article-->
        </header>
        <section>
            <header>
                <h3>Legume-based Flatulence</h3> <!--Section title-->
            </header>
            <p>Lorem ipsum beans beans beans.</p>
        </section>
        <section>
            <header>
                <h3>Gas and Good Feelings</h3>
            </header>
            <p>Correlation does not imply causation.</p>
            <footer> <!--Section footer for sources or...?-->
                Source: Phenomenological Farts, a Study in Siena
            </footer>
        </section>
        <section>
            <header>
                <h3>Beans for Every Meal?</h3>
            </header>
            <p>This is probably a terrible idea.</p>
        </section>
        <footer> <!--Article footer for additional downloads, etc-->
            <a href="#">Download this article!</a>
        </footer>
    </article>
    <footer>
        Footer content.
    </footer>
</body>

这有意义吗？在文章的部分中使用页眉和页脚是否可以接受？

【问题讨论】：

标签： html

【解决方案1】：

如果您不确定其他标签中允许使用哪些标签，只需查看w3.org 的规范即可。或者通过validator 运行您的代码。 The spec 声明section、header 和article 标签可以在任何允许flow elements 的容器内使用。所以到目前为止你所拥有的都是有效的。

【讨论】：

谢谢 - 我不太关心其他人允许使用哪些标签（已经熟悉了）。我更关心遵循最佳实践。也许“可接受”是我在问题中使用的错误术语。
imo - 我认为如果您的 html 结构易于阅读，并提供您所追求的布局，那么一切都很好！

【解决方案2】：

我打算推荐 <hgroup> 来对标题进行分组，但它不再是：http://www.webmonkey.com/2013/04/w3c-drops-hgroup-tag-from-html5-spec/。也许使用header 代替它。来自 W3C 的更多信息和建议：http://www.w3.org/html/wg/drafts/html/master/common-idioms.html#sub-head

然后，我还会将您的其他 h3s 更改为 h2s，因为它们是节标题。

最后一个由hx 组成的header soley 有点多余。

更多关于Headers和Footers

【讨论】：