本来是想介绍semantic-ui的，但如果只介绍这个框架，没什么内容，框架相关feature站点上有不需要说，所以干脆列出自己常用的几个前端框架，算是做个阶段性总结。
本文的核心是侧重于html/css的框架，js框架或以js为核心的框架不讨论(比如yui)；多屏已是既定事实，虽然不是所有开发都要考虑自适 应，但有自适应功能至少说明了这框架短期内不会被淘汰，所以不带自适应功能的框架不讨论(比如flaminwork)；非开源、不可商用，或是需要付费的 框架不讨论(比如easyframework)。
先说bootstrap，这两年都在用它，如今 bootstrap有点烂大街了，难免有些审美疲劳。但想想在bootstrap这种框架出现之前，程序员做的界面实在是惨不忍睹，如今至少升级成“还能 看”的级别了，所以“泛滥”这个问题是瑕不掩瑜的。平时开发个小工具用它来做界面，写个底层脚本用它来做文档界面，工作环境中也可以用来做原型或是布局， 谁都看得懂没什么学习成本。总体来说，这个框架对于互联网的美化实在是功不可没。
bootstrap的优点是拿来就能用，节省时间。缺点是class满天飞（也许你看到这篇文章的时候它已经变好了但不影响我现阶段的吐槽），而且不够语义化，也不适合做定制最多改改颜色，如果对自适应有定制需求可以考虑用foundation来 替代。这个框架我最初是用来写产品原型的(这个用途现在已经被bootstrap替代了)，结果到3.0版foundation更改title为“全世界 最先进的前端自适应框架”(most advanced responsive front-end framework in the world)，是否最先进有待商榷，但它在自适应方面的定制性确实比bootstrap好，bootstrap有的控件它都有。
我没在生产环境中用过foundation，12年6月它由原型工具转型成前端框架时，bootstrap已经很流行了，有twitter做技术后 盾，不太可能说服程序员转向foundation。现在的4.0版本用zepto替换了jquery，如果项目中在用zepto可以考虑用它代替 bootstrap。
接下来才是本文的重点semantic-ui。这名字就是它最主要的卖点了：语义化。semantic-ui比bootstrap更语义化，使 用了更容易理解的标签名称：导航的是nav，主要内容的是main，class名也很明确，而且不像bootstrap需要套很多层。bootstrap 很通用，兼容性很好，甚至能兼容低版本的ie，semantic-ui则更geek，有不少css3的特性，比如shape和reveal就很有趣。从界面设计风格来说，semantic比bootstrap(2)更扁平化：
这些特性都很fancy，但我现在用semantic-ui替换boostrap，主要是因为它的js插件(modules)更容易操作，预设了一些常用动画，视图(views)中的评论(comment)和动态信息(feed) 实在是帮了大忙。反正我需要用到的bootstrap功能它都有，于是欢乐的更换了semantic-ui。大多数的样式效果semantic-ui都比 bootstrap代码量少，在相同的熟练程度下开发起来比bootstrap快。而且提供多种主题，一定程度上避免了bootstrap千站一面的问 题。
再找找缺点，我刚开始用的时候，被semantic-ui的grid坑 过。自适应的问题，bootstrap通过md/sm/xs定义在不同屏幕宽度下的显示，虽然麻烦，但容易控制。semantic-ui是用 stackable/doubling来实现，而且还能手动调整，不知不觉就被玩坏了。似乎这个框架的设计接近ruby的哲学而不是python的，同一 个需求有多种方式来实现，比如我要实现列表，可以用list或是items；要实现侧边栏，可以用rail或是grid，选择多了有时候也是很纠结的问 题。还有，semantic-ui完整的库文件很大，js+css文件有接近500kb的大小，考虑到国内的网速，这个体积显得有些庞大了。可以用 nodejs自己build，前提是清楚每个组件具体是干嘛。
以上框架适合擅长实现功能(前端的js以及后台相关交互)但不擅长设计的程序员，用以上框架可以快速做出一个不错的web界面。另一种场景是自己会设计，或是由专业设计师出设计，再转成html/css，上述框架就太重了，很多功能用不上。
这种情况我通常只需要框架来做布局(grid)，10年写过一篇文章介绍网页设计多用960px宽度的原因，当时还在用960gs，但自适应的需求960gs满足不了，就用了一段时间的lessfreamwork。最近960gs的作者开发了unsemantic，于是又换成了unsemantic。在编写自适应网页时，要根据设备的不同加载不同的css文件，unsemantic都替你切分好了，省时省力。
最后得说说topcoat，可以认为 semantic-ui - unsemantic = topcoat。有时候只需要一个单页面，甚至都不需要导航条，我是用topcoat+布局类框架来做的。topcoat可以让各类页面元素更美观，纯css实现，文件小，更灵活也更容易定制。
以上，再次强调本文的目的是布道用，在开发个人项目的程序员们可以考虑尝试semantic-ui，前端框架的更换风险小，有更多地小白鼠，不，实际用户之后才更利于这个框架被用于生产环境中。需要例子可以参考：erya - 基于semanticui + django的内容发布系统，demo地址是: http://bbs.dmyz.org/
http://dmyz.org/archives/548