HTML5 开发者需要了解的技巧和工具汇总

HTML5现在已经成为了Web开发中的热门话题,大多数现代浏览器(Safari、Chrome,Firefox,IE10和移动设备)都支持 HTML5。即使HTML5的规范还没有制定完成,但许多开发者已经将其作为Web开发项目中的主要技术。一些网站巨头,如Google、 Facebook、Twitter和YouTube等,都建立在HTML5基础上。

HTML5中最令人兴奋的功能莫过于画布(canvas)和强大的表单功能,画布功能已经可以在大部分浏览器中完美体验(除了IE),但对于新表单元素的支持还不是太好。对Web开发者来说,是时候开始HTML5开发了。

要进行HTML5开发,本文中的一些技巧、工具可以让你缩短学习的时间,提高开发的效率。

一、HTML5支持测试列表

在开始之前,你需要了解现代的浏览器以及移动平台对于HTML5的支持情况。

主流浏览器HTML5功能支持一览

移动平台HTML5支持一览

HTML5支持测试

HTML5演示

二、让HTML5元素可用

老版本的IE浏览器不能识别新的HTML元素。但是,可以使用一些JavaScript或CSS解决方案来弥补这个缺陷。

HTML5Shiv:此脚本可以使IE浏览器识别HTML5元素。

HTML5 Enabler:功能与HTML5Shiv类似。

Modernizr:它使得开发者可以在支持HTML5和CSS3的浏览器中充分利用HTML5和CSS3的特性进行开发,同时又不会牺牲其他不支持这些新技术的浏览器的控制。

HTML5 Reset:它提供了一组HTML、CSS文件,让你能够以最少的时间来启动一个新的项目。它使用modernizr来支持HTML5 和 CSS3。

三、浏览器插件

下面是一些JavaScript插件,可以弥补一些浏览器对HTML5的支持问题。

1. VideoJS

VideoJS是一个HTML5的视频播放器,可以在所有浏览器中使用,包括IE6和移动设备。对于不支持HTML5的浏览器则自动使用Flash播放器来播放。

2. AudioJS

HTML音频播放器。用来让HTML5 的 《audio》 标签可以在各种浏览器上使用,包括移动设备。

3. HTML5Widget

HTML5的表单模块,包括日历,调色板,滑动部件,客户端验证等。

4. Webforms2

HTML5 表单属性的支持,例如pattern、required和autofocus。

5. LimeJS

LimeJS是HTML5的游戏框架,用于为现代触摸设备和桌面浏览器创建快速、本地化的游戏。

6. FlexieJS

支持CSS3弹性盒子模型(Flexible Box Model)。

四、在线工具

此外,还有一些在线工具,可以帮助开发者加快HTML5项目的开发。

1. HTML5 Boilerplate

HTML5Boilerplate 是一个HTML / CSS /JS模板,是实现跨浏览器正常化、性能优化、稳定的可选功能如跨域Ajax和Flash的最佳实践。开发者称之为技巧集合,目的是满足你开发一个跨浏览器,并且面向未来的网站的需求。

2. Switch to HTML5

非常有用的在线工具,可以根据你的喜好生成HTML5文档结构。

时间: 2024-09-17 10:52:36

HTML5 开发者需要了解的技巧和工具汇总的相关文章

浏览器间切换的5个技巧或工具

网页制作Webjx文章简介:五种在多个浏览器间切换的方法与工具(前端开发技巧). 对于网站前端开发者.用户体验设计师.互联网产品工程人员,以及广大站长.博客主.深度用户而言,往往有着一个共同的需求:需要时常在多个浏览器之间切换使用,以检查页面效果.测试产品性能,或是同时用几个账号身份登录相同的页面. 目前国际主流的浏览器主要是以下五个:微软的IE,当年以捆绑方式占据超高市场份额,当之无愧却渐显疲态的老大:Firefox,势头强劲.功能齐全的后起之秀,IE的最大挑战者:Chrome,来自另一位互联

.NET开发者必备的11款免费工具

原文:.NET开发者必备的11款免费工具 如今,HTML5,jQuery,JavaScript等等这些热门技术,受到了开发者们的强烈追捧,有了这些开发工具也为开发者们减轻了许多负担.本文为开发者介绍了11款.NET框架,这些框架有很多优点,比如提供用户界面,数据访问,数据库连接,Web应用开发,加密,数值算法算法,网络通信,以及一些其它的服务.这些工具都是开源的,有的开发工具你既可以从网上下载可执行文件,也可以下载源代码:还有一些工具拥有可扩展的框架,是一个持续集成工具. 今天我们要介绍一些最适

Browser Diet:网页前端性能优化的各种技巧和工具

文章描述:如何给网站瘦身?图文并茂的前端性能优化指南. 提高网站的速度对网站的成功有巨大的影响,因为网站的加载速度直接影响到用户体验和搜索引擎排名.Browser Diet 是一个非常好的指南,列出了前端性能优化的各种技巧和工具. 这是一个由 HTML,CSS,JS,服务器,图像和网站相关领域的众多专家组成的团队编写的,相比网络上的其它内容,这个指南图文并茂,生动有趣.此外,该指南不仅列出性能优化的步骤,同时还详细的介绍了如何实现. 官方主页 GitHub

用html5能开发什么,用什么工具最好,用到哪些知识

问题描述 用html5能开发什么,用什么工具最好,用到哪些知识 现在团队只会个java,做个简单的网页,会个PS.我们参加了设计大赛,HTML5创意应用命题,请前辈解答一下问题: 1.HTML5能开发什么,然后对我们这种小白最好开发什么 2.像玩java用Eclipse比较好,那做html5什么工具最好用? 3.我们这种小白如果想做一个能拿奖程度的开发,要会什么知识,比如我知道要会,javascript,css,还要什么 求前辈们给点经验! 解决方案 嗯,我的答案是:html5,主要的开发可能是

HTML5开发者日暨W3C中国六周年庆典

由W3C中国.HTML5梦工厂主办的"HTML5开发者日暨W3C中国六周年庆典"将在北京举行.届时,一千多名开发者和移动互联网产业链企业代表将齐聚北京国际会议中心,围绕"HTML5在路上"的主题进行讨论. 万维网联盟(W3C,WorldWideWeb Consortium)是互联网之父蒂姆 · 伯纳斯 - 李( Tim Berners-Lee )于 1994 年成立的著名网络标准推广组织,于2006年正式在中国内地设立办事处.为解决网络应用中不同平台.技术带来的不兼

“HTML5开发者日暨W3C中国六周年庆典”在北京举行

HTML5开发者日:欧朋与W3C共推动HTML5发展 届时,一千名多名开发者和移动互联网产业链企业代表将齐聚北京国际会议中心,围绕"HTML5在路上"的主题进行讨论. 万维网联盟(W3C,World Wide Web Consortium)是互联网之父蒂姆 · 伯纳斯 - 李( Tim Berners-Lee )于 1994 年成立的著名网络标准推广组织,于2006年正式在中国内地设立办事处.为解决网络应用中不同平台.技术带来的不兼容问题.保障网络信息的顺利和完整流通,万维网联盟制定了

易查日日金广告联盟为HTML5开发者解决创业难题

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 两年,HTML5的发展似乎进入到瓶颈期.HTML5技术相对成熟,但商业化进程却很缓慢,开始动摇从业者对HTML5的信心.但在开发者圈子里,大家对它的热情还是不减.如何解决HTML5开发者的创业难题?易查搜索近日宣布推出日日金HTML5广告联盟,帮助HTML5开发者"开源",解决他们的创业难题. 广告联盟,即网络广告联盟,最

Webjx收集:Web前端开发常用工具汇总

1,IE网页调试插件 IE Developer Toolsbar IE下的FireBug.HTML及CSS调试工具 http://www.windowsmarketplace.com/details.aspx?itemid=2695980 Microsoft Script Debugger Companion.JS 需要安装Microsoft Script Debugger才可 Companion.JS IE下的javascript调试工具. http://www.my-debugbar.com

我的SAP之旅 论坛SAP学习工具汇总贴

问题描述 http://bbs.mysapclub.cn论坛SAP学习工具汇总贴-教你如何区分level1/2/3教材1.录屏软件CamtasiaStudio3.0.0推荐http://bbs.mysapclub.cn/thread-1260-1-1.html1楼一款简捷的录屏工具http://bbs.mysapclub.cn/thread-1242-1-2.html1楼2.kep格式阅读器SAPSHOW和破解http://bbs.mysapclub.cn/thread-88-1-1.html1