HTML5是对HTML的第5次重大的修改，虽然HTML5 标准还在制定中，但不能阻碍其势不可挡的脚步，不用HTML5你就OUT了。HTML5与我们常用的HTML4有什么区别呢？
首先要说的是不是所有的浏览器都支持HTML5,Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 支持某些 HTML5 特性。
下面是在把我个人将网页换成html5标准时所做的改变：
1、换一个W3C标准声明<!doctype html>，少了不少代码，页面干净，爽
2、对于HTML5的标签，IE9之前的版本无法提供支持,为了兼容老版本的浏览器，必须做些额外的工作，十分不爽，要在head里引入一个html5.js帮助旧版本的IE浏览器创建HTML5元素节点,麻烦。
<!--[if lt IE 9]>
<script src="js/html5.js"></script>
<![endif]-->
为了正确显示，CSS中增加如下设置：
header, section, footer, aside, nav, main, article, figure {
display: block;
}
3、 新增了一些语义化的标签， 如<header><footer><section><article>**<**menu><figure> 用法：<div class=“header”></div>,改为<header></header>，少定义不少 class，HTML干净，有利于SEO,爽。
4、删除了一些标签如： frame, center, big
难道只是这些标签的小改动，就能让HTML5的概念风卷残云吗？肯定不是，那么，HTML5的精髓在哪呢？
一、代码更清晰，语义更明确，这几乎是很多人使用它的全部
html5新增的标签
<article> 标记定义一篇文章
<aside> 标记定义页面内容部分的侧边栏
<audio> 标记定义音频内容
<canvas> 标记定义图片
<command> 标记定义一个命令按钮
<datalist> 标记定义一个下拉列表
<details> 标记定义一个元素的详细内容
<dialog> 标记定义一个对话框(会话框)
<embed> 标记定义外部的可交互的内容或插件
<figure> 标记定义一组媒体内容以及它们的标题<footer> 标记定义一个页面或一个区域的底部
<header> 标记定义一个页面或一个区域的头部
<hgroup> 标记定义文件中一个区块的相关信息
<keygen> 标记定义表单里一个生成的键值
<mark> 标记定义有标记的文本
<meter> 标记定义
<nav> 标记定义导航链接
<output> 标记定义一些输出类型
<progress> 标记定义任务的过程
<rp> 标记是用在Ruby
<rt> 标记定义对ruby annotations的解释
<ruby> 标记定义
<section> 标记定义一个区域
<source> 标记定义媒体资源
<time> 标记定义一个日期/时间
<video> 标记定义一个视频
html5删除了以下四种类型的标签
1、能使用CSS替代的标签
如：big、center、font、s、strike、tt、u
2、不再使用frame框架
在 HTML5 中不再支持frameset 标签、frame 标签与 noframes 标签，只支持 iframe 标签。
3、只有部分浏览器支持的标签
如：applet、bgsound、blink、marquee
4、其他被废除的标签
二、HTML5是最移动化的开发工具。
现在越来越多的用户选择使用移动设备访问网站或者web应用。
三、增强表单
1) 新的input type
<input type="number"><input type="range"><input type="email"><input type="url">等
2)新的表单元素
略
3)表单元素的新属性（通用属性）
placeholder：占位提示文字
mutiple：是否允许多个输入
autofocus：自动获得输入焦点
required：输入框内容不能为空
min：允许输入的数字最小值
max：允许输入的数字最大值
minlength：允许输入的字符串最小长度
maxlength：允许输入的字符串最大长度
pattern：输入框内容必须符合的正则表达式
四、Canvas绘图
可以使用HTML5的<canvas>开发游戏。HTML5提供了一个非常伟大的，移动友好的方式去开发有趣互动的游戏。如果你开发Flash游戏，你就会喜欢上HTML5的游戏开发。canvas只是一个画布，HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像。
Canvas入门
五、SVG绘图
HTML5新增了<svg>用于绘制矢量图，SVG 是一种基于 XML 语法的图像格式，全称是可缩放矢量图（Scalable Vector Graphics）。其他图像格式都是基于像素处理的，SVG 则是属于对图像的形状描述，所以它本质上是文本文件，体积较小，且不管放大多少倍都不会失真。
SVG 文件可以直接插入网页，成为 DOM 的一部分，然后用 JavaScript 和 CSS 进行操作。
SVG入门
六、本地存储
HTML5中最酷的特性就是本地存储。有一点像比较老的技术cookie和客户端数据库的融合。它比cooke更好用因为支持多个windows存储，它拥有更好的安全和性能，即使浏览器关闭后也可以保存。
因为它是个客户端的数据库，你不用担心用户删除任何cookie，并且所有主流浏览器都支持。
本地存储对于很多情况来说都不错， HTML5工具中一个不需要第三方插件实现的。能够保存数据到用户的浏览器中意味你可以简单的创建一些应用特性例如：保存用户信息，缓存数据，加载用户上一次的应用状态。
HTML5 提供了两种在客户端存储数据的新方法：
localStorage - 没有时间限制的数据存储
sessionStorage - 针对一个 session 的数据存储
七、HTML 5 应用程序缓存
使用 HTML5，通过创建 cache manifest 文件，可以轻松地创建 web 应用的离线版本。
什么是应用程序缓存（Application Cache）？
HTML5 引入了应用程序缓存，这意味着 web 应用可进行缓存，并可在没有因特网连接时进行访问。
应用程序缓存为应用带来三个优势：
1、离线浏览 - 用户可在应用离线时使用它们
2、速度 - 已缓存资源加载得更快
3、减少服务器负载 - 浏览器将只从服务器下载更新过或更改过的资源。
八、视频和音频支持
视频和音频通过HTML5标签<video>和<audio>来访问资源，不再需要Flash和第三方插件。html5之前正确播放媒体一直都是一个非常可怕的事情，你需要使用<embed>和<object>标签，并且为了它们能正确播放必须赋予一大堆的参数。媒体标签将会非常复杂，大堆得令人迷惑的代码。
HTML5视频和音频标签基本将他们视为图片：<video src=”"/>。
其他参数：宽度和高度、自动播放
<video src="" width=”640px” height=”380px” autoplay><video>
<audio src="" width=”640px” height=”380px” autoplay></audio>
这个过程非常简单，不过为了兼容老版本浏览器我们需要添加更多代码来让他们正确工作。但是这个代码还是比<embed>和<object>来的简单的多。
九、HTML5拖放
拖放（Drag 和 drop）是 HTML5 标准的组成部分。HTML5 中提供了直接拖放的 API，不需要去写一大堆的 js，只需要通过监听元素的拖放事件就能实现各种拖放功能。
想要拖放某个元素，必须设置该元素的 draggable 属性为 true，当该属性为 false 时，将不允许拖放。而 img 元素和 a 元素都默认设置了 draggable 属性为 true，可直接拖放，如果不想拖放这两个元素，把属性设为 false 即可。
十 、HTML5地理定位
通过浏览器获取当前用户的所在地理坐标，以实现“LBS服务”（Location Based Service），如实时导航、周边推荐。
情形1：用户使用手机浏览器——可以根据内置GPS芯片读取数据
情形2：用户使用PC浏览器——可以根据电脑的IP地址进行反向查询(需要很大的IP分配库)
十 一、HTML 5 Web Workers
JavaScript的执行时单线程的，随着计算机性能的提高，单线程无法充分发挥计算机的计算能力。
Web Worker 的作用，就是为 JavaScript 创造多线程环境，允许主线程创建 Worker 线程，将一些任务分配给后者运行。
HTML 5允许主线程创建 Worker 线程，将一些任务分配给Worker 线程运行。主线程运行的同时，web worker在后台运行，独立于主线程，减少主线程被阻塞，提高页面的性能。