你应该了解的HTML5新特性

作者：CHRIS MILLS

原文：http://dev.opera.com/articles/view/get-familiar-with-html5/

译者：一回（csser.com）

说明：非全文翻译，仅节选了HTML5新特性一节，转载请保留作者、译者、本文链接和原文链接。

HTML5包含许多新特性使HTML比以往更强大，也更适合用于构建Web应用。下面列出了你应该了解的新特性列表。列表中列出的一些功能并不是HTML5规范的一部分，但是都被定义在与之相关的规范里，并且它们也是推动现代Web应用的有效部分，了解它们对你会有帮助。

新的语义标签

我们知道，书写HTML代码时，我们应该重视标签的语义性，尽量使用合适的标签来描述内容。在HTML4.01就存在这样的语义问题，不可否认，许多标签是有含义的，如表格（table）、列表（ul、ol、dl）标题（h1、h2、…）等，但是仍然有很多常用的页面内容是没有语义定义的。比如网站头部，网站页脚，导航，菜单等，我们只好用<div id=”xxx”></div>这种形式来定义这种语义，编写者可以理解它的含义，但机器不能。同时不同的开发者会定义不同的id和class来表达语义，这也造成了语义的混乱。幸运的是，HTML5的到来增加了新的语义元素，如<nav>, <header>, <footer>和<article>等。你可以到 HTML5新的结构和内容分组标签 学习这些标签的使用。

增强的表单功能

HTML4.01已经提供了可以使用、易于访问的web表单，但是一些常用的功能需要很繁琐的通过技巧或者大量代码来实现。HTML5带来了简单、标准的方式来实现诸如颜色选择、范围选择以及客户端验证功能。HTML5新的表单功能一文涵盖了HTML5表单的细节。

原生视频和音频支持

一直以来，我们都习惯通过Flash来实现web上的视频和音频播放。事实上，Flash能变得如此普及正式因为HTML缺少提供跨浏览器兼容的机制。为了完成相同的事情，不同的浏览器采用不同的方式（如<object>和<embed>），让事情变得复杂了。Flash提供了高质量、简单的方式来实现跨浏览器的视频播放。

HTML5包含<video>和<audio>标签来实现原生的视频和音频播放。同时它还提供了一个API让你可以很容易的实现自定义播放控制。dev.opera.com有很多关于HTML5 视频和音频的文章，最适合入门的文章是Introduction to HTML5 video一文，另外More accessible HTML5 video player也值得一读。

绘图API

<canvas>标签和相关API允许你定义绘图区域，使用Javascript命令绘制线条、图形和文本，导入并操作图形和视频，导出不同格式的图片等等，更多的关于HTML5 canvas，请从HTML5 canvas -基本语法 开始读起。

支持web 套接字通讯

Web Sockets API被定义在Web Sockets规范而非HTML5规范，Web Sockets API允许你在服务器端和客户端指定的端口打开一个持久连接，只要端口不被关闭，数据可以双向实时推送。这大大的提高了Web应用的效率，数据在服务器端和客户端实时传输交换的过程中，不需要刷新页面，也不需要客户端频繁的发送请求到服务器端来确认服务器端是否已经更新。Introducing Web Sockets一文非常适合入门。

离线web应用

HTML5提供了一些功能允许Web应用可以离线运行。应用缓存允许你在本地保存一份资源和文件的副本，同时Web SQL数据库允许你保存Web应用数据到本地。这些功能可以实现当你离线以后仍可以在本地运行Web应用程序，当下次联网时与服务器端同步本地的修改。

Web Storage（增强的本地存储）

Cookie允许我们在客户端存储数据，但它的使用限制较大。HTML5 Web Storage允许存储更多的数据和允许更多的操作。阅读Web Storage：简单强大的客户端数据存储技术了解更多。

web workers（多线程）

Web应用程序一个经常遭遇的问题是大数据量处理时存在性能瓶颈，其原因在于数据处理发生在单线程操作上（一次只能加载一个线程）。Web Workers通过允许创建后台处理线程缓解这个问题，后台线程可以处理一些复杂的数学运算，允许主线程关注其它事情。阅读Web Workers rise up!以了解更多内容。

基于地理位置的Geolocation API

Geolocation规范（同样不是HTML5规范的一部分）定义了一个允许Web应用轻松访问任意有效位置数据的API，比如从一个有GPS导航能力的设备获取地理位置信息。该API允许在Web应用中增加位置感知功能，比如高亮显示在你地理位置附近的内容。想了解这方面的基本介绍，请阅读How to use the W3C Geolocation API。【完】