Web程序员们,你预备好迎接HTML5了吗?
发布时间:06/10 来源:未知 浏览:
关键词:
1, 用Canvas绘制图形
Canvas的涌现颠覆了传统在Web利用中绘图的方式,传统的绘图方式有在服务器端先画好图片,再把图片发到阅读器中,或者用Flash,还有用第三方插件。但是这些办法都不是原生的HTML, HTML5 canvas供给了通过javascript绘制图形的办法,办法简略但是功能强大,作为开发工程师可以运用canvas API为所欲为地控制图画。
2,多媒体音频和视频
<audio>和<video>是首批增加到HEML5标准中的标志。它们的参加使得web阅读器能够以一种更利便的方式来处置音频和视频文件,完毕了在web阅读器中安装播放插件的历史。比拼令人头疼的是,各大阅读器厂商对音频和视频格局有严重的分歧,Firefox坚持将开放的ogg规范,而Safari则但愿是MP3和MP4的规范,这就造成了我们开发历程中需要供给多个版本的音频和视频文件来兼容阅读器。
当前阅读器对音频文件的支撑状况:
Format IE 8 Firefox 3.6 Opera 10.5 Chrome 5.0 Safari 5.0
Ogg Vorbis No Yes Yes Yes No
MP3 No No No Yes Yes
Wav No Yes Yes No Yes
当前阅读器对视频文件的支撑:
Format IE 8 Firefox 3.6 Opera 10.5 Chrome 5.0 Safari 5.0
Ogg No Yes Yes Yes No
MPEG 4 No No No Yes Yes
点击这里查看audio和video的属性:HTML5 Audio HTML5 Video
新建audio和vedio元素:
<audio controls="controls">
<source src="song.ogg" type="audio/ogg" />
<source src="song.mp3" type="audio/mpeg" />
您的阅读器不支撑音频标签!
</audio>
<video width="320" height="240" controls="controls">
<source src="movie.ogg" type="video/ogg" />
<source src="movie.mp4" type="video/mp4" />
您的阅读器不支撑视频标签!
</video>
点击这里查看音频和视频标签在阅读器中的结果:Audio - Vedio
就开发者而言,当前的状况是,我们需要预备多个版本的音频和视频,并把文件途径都增加到audio和vedio中,web阅读器会跳过不支撑的格局,另外,最佳增加针对不支撑audio和vedio的阅读器的文字提醒或者其他多媒体播放方式。
Audio和Vedio是两个简略而强大的标签,当前国里外已经有多个多媒体分享网站开端支撑或测试HTML5。
如下是一些HTML5 Vedio体验资源:Video showcase from Apple
Google 结合 Arcade Fire 推出了一个 HTML5 互动电影: The Wilderness Downtown,点击这里可以进入其在 Chrome Experiment 的页面。
3,Web存储
随着Web利用的开展,需要在客户端存储的场景越来越多,传统的客户端存储方式有cookie、Firefox下有globalStorage、Flash在插件的支撑下有其本人的存储方式,但是这几种方式都有其局限性(平安性和兼容性)。HTML5供给的在客户端存储方式有:Web Database和Web storage,Web Database顺应与客户端复杂数据的存储,其规范还不成熟,阅读器的支撑也很有限,需要Web开发人员进一步的关注,假设存储的是简略的数据,则可以运用Web storage方式,不占用带宽,并且得到了主流阅读器的支撑,包括IE8。
Web存储有两种方式:localStorage和sessionStorage,参考这里查看细致定义,两者的区别简略来说,localStorage可以永恒保留数据,也就是说关闭阅读器,下次打开阅读器还能取得存储的数据,而sessionStorage只在目前的会话中可用。
4,其他的简化了开发的HTML5特性
一些常用输入类型:Email,url,number,date pickers等
一些规范属性:contenteditable 等
一些input属性:placeholder,required,autofocus,min,max,step,
这里举荐两篇介绍这些HTML5特性的文章,请参考:你必须晓得的28个HTML5特征、诀窍和技术和给网页设计师的30个HTML5学习资源
以上这些HTML5特性是当前阅读器支撑较好的特性,也是关注度非常高的HTML5特性,本文是从一个Web开发人员的角度来了解HTML5,目的是但愿有更多的Web开发人员能尽快地融入HTML5的开发中来,最近优酷已经开端利用HTML5和HTTP Live Streaming技术,让更多的会员可以在移动平台分享多媒体,这对国内的HTML5的推行起到了积极的作用,微软承诺IE9将全面支撑HTML5,这对HTML5的推行是一个振奋人心的新闻。可以预感,将来几年HTML5将迅速地开展,作为Web开发人员,我们更应当尽快熟知HTML5的各种特性,在项目开发历程中也应当更多考虑怎样应用HTML5的特性增强web利用程序的易用性和可移植性。