响应式设计,我选择 unsemantic.css 框架,大家的选择呢?

2014-07-02 12:39:44 +08:00
 kmvan
很久之前,用过960的响应式,总感觉怪怪的。现在几个项目都用上了 unsemantic,看起来适应性还可以。

优点:
1、自由。unsemantic 是用百分比来设定宽度,只要能整除100就可以(33%)也算,例如 div.grid-33.tablet-grid-50.mobile-grid-100(PC上显示3列,Pad上显示2列,手机上显示1列),这样看起来算是比较友好吧,不用管16grid还是24grid之类的。
2、使用 box-sizing:border-box 属性,方便设计,老式浏览器需要用js兼容。

缺点:
1、冗余。正如其名,unsemantic,无语义化,不仅是命名的class无语义化,甚至连盒子元素(div之类)的也是无语义化,严格来说是冗余。因为他的列距是用 padding 的!所以子元素想要用颜色填充该列,不能够 <a.grid-50>BLOCK</a> 这样写,而要 <div.grid-50><a>BLOCK</a></div> 这样写。
2、使用 box-sizing:border-box 属性,老式浏览器需要用js兼容。


附上框架homepage: http://unsemantic.com/

大家来介绍下自己用的响应式框架吧,简单介绍一下:)马克。
5664 次点击
所在节点    设计
29 条回复
P233
2014-07-02 17:52:45 +08:00
在用改造过的 bourbon neat,正在写自己的一套 gird system
krafttuc
2014-07-02 18:30:27 +08:00
人肉
zythum
2014-07-02 18:40:15 +08:00
刚人肉写了一个...
itommy
2014-07-02 18:40:24 +08:00
作者太幽默了

在页面底部:
"Note: If you reached this site by mistake, perhaps you are seeking Unsemantic's arch nemesis… Semantic.com"
julio867
2014-07-04 17:10:50 +08:00
用了960和Bootstrap之后,觉得最灵活的响应式应该是自己写的框架,根据项目特点来定,不一定要网格系统;而且,响应式设计本身,并非是使用某个框架就可以解决的事情,它涉及到产品、交互、设计、技术等若干个环节;再者,如果最初的响应式设计的思想是停留在使用 media query 适应不同的设备的话,那么现在的响应式思想已经发展更远了,已经不再是单纯的“设备”的响应,而是“内容”的响应~~
zencoding
2014-07-04 20:58:31 +08:00
@julio867 大赞
kmvan
2014-07-04 23:20:27 +08:00
@julio867 确实,内容响应更要要高点,夶有啥关于内容响应的库呢?
julio867
2014-07-05 17:59:40 +08:00
@kmvan 目前来说内容与设备还是无法分开的,相辅相成,我也没用过我觉得满意的框架可以解决我遇到的问题,也希望大家能提供~~不过,产品、交互、设计、技术等相关人员还是得对响应式设计有深刻的体会,才能设计出好的产品并形成自己的“框架”,如果这些角色能集中于一个人身上,那应该是最完美的了~
zyx89513
2014-07-06 22:39:28 +08:00

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/120578

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX