HTML5网站是对HTML早期版本的增强,以满足于增长的Web标准化需求。在HTML4诞生之初,人们对web的需求仅限于文字和图片等内容,随着互联网的飞速发展,网络带宽的日益增强,人们对互联网的需求已经不再局限于传统的文字和图片,Web网页上需要呈现更多的内容。HTML5网站通过在HTML内部整合这些功能以满足日渐增长的Web需求。下面将从5个方面来分别介绍HTML5网站的一些较新的特性。
1.HTML5文档具有语义化特性
在HTML4中文档是不具有语义结构的,实际上更多的就是排版的作用。HTML5网站通过一些新增的标签来标识文档的语义结构,如下所示。
section:类似书中的章节小节,可以有标题等任何内容。
header:页面上显示的页眉,与head元素不同。
footer:页面上显示的页脚,比如用来显示网站版权或联系方式。
nav:网站导航部分
article:指定网站的文章内容部分,比如博客内容、杂志内容等。
什么是HTML5网站,通过使用这些具有结构化语义的元素,可以让整个页面具有语义色彩。通过在HTML5中应用这些新增强的标签,可以使得整个文档的结构清晰明了,便于进行页面的分析与处理。可以参考下面的网站:http://www.zhiyuanit.net.cn/
2.增强的表单控件
HTML5提供了一系列新的表单控件,比如 calendar日历控件、 email电子邮件输入框、url网址输入框、 search搜索框、 Date Picker数据检查器等新的控件,对现有的HIML的表单控件进行了进一步的增强,这些表单提供了很多有用的特性。
3.多媒体增强
HTML5新增的<audio>和<video>标签可以直接在网页上播放音频和视频,而无须借助任何的播放音频和视频的插件,比如目前多数视频播放网站都使用nash插件,当使用HTML5技术之后,就可以无插件地播放多媒体内容。
4.功能强大的画布 Canvas
画布是HTML5中引入的一个非常重要的组件,它的出现使得在HTML5上具有与许多桌面应用程序相同的效果。画布是一个矩形的区域,可以通过 JavaScript代码控制画布上的每一个像素,并且 Canvas对象提供了多种绘制路径、矩形、圆形及添加图像的方法。
5.支持本地离线存储
HTML5提供了本地离线存储的功能,支持开发人员将数据直接存储到本地位置,以便在没有网络连接时仍可以使用HTML5应用程序。实际上这有些类似于浏览器的缓存,比如在显示网页上的图像时,HTML的早期版本会将图片下载并缓存到浏览器指定的缓存位置,以便可以保证用户下次重新打开时直接从本地打开,从而提供较快的显示速度。HIML5的离线存储对缓存进行了规范化,并提供了一系列的方法让开发人员来控制需要缓存的资源。
HTML5提供了如下两种存储离线数据的方法:
l localStorage:没有时间限制的数据存储。
l session Storage:针对一个 session的数据存储,当会话终止后会清除存储的数据。