1.2 HTML5与HTML4的主要区别
HTML是当前Web应用中最为广泛的语言,为了适应快速发展的Web技术和应用需求,HTML5在HTML4基础上发展起来,因此成为W3C新的Web标准[4]。HTML5引入了一整套全新的元素来让构建页面变得更加简单。作为下一代Web技术标准的HTML5,与HTML4有很多不同。为了表明HTML5的优势所在,以下通过对HTML4和HTML5进行差异性对比研究,来分析HTML5的新特性和功能。
1.2.1 兼容性适应能力升级明显
不同的PC操作系统、不同的移动终端平台、不同的浏览器,对HTML4标准提出了新的技术应用要求,并且出现了新的语义元素和书写规范。新元素和新规范的产生以及支持的标准不同导致了HTML文档出现各种兼容性的问题,如DOCTYPE影响CSS处理、UL标签在Mozilla中默认是有padding值的,而在IE中只有margin有各类兼容性问题。而作为下一代HTML候选标准的HTML5,其制定原则为:新特性基于HTML、CSS、DOM以及JavaScript;减少对外部插件的需求(比如Flash);独立于设备等。独立于设备这个原则意着HTML5脱离于系统平台本身,依靠自身的语言规范来实现技术应用,将对平台的依赖性降到最低,极大避免了在HTML4标准中出现的各种兼容性问题。
1.2.2 多媒体表现彰显特色
音视频方面:当前Web应用于媒体时代,仅支持最基本的音视频文件,无法满足其他应用需求的HTML4,必须通过采用中间件或者引入插件方式来支持多类媒体元素的应用。而HTML5将音视频代码简化成两个标签元素,即Video和Audio。开发人员可直接使用这两个标签,则可将多种格式的音视频文件嵌入网页[5]。这样既降低了Web开发人员的难度,也最大程度的避免了使用插件出现的稳定性与安全性问题。
图形动画渲染方面:HTML4须在服务器端先执行图片文件解析,然后再把文件发到浏览器中用一堆代码或第三方插件来显示。而在HTML5中则可以直接使用Canvas标签来实现矢量画布功能,使得开发者只要使用一个标签就能和用户产生UI交互。HTML5在网页的应用与表现上,相对于HTML4也提供了更好的支持,其语义元素可以使用浏览器脚本语言(通常是JavaScript)进行实时图形绘制。相对于HTML4而言,HTML5与浏览器渲染引擎[6]更紧密的结合,不仅节约了资源,也极大地简化了图形与网页中其他元素的交互过程。
1.2.3 语义元素扩展性对比
HTML5对HTML4的语义元素进行了改变,其中增加了一些标签,同时也废弃了一些标签。例如在页面布局设计时,HTML4通常通过设置<p>标签的id属性或者class属性值如header、footer、sidebar等分别来表达头部、底部或者侧栏等,代码编写者需要为id或者class命名费尽心思。而HTML5新增了<header>标签、<footer>标签、<section>标签、<article>标签等,用新的结构元素来表达这些最常用的结构。虽然目前HTML5还不够完善,但随着技术研究的进一步深入和规范标准的发布,HTML5终将成为Web应用开发的主导核心技术[7]。
2. HTML5的新特性
2.1 HTML5标准简述及意义
仍处于发展阶段的HTML5是HTML下一个主要的修订版本,目标是取代1999年所制订的HTML4.01和XHTML1.0标准,以便能够在互联网应用迅速发展的时候,使网络标准达到符合当代的网络需求。广义论及HTML5时,实际指的是包括HTML,CSS 和JavaScript在内的一套技术组合。
HTML5添加了许多新的语法特征,其中包括<video>,<audio>,和<canvas>元素,同时集成了SVG(HTML5中新加入的矢量图形)等内容。这些元素能够更容易的在网页中添加、处理多媒体与图片内容。同时也增加了其它新的元素包括<section>,<article>,<header>和<nav>。HTML5添加了许多新的属性。同时也移除了一些元素和属性。像<a>、<cite>和<menu>(<a>、<cite>和<menu>均为HTML中的标签)已经被修改。HTML5还定义了处理非法文档的具体细节,目的为了使所有浏览器和客户端程序能够一致地处理语法错误。HTML5提供了一些新的元素和属性,反映了典型的现代用法网站。其中有些是技术上类似<p>和<span>标签,但有一定含义,例如<nav>(网站导航块)和<footer>。这种标签将有利于搜索引擎的索引整理、小屏幕设备和视障人士使用。一些纯粹用作显示效果的HTML4标记,如<font>和<center>标签将被取消,因为它们已经被CSS取代[8] 基于HTML5的学校网站设计(2):http://www.youerw.com/jisuanji/lunwen_4745.html