HTML5 Boilerplate与HTML5重置
嘿大家–HTML5 Boilerplate和HTML5 Reset是两个HTML,CSS和JavaScript模板,内置了很多现代最佳实践。 他们的目标大致相同:
- 快速,健壮,现代的Web开发
- HTML5(杜!)
- 跨浏览器规范化(包括对IE6和移动浏览器的支持)
- 逐步增强和优雅的退化
- 性能优化
- 不是一个框架,而是你下一个项目的起点
显然,它们在function上非常相似。 他们的实现在哪些方面是不同的(例如,可能使用不同的技术来实现特定于IE的CSS修复)? 他们在范围上有什么不同? 看起来好像HTML5 Boilerplate有点大(构build工具,服务器configuration等),但是当涉及到人们将看到的实际网站时,很难知道HTML5的复位程度如何。
总的来说,这两个项目都为Web项目开发人员提供了一个坚实的起点。 他们都摆脱了许多繁琐的,一些容易出错的样板,许多开发人员发现自己为每个项目重新创build。 他们如何去做的细节略有不同,但在大多数情况下,他们取得了相同的结果。
正如您所指出的那样,HTML5Boilerplate已经添加了一些构build脚本部分,以帮助开发人员按照最佳实践来加速其服务器端项目(如远期过期标题等)的页面,因为HTML5Reset项目是更侧重于语义,内容和样式。 例如,HTML5Reset对HTML5中的页面内容有更多的示例结构(以帮助向人们展示如何使用某些新元素),而HTML5Boilerplate则没有。
HTML5Boilerplate包含的响应时间和页面速度部分越来越重要,因为越来越多的用户在移动平台上发现自己,并随着谷歌增加效果页面响应时间在页面上的排名 。 有很多论文显示,页面响应时间的小幅增加会对网站的使用和感知产生可衡量的负面影响( 特别是在电子商务环境中 …通常慢100ms的页面会减less销售量的百分比)。
在CSS前面,两个项目的大部分重置样式部分都非常相似,在基线设置上有一些细微差别。 然而,IE特定的修补程序在很大程度上是相同的,HTML5Boilerplate声明了比HTML5Reset更多的控制权,IE风格如何表单元素(如checkbox/单选button和有效/无效状态)
HTML5Boilerplate覆盖HTML5Reset的两个主要的CSS领域不是常见的帮助类,它们可以帮助使网站更易于访问,比如.visuallyhidden
和.visuallyhidden
,还有一些对打印样式的重大调整,这些打印样式可以使打印更加类似浏览器,以及一些成本节约和可访问的东西,如使背景图像透明(不要浪费碳粉),并添加实际的url链接和标题缩写。
我强烈build议阅读这两个项目的信息,以及他们如何做并排比较,因为相似之处,以及差异(和背后的推理)是相当丰富的信息,并帮助我更好地决定哪些部分每个我想用的。
最终,就像任何“库”类项目一样,作为开发人员,您需要了解自己在做什么,可能应该调整基准以满足项目的特定需求。
你可以使用任一个…
就像@ murtaugh说的那样(http://5by5.tv/bigwebshow/45),当你首先使用Reset时,你不需要学习任何东西。; 根据我的经验,在研发部门工作,当你需要演示或做快速迭代时,你可以使用复位(或锅炉,如果你已经知道它)。 当我需要构build产品进行部署时,我只是为了拥有更多的东西而转向锅炉。 适用于我,但现在,因为我知道我可以轻松地使用任何一个。
我其实几乎想说使用传统的reset.css是最好的…我发现在我的移动应用程序兼容性没有问题。 不过,我正在使用jQuery移动框架开发这些应用程序。
所以我想这是真正有条件的,你正在使用什么样的工具。 Phonegap似乎没有任何问题编译我的代码到所有的操作系统。 在仿真器中查看我的源代码看起来非常好
所以我真的没有看到一个样板的要点,除非你试图实现polyfills。
我在一个环境中工作,在这个环境中,以前的开发人员使用JQuery和Prototype来使用公司,这是一团糟。 我们不仅需要兼容模式,而且还要考虑到它带来的额外开销。 debugging时,Prototype“劫持”Firebug中的debugging信息,这导致更多的工作。 而疯狂的部分是,我已经解开了这个烂摊子好几个月,刚刚开始接近完成它…当我即将拉上原型的插头,我似乎总是find另一个依靠它的部分…
正因为如此,我每次都反对具有相似目的的框架组合。 例如,不pipe你觉得YUI Grid是多么酷,如果你加载整个YUI框架 ,最好不要做Jquery, Moo或Prototype。 你会不必要地陷入困境。 它杀死了加载时间(这会破坏用户体验 ),只会给开发人员带来麻烦和不必要的工作。
看看你的网站的这个阶段,像build立基础。 你有机会使用任何你想使用的东西,但是你必须小心,不要把自己弄到一个angular落。 所以,使用专门的和一stream的工具,根据您的资源可用。 不要只是使用一些可爱的东西! 我们很幸运,许多高质量的工具都是免费的,所以我们有一个select。 但是要知道,你正在为未来转向网站的方向,如果你的决定是匆忙做出的,你可能就是像我这样的人,必须处理后果。
因此,除非您永远不会使用其他框架,否则我会认可Reset …或甚至只是执行符合最高质量标准的CSS。