结构 | 张啸

在HTML5中，为了使文档的结构更加清晰明确，追加了几个与页眉、页脚、内容区块等文档元素相关联的结构元素。需要说明的是，本文所讲的内容区块是指将HTML页面按逻辑进行分割后的单位。例如对于书籍来说，章、节都可以称为内容区块；对于博客网站来说，导航菜单、文章正文、文章的评论等每一个部分都可称为内容区块。

一、新增的主体结构元素

article元素、section元素、nav元素、aside元素

二、新增的非主体结构元素

header元素、hgroup元素、footer元素、address元素

三、time元素与微格式

1. 微格式

微格式是一中利用HTML的class属性对网页添加附加信息的方法，附加信息例如新闻事件发生的日期和时间、个人电话号码、企业邮箱等。

微格式并不是在HTML5之后才有的，在HTML5之前它就和HTML结合使用了，但是在使用过程中发现在日期和时间的机器编码上出现了一些问题，编码过程中会产生一些歧义。HTML5增加了一种新的元素来无歧义的、明确的对机器的日期和时间进行编码，并且以让人易读的方式来展现它。这个元素就是

2. time元素。

time元素代表24小时中的某个时刻或某个日期，表示时刻时允许带时差。它可以定义很多格式的日期和时间，如下所示：

<time datetime="2010-11-13">2010年11月13日</time>
<time datetime="2010-11-13">11月13日</time>
<time datetime="2010-11-13">我的生日</time>
<time datetime="2010-11-13T20:00">我生日的晚上8点</time>
<time datetime="2010-11-13T20:00Z">我生日的晚上8点</time>
<time datetime="2010-11-13T20:00+09:00">我生日的晚上8点的美国时间</time>

编码时机器读到的部分在datetime属性里，而元素的开始标记与结束标记中间的部分是显示在网页上的。datetime属性中日期与时间之间要用“T”文字分隔，“T”表示时间。请注意倒数第二行，时间加上Z文字表示给机器编码时使用UTC标准时间，倒数第一行则加上了时差，表示向机器编码另一地区时间，如果时编码本地时间，则不需要添加时差。

pubdate属性是一个可选的、boolean的属性，它可以用到article元素中的time元素上，意思是time元素代表了文章或整个网页的发布日期。

四、显式编排、隐式编排

显式编排：显式编排是指明确使用section等元素创建文档结构，在每个内容区块内使用标题（h1-h6，hgroup等）。

<body>
    <h1>网页级内容区块标题</h1>
    <p>网页级内容区块的正文</p>
    <section>
        <h2>section级内容区块的标题</h2>
        <p>section级内容区块的正文
    </section>
</body>

隐式编排：隐式编排是指不明确使用section等元素，而是根据页面中所书写的各级标题（h1-h6，hgroup等）把内容区块自动创建出来。因为HTML5分析器只要看到书写了某个级别的标题，就会判断存在相对应的内容区块。

<body>
    <h1>网页级内容区块标题</h1>
    <p>网页级内容区块的正文</p>
    <!-- 分析器根据h2等元素判断生成内容区块 -->
    <h2>section级内容区块的标题</h2>
    <p>section级内容区块的正文</p>
</body>

将这两种编排方式进行对比，很明显，显式编排更加清晰、易读。因为隐式编排容易让自动生成的整个文档结构与想要的文档结构不一样，而且也容易引起文档结构的混乱，所以请尽量使用显式编排。

参考文献

《HTML5与CSS3权威指南》