1.设计页面的结构 - HTML：这个过程是使用各种HTML元素构建网页的结构。
2.设计页面的外观 - CSS：这个过程是使用CSS去改善网页的外观。
3.设计页面的行为 - Javascript：这个过程是给网页的元素赋予一定的行为。
上面这些除了CSS外，HTML5在另外两个方面都不同程度的进行了扩充。这个系列是集中在第一个方面。在前面，我们已经学习了复杂的canvas和svg元素，下面的章节会总结其他HTML5增加的元素。
结构型元素
HTML5中加入了全新的结构型元素，例如页眉header，页脚footer，导航nav，内容article，章节section等。含义如下图所示：
除了这种整个页面的结构型元素，html5也加入了块级别的语义元素，例如辅助元素aside，图像元素figure，细节描述元素details等。这些元素除了更能显示页面的布局含义外，与普通的div并没有其它的区别，仍然需要靠CSS去展示这些元素。这里就是简单看一个小例子：
| IE 9 | Firefox 3.5 | Opera 10.5 | Chrome 3.0 | Safari 3.0 | |
|---|---|---|---|---|---|
| Ogg Vorbis | √ | √ | √ | ||
| MP3 | √ | √ | √ | ||
| Wav | √ | √ | √ |
audio标签有一些属性用来控制音频的内容、何时以及如何播放等方面的情况，这些属性分别是：src(文件名)、preload(在页面加载时加载)、controls(显示控制)、loop(循环)和autoplay(自动播放)。在下面的例子中，只要页面一加载音频就开会播放，其会持续播放，所提供的控制可以让用户停止或是重新开始播放音频：
| 格式 | IE | Firefox | Opera | Chrome | Safari |
|---|---|---|---|---|---|
| Ogg | No | 3.5+ | 10.5+ | 5.0+ | No |
| MPEG 4 | 9.0+ | No | No | 5.0+ | 3.0+ |
| WebM | No | 4.0+ | 10.6+ | 6.0+ | No |
它拥有audio元素所有的属性，另外再加上：muted(静音)、poster(等待图片)、width和height。最后两个意思不用说了。当视频正在加载或是视频处于完全没有加载的情况中时，poster属性(指定一个绝对的或相对的URL)可让你找出一张图像来应付着先；muted代表静音。
video也支持利用source元素解决兼容性问题。看一个小例子：
指示度量的元素
下面这些元素并不是每个浏览器都支持，但是基本上在Chrome上还可以可以看到效果的。
进度条元素
使用这个元素显示下载的进度条，只有value和max两个属性，非常简单。Chrome和FireFox都支持了。
新增加的元素介绍就是这么多了，更多的元素说明请参看W3C中的完整Tag列表。
实用参考：
W3C的教程：http://www.w3schools.com/html5/default.asp
HTML5官方指导：http://dev.w3.org/html5/html-author/
相当不错的一个指导网站：http://html5doctor.com/
HTML5中文教程：http://www.html5china.com/
一个不错的前端博客：http://www.pjhome.net/default.asp?cateID=1