Javascript HTML5样板与HTML5重置

大家好，这是两个HTML、CSS和JavaScript模板，内置了许多现代最佳实践。他们的目标基本相同：

• 快速、健壮、现代化的Web开发
• HTML5（废话！）
• 跨浏览器标准化（包括对IE6和移动浏览器的支持）
• 渐进增强和优雅退化
• 性能优化
• 不是一个框架，而是下一个项目的起点

---

显然，它们在功能上非常相似。它们的实现在哪些方面不同（例如，可能IE特定的CSS修复是使用不同的技术实现的）？它们的范围是否完全不同？HTML5样板文件似乎有点大（构建工具、服务器配置等），但当人们看到实际的网站时，很难知道HTML5重置的范围之外还有什么。

一般来说，这两个项目都是为了为从事web项目的开发人员提供一个坚实的起点。它们都摆脱了许多乏味的、容易出错的样板文件，许多开发人员发现自己为每个项目重新创建了这些样板文件。他们如何进行的细节略有不同，但在大多数情况下，他们取得了相同的结果

正如您所注意到的，HTML5样板在一些构建脚本片段中添加了帮助开发人员遵循最佳实践，在服务器端项目（如far future expires标头等）方面加快页面速度。其中，HTML5重置项目更关注语义、内容和样式。例如，HTML5重置对HTML5中的页面内容有更多的示例结构（帮助向人们展示如何使用一些新元素），而HTML5样板则没有

随着越来越多的用户发现自己在移动平台上，以及谷歌提高了效果，HTML5Boilerplate包含的响应时间和页面速度部分变得越来越重要。有很多文章表明，页面响应时间的小幅增加会对网站的表现产生可测量的负面影响（…通常，页面速度慢100毫秒会减少销售百分比）

在CSS方面，这两个项目的重置样式部分的大部分内容非常相同，只是基线设置有一些细微的差异。然而，IE特定的修复程序大体上是相同的，HTML5样板比HTML5Reset更能控制IE对表单元素（即复选框/单选按钮和有效/无效状态）的样式设置

HTML5样板所涵盖的HTML5重置所没有的两个主要CSS领域是帮助网站更易访问的常用帮助类，如

.hidden

和

.visuallyhidden

，以及对打印样式的一些重大调整，这两个类都可以使跨浏览器的打印更相似，以及一些成本节约和可访问性的事情，如使背景图像透明（不浪费墨粉），并添加实际的URL链接和标题的缩写

我强烈建议阅读这两个项目的信息，以及它们是如何并行比较的，因为它们的相似之处和差异（以及它们背后的原因）是非常有用的，并帮助我更好地决定我想使用它们的哪些部分

---

最终，就像任何“库”类型的项目一样，作为开发人员，您需要了解自己在做什么，并且可能应该调整基线以满足项目的特定需求。

我工作的环境中，以前的开发人员强迫公司同时使用和……这是一个混乱的环境。我们不仅需要在兼容模式下工作，还要考虑它所导致的额外开销。在调试时，原型“劫持”Firebug中的调试消息，这将导致更多的工作。令人恼火的是，几个月来我一直在解决这一混乱局面，而且我刚刚开始接近完成它……就在我即将拔掉原型的插头时，我似乎总能找到另一个依赖它的部分

正是出于这个原因，我每次都反对具有类似目的的框架组合。例如，无论您认为它有多酷，如果您加载整个系统，您最好不要使用Jquery或Prototype。你会无谓地陷入困境。它缩短了加载时间，只会给开发人员带来麻烦和不必要的工作

请查看你的网站的这个阶段，比如建立基础。你有机会使用任何你想使用的东西，但你必须小心不要“把自己画到角落里”。因此，请根据您的资源使用专门构建的同类最佳工具。不要只是用一些可爱的东西！幸运的是，很多高质量的工具都是免费的，所以我们可以选择。但要知道，你正在为网站的未来指引方向，如果你仓促做出决定，你可能会像我一样不得不处理后果

---

所以，除非你永远不会使用另一个框架，否则我支持重置…甚至只是做符合最高质量标准的CSS。

你可以使用任何一个

就像@murtaugh说的(http://5by5.tv/bigwebshow/45)当你第一次开始重置时，你不需要学习任何东西。根据我的经验，在研发部门工作时，当你需要演示或进行快速迭代时，你可以使用重置（或者锅炉，如果你已经知道的话）。当我需要构建用于部署的产品时，我转向Boiler，因为它有更多的东西。

---

对我来说很有用，但现在因为我知道这两种方法，我可以很容易地使用其中任何一种。

实际上我几乎想说使用传统的reset.css是最好的。。。我发现我的移动应用程序没有兼容性问题。但是，我正在使用jQuery移动框架开发这些应用程序

所以我想这是有条件的