1.2.5　优雅地降级

渐进增强的另一面就是优雅地回退。最典型的例子就是使用type属性增强表单。

【示例1】下面代码列出了可以为type属性指定的新值，如number、search、range等。

    <input type="number" />
    <input type="search" />
    <input type="range" />
    <input type="email" />
    <input type="date" />
    <input type="url" />

最关键的问题在于：当浏览器看到新type值时会如何处理。旧版本浏览器是无法解析新type值的，但是当它们看到不理解的type值时，会将type的值解析为text。

【示例2】对于新的video元素，它设计得很简单且实用。针对不支持video元素的浏览器可以这样写：

    <video src="movie.mp4">
        <!-- 回退内容 -->
    </video>

这样HTML5视频与Flash视频就可以协同起来，用户就不用纠结如何进行选择了。

    <video src="movie.mp4">
        <object data="movie.swf">
            <!-- 回退内容 -->
        </object>
    </video>

如果愿意的话，还可以使用source元素，而非用src属性来指定不同的视频格式。

    <video>
        <source src="movie.mp4">
        <source src="movie.ogv">
        <object data="movie.swf">
            <a href="movie.mp4">download</a>
        </object>
    </video>

上面代码包含以下4个不同的层次。

　如果浏览器支持video元素，也支持H264，那么用第一个视频。

　如果浏览器支持video元素，也支持Ogg，那么用第二个视频。

　如果浏览器不支持video元素，那么就要试试Flash视频。

　如果浏览器不支持video元素，也不支持Flash视频，那么可以给出下载链接。

总之，无论是HTML5，还是Flash，一个也不能少。如果只使用video元素提供视频，难免会遇到问题；如果只提供Flash影片，性质是一样的。所以，还是应该两者兼顾。