假如你还是没办法确定用哪种元素，那样我建议你参考HTML5 sectioning content element flowchart。

2、只在需要的时候用header和hgroup

写无需写的标签当然是毫无意义的。不幸的是，我常常看到<header>和<hgroup>被无意义的滥用。你可以阅读一下关于<header>和<hgroup>元素的两篇文章做一个详细的认知，其中内容容易概要如下：

<header>

因为header可以在一个文档中用多次，可能使得如此代码风格遭到欢迎：

<!-​​- 请勿复制这段代码！此处并无需header --><article> <header> <h1>My best blog post</h1> </header> <!-- Article content --></article>

假如你的<header>元素只包括一个头部元素，那样丢弃<header>元素吧。既然<article> 元素已经保证了头部会出目前文档概要中，而<header>又不可以包括多个元素（如上文所概念的），那样为何要写多余的代码。容易点写成如此就好了：

<article> <h1>My best blog post</h1> <!-- Article content --></article>

<hgroup>的错误用

在headers这个主题上，我也常常看到hgroup的错误用。有时不应该同时用<hgroup>和<header>:

第一个问题通常是如此的：

<!-​​- 请勿复制这段代码!此处无需hgroup --><header> <hgroup> <h1>My best blog post</h1> </hgroup> <p>by Rich Clark</p></header>

此例中，直接拿掉hgroup，让heading 裸奔吧。

<header> <h1>My best blog post</h1> <p>by Rich Clark</p></header>

第二个问题是另一个非必须的例子：

<!-​​- 请勿复制这段代码!此处无需header --><header> <hgroup> <h1>My company</h1> <h2>Established 1893</h2> </hgroup></header>

假如<header>唯一的子元素是<hgroup>，那还要<header>干神马？假如<header>中没其他的元素（譬如多个<hgroup>），还是直接拿掉<header>吧。

<hgroup> <h1>My company</h1> <h2>Established 1893</h2></hgroup>

关于

3、不要把所有列表式的链接放在nav里

Not all groups of links on a page need to be in a nav element — the element is primarily intended for sections that consist of major navigation blocks. In particular, it is common for footers to have a short list of links to various pages of a site, such as the terms of service, the home page, and a copyright page. The footer element alone is sufficient for such cases; while a nav element can be used in such cases, it is usually unnecessary.

伴随HTML5引入了30个新元素（截止到原文发布时），大家在架构语义化和结构化的标签时的选择也变得有的不慎重。也就是说，大家不应该滥用超语义化的元素。不幸的是，nav就是如此一个被滥用的例子。nav元素的规范描述如下：

The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links.

nav元素表示页面中链接到其他页面或者本页面其他部分的区块；包括导航连接的区块。

User agents (such as screen readers) that are targeted at users who can benefit from navigation information being omitted in the initial rendering, or who can benefit from navigation information being immediately available, can use this element as a way to determine what content on the page to initially skip or provide on request (or both).

WHATWG HTML spec

注意：不是所有页面上的链接都需要放在nav元素中——这个元素本意是用作主要的导航区块。举个具体的例子，在footer中常常会有海量的链接，譬如服务条约，主页，版权声明页等等。footer元素自己已经足以应对这类状况，虽然nav元素也可以用在这里，但一般大家觉得是非必须的。

规范中将<figure>描述为“一些流动的内容，有时会有包括于自己的标题说明。通常在文档流中会作为独立的单元引用。”这正是figure的美妙之处——它可以从主内容页移动到sidebar中，而不影响文档流。这类问题也包括在之首要条件到的HTML5 element flowchart中。

重要的词汇是“主要的”导航。当然大家可以互相喷上一整天什么叫做“主要的”。而我是如此概念的：

既然并没绝对的对错，所以依据一个非正式投票与我一个人的讲解，以下的状况，不管你放不放，我反正不放在<nav>中：

假如你不确定是不是要将一系列的链接放在<nav>中，问你一个人：“它是主要的导航吗？”为了帮你回答这个问题，考虑以下最重要原则：

假如这类问题的答案是“不”，那就跟<nav>鞠个躬，然后一个人离开吧。

4、figure元素的常见问题

<figure>与<figcaption>的正确用，确实是难以驾驭。让大家来看看一些容易见到的错误。

不是所有些图片都是<figure>上文中

我曾告诉各位不要写非必须的代码。这个错误也是同样的道理。我看到不少网站把所有些图片都写作figure。看在图片的份上请勿给它加额外的标签了。你只不过叫你自己蛋疼，而并不可以使你的页面内容更明确。

不要把figure局限于图片。web标准的职责是精确的用标签描述内容。

假如纯粹只不过为了呈现的图，也不在文档其他地方引用，那就绝对不是

<!-​​- 请勿复制这段代码!这是错的--><header> <h1> <figure> <img src="/img/mylogo.png" alt="My company" class="hide" /> </figure> My company name </h1></header><!-​​- 请勿复制这段代码!这也是错的--><header> <figure> <img src="/img/mylogo.png" alt="My company" /> </figure></header>

<header> <h1>My company name</h1> <!-​​- More stuff in here --></header>

<!-​​- 请勿复制这段代码!它太沉余了! --><link type="text/css" rel="stylesheet" href="css/styles.css" /><script type="text/javascript" src="js/scripts" /></script>

<link rel="stylesheet" href="css/styles.css" /><script src="js/scripts" /></script>

<!-​​- 请勿复制这段代码! 这是错的! --><input type="email" name="email" required="true" /><!-​​- 另一个错误的例子--><input type="email" name="email" required="1" />

<!-​​- 请勿复制这段代码! 这是错的! --><input type="email" name="email" required="false" />

requiredrequired=""required="required"

<input type="email" name="email" required />