HTML 头部标签顺序错误答案

【问题标题】：HTML head tags in wrong orderHTML 头部标签顺序错误
【发布时间】：2011-07-08 23:47:07
【问题描述】：

在这个布局中它是无效的，因为 H1 不是第一个渲染的 head 元素......这是一个可怕的罪过还是可以？有任何解决这个问题的方法吗？两列都是可变长度的，所以我看不出有什么办法。

引用

有人让我引用这个：

http://www.w3.org/WAI/ER/IG/ert/ert-19991221.html#Technique3.5.A

应检查标题元素（H1-H6）以确保它们按照以下规则嵌套文档中的第一个 header 元素必须是 H1 文档中必须只有一个 H1 元素标题级别不能增加超过 1 级。示例：H1 之后的 H2 是好的。 H1 之后的 H3 不好。标题元素可以减少任何级别。示例：H2 跟随 H5 即可。

【问题讨论】：

完全取决于文档的语义。你能解释一下每个标题描述的内容吗？
@eric，这是一个有效的 URL：69.24.73.172/demos/newdemo 使用该布局
Ta。愿意使用 HTML5 来获得更多语义含义吗？
@eric，是的，我想让这份文档尽可能易于访问且语义正确
另外，您可能想查看html5 outliner

标签： html css header semantics

【解决方案1】：

不同标签的渲染位置并不重要，这完全取决于语义。 H1 只是表示标题高于H2、H3 等。

【讨论】：

一些严格的 HTML 分析器指定 H1 应该是页面上的第一个 Hx 标记。
你说得对，我看过其中一些，但其他人在乎吗？当然，你可能会想办法把你的H1 放在其他所有东西之前，然后使用一堆 CSS 来让你想要的东西定位，但我相信找到一个 HTML 解释器需要更长的时间（浏览器，搜索引擎蜘蛛，......）实际上关心这个细节。用你自己的话回答你的问题：不，这不是一个可怕的罪;）
W3C 验证器没有 Hx 标签“无序”（严格）的问题
@jakub，我添加了对问题的引用

【解决方案2】：

<h2>s 应该可以解释为某些<h1> 的子标题。

在 HTML5 中，您可以通过嵌套 <section> 标签来定义文档层次结构，并完全忽略 <h1> - <h6> 标签。你可以看到一个 HTML5 文档大纲 here，它说明了这个属性。

当然，最简单的解决方法是让列以其他顺序浮动。目前它们都向左浮动。切换标记中的顺序，让它们向右浮动，突然之间，标题的顺序就正确了！

^{顺便说一句，your site 的“本周聚焦”部分的语义是错误的。应该更像this}

【讨论】：

但是一页应该只有一个H1吧？这就是为什么它应该是第一个呈现的标题。

【解决方案3】：

我不知道 H1 不是页面上的第一件事有多大意义。我知道谷歌会查看标题以尝试建立上下文。例如，他们说应该只有一个 H1 标签，并且它应该是一个很好的短标题来描述页面的内容。一般而言，h1 下方的文本（或副标题）应该会越来越详细地描述您的内容。无论如何，这就是理论。

无论如何，这样的事情呢？

<body>
    <div style="float: right; width: 25%;">
        <h1>your h1 text</h1>   
    </div>
    <div style="float: left; width: 75%;">
        content goes here
    </div>
</body>

【讨论】：