我已经使用 XHTML 大约 3 年了,并不太关心 HTML5 和 CSS3 的到来。几个月前,我偶然发现了HTML5 Boilerplate,现在我开始对它非常感兴趣。
我唯一找不到的是使用这套最佳实践的缺点。我知道,它的主要目标是让网站在各种浏览器上看起来都一样,但是有什么我应该注意的吗?
我已经使用 XHTML 大约 3 年了,并不太关心 HTML5 和 CSS3 的到来。几个月前,我偶然发现了HTML5 Boilerplate,现在我开始对它非常感兴趣。
我唯一找不到的是使用这套最佳实践的缺点。我知道,它的主要目标是让网站在各种浏览器上看起来都一样,但是有什么我应该注意的吗?
有什么我应该注意的吗?
当然是。这不是即插即用的东西。或者至少,它可能是那样的,但它并不是为此而设想的。如果您以这种方式使用它,您将无法享受它的最佳效果。Boilerplate 非常灵活,您必须学习如何自定义它。句号。
我个人的建议是开始尝试它并研究它提供的功能。对我们来说幸运的是,它有据可查,您可以学到很多东西。不仅是样板本身,还有关于 HTML5、CSS3、资源加载和性能相关问题/变通办法、浏览器怪癖以及如何修复它们、移动开发技巧、polyfill 和条件加载以及许多其他方面的规则和最佳实践疯狂的东西。一旦您意识到它的可能性,如果您发现缺点,您将能够自定义基本样板。
从这里开始,阅读文档,点击每个链接,不要试图走捷径。这需要时间,但你会得到很好的回报。如果你有麻烦问。
对于更具体的事情,我很快发现的一个缺点(但有人认为这是一个优点)是样板文件不提供 CSS 网格。不是一个大问题,我发现adapter.js很容易集成,所以我用adapt.js的reset stylesheet替换了normalize.css并使用了网格。
几个月前我注意到的两件事是 javascript 在正文底部加载的方式。如果不仅它看起来很脏,我不是这个的忠实粉丝。此外,我自己测试了加载,并没有注意到更好的 javascript 加载。事实上,它在一个巨大的脚本上运行慢了几毫秒。
还有我尝试了几次的 normalize.css,但发现自己重新设置了比以前更多的填充和边距。这当然是正常的,因为它的目标有点相似,但方法不同。我把它改成 Eric Meyer 的 reset.css 只是因为我习惯了。
我真的很喜欢modernizr 脚本和实现x 浏览器结果的方式。以 Google Analytics 实施为例。
我记得的另一件小事是标题标签的放置。出于 SEO 的原因,我将其更改为最高位置。