标签：
1 HTML发展历史与HTML5
1.1 HTML发展历史
从HTML面世开始，它就显得“很不正规”：1991年年底推出HTML，但最早的HTML并没有任何严格的定义。直到1993年，IETF(Internet Engineering Task Force，互联网工程工作小组)才开始发布HTML规范的草案。在HTML语言的发展历史中，大致经历了如下几个阶段：
HTML（第一版）:1993年6月由互联网工程工作小组发布的HTML工作草案。
HTML 2.0:1995年11月作为RFC1866发布。
HTML 3.2:1996年1月14日由W3C组织发布，是HTML文档第一个被广泛使用的标准。
HTML 4.0:1997年12月18日由W3C组织发布，也是W3C推荐标准。
HTML 4.1:1999年12月24日由W3C组织发布，是HTML文档另一个重要的、广泛使用的标准。
XHTML 1.0:发布于2000年1月26日，是W3C组织推荐标准，后来经过修订于2002年8月1日重新发布。
1.2 HTML4.1和XHTML
XHTML（eXtensible Hyper Text Markup Language，扩展的超文本标记语言），两者具有很好的兼容性，而且XHTML是更严格、更纯净的HTML代码。W3C组织制定XHTML的目标是逐步取代原有的、混乱的HTML。简单的说，XHTML是最新版本的HTML规范。
XML文档是一种结构化文档，它有如下4条基本规则：
a:整个文档有且只有一个根元素；
b:每个元素都由开始标签和结束标签组成(eg:<a></a>就是开始标签和结束标签)，除非使用空元素语法(eg:<br />)。
c:元素与元素之间应该合理嵌套。eg:<a><b>Rodolfo讲述H5</b></a>，可以明确的看出<b.../>元素是<a.../>元素的子元素，这就是合法嵌套。但<a><b>Rodolfo讲述H5</a></b>这种写法就是比较混乱的，也就是所谓的不合理嵌套。
d:元素的属性必须有属性值，而且属性值应该用引号(单引号和双引号都可以)引起来。
为此，W3C建议使用XML规范来约束HTML文档，将HTML和XML的长处加以结合，从而得到现在和未来都能使用的标记语言：XHTML。
XHTML可以被所有支持XML的设备读取，在其余的浏览器升级至支持XML之前，XHTML强制HTML文档具有更加良好的结构，保证这些文档可以被所有的浏览器解释。
1.3 HTML和XHTML的文档类型定义(DTD)
表面上看，HTML和XHTML显得杂乱无章，但实际上W3C(World Wide Web Consortium，万维网联盟，制定Web标准的权威组织)为HTML和XHTML制定了严格的语义约束。W3C组织使用DTD(Document Type Definition，文档类型定义)来定义HTML和XHTML的语义约束，包括HTML文档中可以出现哪些元素，各元素支持哪些属性等。
打开HTML4.1的DTD文档(http://www.w3.org/TR/html1401/loose.dtd)，在该文档中可以看出如下片段：
<!ELEMENT BODY O O (%flow;)* + (INS | DEL) - - document body-->
<!ATTLIST BODY
%attrs; - - %coreattrs, %i18n, %evens --
unload %Script; #IMPLIED - - the document has been loaded --
onunload %Script; #IMPLIED - - the document has been removed --
background %URI; #IMPLIED - - texture tile for document background --
%bodycolors; - - bicolor,text,link,link,link --
>
上面的DTD片段定义了BODY（全部大写）元素可以支持%attrs指定的各种通用属性；除此之外，BODY元素还可以指定onload、onunload、bicolor、text、link、vlink、alink这些属性。
1.4 从XHTML到HTML5
虽然W3C努力为HTML指定规范，但由于大部分编写HTML页面的人并没有受过专业训练，他们对HTML规范、XHTML贵方也不甚了解，所以他们制作的HTML网页绝大部分没有遵守HTML规范。
虽然互联网上绝大部分HTML页面都是不符合贵方，但各种浏览器却可以正常解析、显示这些页面，再这样的局面下，HTML页面的制作者甚至感觉到不遵守HTML规范的意义。于是出现了一种非常尴尬的局面：一方面，W3C组织“声嘶力竭”地呼吁大家应该制作遵守规范的HTML页面；另一方面，HTML页面制作者却根本不太例会这众呼吁。
现在的HTML页面大量存在如下4种不符合规范的内容：
a:元素的标签名大小写混杂的情况，eg:<p>HTML</P>，这个<p.../>元素的开始标签和结束标签采用了大小写不匹配的字符；
b:元素没有合理结束的情况，eg:比如只有<p>标签，没有</p>结束标签；
c:元素中使用了属性，但没有指定属性值的情况，eg:<input type=“text” disabled>；
d:为元素的属性指定属性值时没有使用引号的情况，eg:<input type=text>；
可能是出于“存在即合理”的考虑，WHATWG组织开始制订一种“妥协式”的规范：HTML5。既然互联网上大量存在上面4种不符合规范的内容，而且制作者从来也不打算改进这些属性，因此HTML5干脆承认它们是符合规范的，换句话说，HTML5是规范制定者对现实的妥协。
由于HTML5规范十分的宽松，因此HTML5甚至不再提供文档类型定义（DTD）。到2008年，WHATWG的努力终于被W3C认可，W3C已经制定了HTML5草案。
2 HTML5的优势
从HTML4.1、XHTML到HTML5，并不是一场革命性的升级，而是一种规范向习惯的妥协，因此HTML5并不会给开发者带来过大的冲击，开发者会发现从HTML4.1过渡到HTML5非常轻松。但另一方面，HTML5也增加了很多非常实用的新功能，这些新功能将吸引开发者投入HTML5的怀抱。2.1 解决跨浏览器问题
对于有过实际开发经验的前端程序员来说，跨浏览器绝对是一个永恒的噩梦：明明在一个浏览器中可以正常运行的HTML+CSS+JavaScript页面，但换一个浏览器之后，可能会出现很多问题，比如页面布局混乱、JavaScript运行出错……因此很多前端程序员在开发HTML+CSS+JavaScript页面时，往往会先判断对方浏览器，然后根据对方浏览器编写不同页面代码。
HTML5的出现可能会改变这种局面，目前各种主流浏览器(Internet Explorer、Chrome、FireFox、Opera、Safari)都便显出对HTML5的极大热情。
a:Internet Explorer：2010年3月，微软宣布推出IE9浏览器开发者预览版。微软称，IE9开发完成后将会更好的支持CSS3、SVG和HTML5等新规范；
b:Chrome：Google一直以来都积极的推动HTML5的发展；
c:FireFox：从Firefox4开始，FireFox就一直积极支持HTML5的规范，包括全新的HTML5语法分析，HTML5视频播放，音频播放；
d:Opera：在笔者的记忆中，Opera每次在HTML5支持的测试中总是名列前茅，从Opera10开始就对HTML5的支持十分出色；
e:Safari：2010年6月，Apple公司在开发者大会的会后发布了Safari5。根据Safari5至少支持10项以上的HTML5新技术，包括HTML5视频播放、HTML5地理位置、HTML5的拖放API等。
2.2 部分代替了原来的JavaScript
HTML5增加了一些非常实用的功能，这些功能可以部分代替JavaScript，而这些功能只要通过为标签添加一些属性即可。
例如，打开一个页面后立即让某个单行文本框获得输入焦点，在HTML5以前，可能需要通过JavaScript来实现。如下面片段：
<body>
图书：<input type=“text” name=“book” id=“name”/><br/>
价格：<input type=“text” name=“price” id=“price”/>
<script type=“text/javascript">
document.getElementById(“price”).focus();
</script>
</body>
上面的页面代码片段通过JavaScript代码来完成这个功能，但在HTML5中则只需要设置一个属性即可。如果使用HTML5，则可以把上面的页面片段改为如下形式：
<body>
图书：<input type=text name=book/><br/>
价格：<input type=text autofocus name=price/>
</body>
把两个页面片段放在一起进行对比，不难发现使用HTML5之后简洁多了。
除了这里示范的autofocus可用于自动获得焦点之外，HTML5还支持其他一些属性，比如一些输入校验的属性，以前都必须通过JavaScript来完成，但现在都只要一个HTML5属性即可。
2.3 更明确的语义支持
在HTML5以前，如果要表达一个文档结构，可能只能通过<div.../>元素来实现。例如：我们定义如下页面结构：
<div id=“header”>…</div>
<div id=“nav”>…</div>
<div id=“article">
<div id=“section">
...
</div>
</div>
<div id=“aside”>…</div>
<div id=“footer”>…</div>
在上面的页面结构中宏，所有的页面元素都采用<div.../>元素来实现，不同<div.../>元素的id不同，不同id的<div.../>元素代表不同的含义，但这种采用<div.../>布局的方式导致缺乏明确的语义--因为所有内容都是<div.../>元素。
HTML5则为上面的页面布局提供了更明确的语义元素，此时可以将上面的页面片段改为如下形式：
<header>…</header>
<nav>…</nav>
<article>
<section>
...
</section>
</article>
<aside>…</aside>
<footer>…</footer>
上面的页面片段就可以提供更清晰的语义了，而不是通过语义不清的<div.../>元素来完成布局。
除此之外，以前的HTML可能会通过<em.../>元素来表示”被强调“的内容，但到底是哪一种强调，HTML却无法表示；HTML5则提供了更多支持语义的强调元素。eg：
<time>2010-5-26</time>
<mark>被标记的文本</mark>
上面的第一个<time.../>元素用于强调被标记的内容是日期或者时间，而<mark.../>元素则用于强调被标记的文本。HTML5新增的这两个元素比<em.../>元素提供了更丰富的语义。
2.4 增强了Web应用程序的功能
一直以来，HTML页面的功能被死死地限制着：客户端从服务器下载HTML页面数据，浏览器负责呈现这些HTML页面数据。出于对客户机安全的考虑，以前的HTML在安全性方面确实做的足够安全。
当HTML页面做的太安全之后，于是我们就需要通过JavaScript等其他方式来增加HTML的功能。换句话说，HTML对Web程序而言功能太单薄了，比如上传文件时想同时选择多个文件都不行（前端开发者不得不通过Flash、JavaScript等各种技术来客服这个困难），为了弥补这个不足，HTML5规范增加了不少新的API，而各种浏览器正在努力实现这些API功能，在未来的日子里，使用HTML5开发Web应用将会更加轻松。
01 HTML5简介
标签：
原文地址：http://www.cnblogs.com/Rodolfo/p/5213913.html
