logo标签列表

HTML5文档中多个<header>和<footer>的含义

htmlaccessibilitysemantic-markup
7

在HTML 5中，使用多个<header>和<footer>是否合适？如果是，那么这不符合语义化标准，会不会让移动端读者感到困惑呢？

我看到很多网站都这样使用。

<body class="home">
    <header class="hd1">
        <hgroup>
        <h1>HTML5 Documnet</h1>
        <h2>tagline</h2>
        </hgroup>
    </header><!-- .hd1 -->
    <div class="main">
        <section class="hs1">
            <header>
            <h1>This is a Page Sub Title</h1>
            </header>
    
            <p>Some content...</p>
            <h2>Demonstrating EM and STRONG</h2>
            
            <p><strong>This text will have more importance (SEO-wise and contextually)</strong></p>         
            
            <footer>
            <p>Author: <cite>Louis Lazaris</cite></p>
            </footer>

        </section>
    </div><!-- .main -->
    <footer class="f1">
    <p>copyright &copy; year</p>
    </footer><!-- .f1 -->

</body>
1个回答
6
是的，可以使用多个<header>和<footer>元素。它们的使用方式不同于大多数人用来表示<div id="header">。严格来说，header和footer代表一个部分的页眉和页脚。部分指页面上的一段内容，例如包含页眉标签<h1>和内容的文章，以及页脚的版权、引用等内容。
从规范中可以了解到：
引用如下:

header元素通常意味着包含部分标题（h1–h6元素或hgroup元素），但这不是必需的。header元素也可以用于包装部分目录、搜索表单或任何相关的标志。

footer元素代表最近祖先分区内容或分区根元素的页脚。页脚通常包含关于其部分的信息，例如作者信息、相关文档链接、版权数据等。

直接在规范中查看：http://dev.w3.org/html5/spec/Overview.html 请注意，正如我所说，它们并不像人们使用<div id="header/footer">创建部分那样，规范中提到了这种混淆：
引用如下:
元素不是分区内容，它不会引入新的部分。
因此，在规范的角度来看，“严格”说起来，您所使用的“最后一个”页脚将引入新的部分，这并不是语义化的。
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接