共有86篇文章被收藏推荐
鲜果类别:
IT.科技
收录于2007-07-25
认领
报错
推荐
http://www.pbase.com/carol_keeler_photo/still_life

学习比较这些框架的最好办法是真正用这些框架做些什么。为了能更好地理解css grid框架,我决定用blue print, grid 960, emastic分别来改进我的blog.
今天晚上只做了blueprint的,但已经有一些感受了:
1. 使用css 框架对布局非常有帮助。
过去手写css常常出现的问题是,一些div会出现在不该出现的地方,比如本来期望在左边的,但掉下去了;本来你希望换行的,但漂浮在某一侧; … 虽然这些问题最终能解决,但对css不太熟练的时候,或者遇到某些奇怪情形的时候,为不能准确定位一个块是很浪费时间和让人泄气的。 css grid框架最大的优势在于此: 你简单指定一些块的class name, 他们就出现在他们该出现的地方, no hassle!
我用blueprint来改写目前的blog也非常简单,基本只是加入了blueprint的标准css, 然后把我的page container, header, maincontent, side bar, footer的div加入了blueprint的class name, 就ok了。 由于我自己过去这些块都用了id name, 我只是添加class name, 别的都没改。
过去的css中有一些干扰和冲突的部分我去掉了,其他的具体样式如背景、header等都保留。
2. Semantic ID/class name可以照常保留。
这是我在第一篇的时候的一个担心,就是页面内的classname全部变成难看的框架的class name. 现在看来这是多余的。一般semantic的class/id 你仍然需要添加自己的样式,因此保留是必须的,添加入的只是和grid 框架相关的class name.
3. 对Grid概念的理解
更正一个对Emastic CSS Framework的误解,我前文在看了文档后怀疑“从例子可以看出来。不过如此灵活带来的问题就是,在这个框架内"Grid” 概念被弱化了”, 我现在认为是我错了。 当然这种理解错的原因是因为grid 960, blueprint的文档看多了导致的。:) 具体解释下:
Grid 960, Blueprint的基础是人为页面总是定宽的,因此他们的概念中的grid就是等距的,但是Emastic是一个支持Fluid的grid, 也就是你可以认为grid线的位置是弹性的,一个grid系统的关键并非grid等距,而是能准确地在不同地方指定基于grid的对齐,emastic显然能帮助我们做到,这不但不是弱化的grid, 而且是强化的grid.
Emastic中指定grid通过em + fluid来进行:

Grid 960, Blueprint的基础是等距离的grid:

我常用的account有Google Account, Live ID, 但我几乎从来记不得我的Yahoo ID, 虽然Yahoo的帐号可能是我最早有的帐户之一,从My Yahoo!推出的时候。
为什么我从来记不住Yahoo ID? 我自己也不明白为什么,Yahoo也许对password有些特殊要求导致我输入密码的时候我的任何一个常用密码都无法使用?或者其他什么原因? 总之,每次我要试图登录yahoo, 总是说密码不对,我尝试n个我用的密码,往往没有一个能登入,于是只好放弃重新注册一个…于此循环往复,如今我每个常用的user id都已经在yahoo用过了,当然除了一个刚刚登录失败又被锁定的帐户外,其他的都已经永久成为了死帐户。
最让我气愤的是我的flickr, 由于yahoo一定要把flickr帐户绑定到yahoo id上,同样的事情发生了,我再也进不去了,虽然我还记得我的flickr是: http://flickr.com/mave99a/ , 但我已经无法使用了。 我想一定是那天,我怎么也登不入yahoo, 于是新注册一个,我记不得id了,也记不得密码了。
今天准备给我的新flickr帐户缴费,结果yahoo要我输入密码,不幸的是问题再度发生了…使用找回密码功能,总算允许我输入新密码了,可是不知道为什么yahoo就是说我的密码不符合要求,虽然我仔细看了其细则完全是符合的,密码后面的强度提示也显示”strong”, 尝试了几个组合都不行,然后yahoo提示:
Sorry, this account is temporarily locked
This account has been temporarily locked because of security concerns.
The lock on your account will expire in approximately 24 hours—the lockout period will not reset each time you attempt to sign in while the account is still locked. You can try to recover your password again after the lock has expired. See you tomorrow!
我知道这听上去很安全,然而yahoo今天直接减少了$48的收入,很可能圣诞前也会减少这么多。:) 同时Internet上出现了这篇批评的文章。
--
BTW: 我的记性不算太差,使用密码也还算有经验,我的第一个hotmail帐户、第一个ICQ帐户(21841133), 第一个GMail帐户至今都没有忘记过密码,但yahoo的帐户我好像至今没有几次能顺利登回的。
也许有UX的高手能分析下这里面是否存在什么设计和可用性的问题。




学习了Emastic CSS Framework,这个framework的fluid的支持是比较好的,从例子可以看出来。不过如此灵活带来的问题就是,在这个框架内"Grid” 概念被弱化了(这是我的理解,如果您发现我理解错了请留言指出)。另外就是它的文档和工具很缺乏,唯一的办法就是读代码来理解。
对我这种缺少美术设计的人来说,我希望一个css framework能帮助我弥补在平面设计上的不足,而我自己对css的理解和掌握其实不需要框架也可以实现各种灵活的效果,所以似乎这样太灵活的东西对我的帮助不大?
现在觉得960 Grid和blue print的一个重要优势是,他们都提供了工具,如PDF格式的样板,可以打印出来设计草图,以及PSD的PS文件用于屏幕上设计效果。 这些东西对我的帮助是比较大的,Blue print已经有一些不错的字体和屏幕设计也可以帮助我快速地重用。
960和blueprint目前对我的唯一不爽之处是对fluid的支持。
在grid框架选择上有经验的朋友请不吝赐教。


