HTML5 Startup Packs

同时欢迎到我的BLOG讨论 ： http://pagetalks.com/

 

当我们还在考虑JS或CSS框架的时候，有一群人已经在考虑整个站点的前端框架了。在这个层次，具体使用什么JS库已经不重要了，而是整个站点的结构，对客户端的兼容能力，以及测试等环节的把我。

 

在这里我介绍三个比较优秀的HTML Start-up Packs。

 

<h3><a href="http://html5boilerplate.com/" title="link to HTML5 BOILERPLATE">HTML5 BOILERPLATE</a></h3>

非常帅的一个站点前端骨架。不仅包括apache、nginx的配置文件、crsossdomain.xml、robots.txt、单元测试，它的HTML和CSS文件为移动设备提供了很完善的兼容性（基于Media Query）。

 

对于新手来说，可能有点太过了。不过即使这样，你也可以抱着学习的心态去学习整个HTML框架的结构。

 

<a href="http://pagetalks.com/wp-content/uploads/2010/10/boilerplate2.png"><img src="http://pagetalks.com/wp-content/uploads/2010/10/boilerplate2.png" alt="Boilerplate" title="HTML5 Boilerplate" border="0" width="322" height="434" class="aligncenter" /></a>

 

<h3><a href="http://sickdesigner.com/resources/HTML5-starter-pack/index.html">HTML5 Starter Pack by Radu Chelariu</a></h3>

这个骨架就相对于简单的多，更适合个人网站。仅仅包括必要的font-face和css query支持，以及html5 shim的简单代码。可定制性比较强。

 

<a href="http://pagetalks.com/wp-content/uploads/2010/10/radu-chelariu.png"><img src="http://pagetalks.com/wp-content/uploads/2010/10/radu-chelariu.png" alt="HTML5 Starter Pack by Radu Chelariu" title="HTML5 Starter Pack by Radu Chelariu" border="0" width="324" height="457" class="aligncenter" /></a>

 

<h3><a href="http://lessframework.com/">Less Frameworks 2</a></h3>

这个框架强调的就是设备兼容性，思路很清晰，其余部分也是留下很多空间自由发挥的。也是个非常棒的框架。而且它的文件都是在线生成的。

 

<a href="http://pagetalks.com/wp-content/uploads/2010/10/less-frameworks-2.png"><img src="http://pagetalks.com/wp-content/uploads/2010/10/less-frameworks-2.png" alt="Less Frameworks 2" title="less frameworks 2.png" border="0" width="287" height="539" class="aligncenter" /></a>

 

<h3>Some Final Thoughts</h3>

HTML5的时代其实已经来临，这里也不是讨论HTML5还是Flash的问题了。去迎接HTML5的最好方法还是积极的融入这些技术洪流之内啊。

 

可以说HTML5解决了一些以往无法解决的问题，例如本地存储、动画、高级选择符等等，可是时代又给了我们新问题，例如浏览设备兼容性。

 

有一点可以肯定，没有HTML5，Web Developer的日子会更糟糕！