Question

说实话，我发现在HTML 4.01网页中添加视频或音频媒体完全是一种折磨。不是因为它很难，而是很麻烦。HTML5使这件事情变简单了。添加多媒体的语法和添加图片类似：

对很多网页设计师来说简直如沐春风！不再需要向网页中引入一大堆代码，在HTML5中只需要一个<video></video>标签（音频使用<audio></audio>标签）就能搞定这种吃力活。还可以在开始标签和结束标签之间插入文字用以告知那些使用不兼容HTML5浏览器的用户，此外还支持你一般都会追加的附加属性如height和width。我们把这些都加上：

现在将上面这段代码插入我们的网页然后在Safari中查看，视频就会出现但没有播放控制栏。想要显示默认的播放控制栏则需要追加controls属性。我们还可以追加autoplay属性（不建议——因为大家都讨厌自动播放的视频，这是常识）。修改后的代码如下：

上面的代码所产生的效果如下图所示：

其余的属性还包括用来控制媒体预加载的preload（HTML5的早期尝鲜者应该注意preload替代了原先的autobuffer），用来重复播放视频的loop，以及用来定义视频缩略图的poster（这个属性在视频播放延迟时非常有用）。要使用某个属性，将其追加到标签中即可。下面的例子包含了刚才提到的所有属性：

4.8.1　提供备用的媒体源文件

最初的HTML5规范呼吁所有浏览器内置支持使用Ogg格式⁽¹⁾直接播放视频或音频（无需插件）。但是由于HTML5工作组的内部争议，曾经作为基线标准的支持Ogg（包括Theora video 和Vorbis audio）的主张在最近更新的HTML5规范中被放弃。因此目前的情况是，一些浏览器支持某一套视频和音频文件格式，而另一些浏览器则支持其他格式。例如Safari只允许在<video>和<audio>元素中使用MP4/H.264/AAC媒体文件，而Firefox和Opera则只支持Ogg和WebM。

为什么我们不能和睦相处！（《火星人玩转地球》，http://movie.douban.com/subject/1297715/。）

谢天谢地，有一种方法能在一个标签内支持多种媒体格式。但是这种方法并不能免除我们为一个媒体文件创建多种版本。我们都期望这个问题在将来某个适当的时刻会自行解决，此时我们手握多种格式的媒体文件，则可以这样编写视频标签：

如果浏览器支持Ogg格式，则使用第一个文件；否则它会继续往下解析下一个<source>标签。

4.8.2　针对老版本浏览器的备用方案

照这种方式使用<source>标签，我们就能根据需要提供一系列备用方案。例如在提供了MP4和Ogg格式之后，如果我们还想给IE8及更低版本提供一个优雅的备用方案，则可以追加一个Flash。更进一步，如果用户的浏览器没有任何合适的媒体播放技术，我们还可以为其提供媒体文件的下载链接：

4.8.3　和标签的用法基本一致

<audio>标签的用法与<video>基本一致，除了width、height和poster之外其他属性基本相同。你甚至可以将<video>和<audio>标签互换使用。两者之间的最大差别就是<audio>没有可视内容的播放区域。