只在需要的时候使用<hgroup>和<header>标签
使用标记的时候写入了一些并不需要的现象这是不合理的。不幸的是，经常发现大家在并不需要的地方使用<hgroup>和<header>标签。你可以跟进我们关于和的最新进展，下面是我的简单归纳：
<header>元素通常是通常作为一组解释或者导航辅助工具,通常包含section的标题.
<hgroup>元素会将当有副标题\子标题,各类标识文字时,对<h1>到<h6>标题进行群组,将其作为section的标题.
过度使用的<header>
你肯定知道,在一个文档中,可以使用多次标签,下面就是一种很受大家欢迎的模式:
1 <!-- Don’t copy this code! No need for header here -->
2 <article>
3 <header>
4 <h1>My best blog post</h1>
5 </header>
6 <!-- Article content -->
7 </article>
2 <article>
3 <header>
4 <h1>My best blog post</h1>
5 </header>
6 <!-- Article content -->
7 </article>
如果你的<header>标签只包含一个标题元素时,就不要使用<header>标签了.<article>标签肯定会让你的标题在文档大纲中显现出来,而且因为并不包含多重内容(就像定义中描述的那样子),我们为何要增加而外的代码呢?应该像下面这样简单才可以:
1 <article>
2 <h1>My best blog post</h1>
3 <!-- Article content -->
4 </article>
2 <h1>My best blog post</h1>
3 <!-- Article content -->
4 </article>
<hgroup>不合理使用
在标题的这个主题上,经常看到使用的错误案例.在下面这种情况下你不能将<header>标签和<hgroup>标签一起使用:这里只有一个标题,或者<hgroup>本身就够了(比如:不需要<hgroup>).
第一种情形看上去是下面的样子:
1 <!-- Don’t copy this code! No need for hgroup here -->
2 <header>
3 <hgroup>
4 <h1>My best blog post</h1>
5 </hgroup>
6 <p>by Rich Clark</p>
7 </header>
2 <header>
3 <hgroup>
4 <h1>My best blog post</h1>
5 </hgroup>
6 <p>by Rich Clark</p>
7 </header>
这种情况下,将<hgroup>移除,只保留标题就好.
第二种情况也是包含了他们并不需要的标签.
1 <!-- Don’t copy this code! No need for header here -->
2 <header>
3 <hgroup>
4 <h1>My company</h1>
5 <h2>Established 1893</h2>
6 </hgroup>
7 </header>
2 <header>
3 <hgroup>
4 <h1>My company</h1>
5 <h2>Established 1893</h2>
6 </hgroup>
7 </header>
当<header>标签的子元素只有<hgroup>的时候,为什么我们还需要一个额外的<header>?如果没有额外的元素放到<header>中(比如<hgroup>的兄弟元素),我们直接将<header>元素去掉就好.
1 <hgroup>
2 <h1>My company</h1>
3 <h2>Established 1893</h2>
4 </hgroup>
2 <h1>My company</h1>
3 <h2>Established 1893</h2>
4 </hgroup>
