6个卓越Web设计细节

发表时间:2010-09-2

优秀设计和卓越设计之间的区别是比较小的。一般人可能无法解释说明卓越的设计的具体差别,但他们可以找到自己喜欢的网页设计作品。通过对照一下几个 优秀作品,我总结了一下作为卓越设计的几个细节差别。
前不久,我写过一篇卓越网站应该遵循的4个设计原则。现在这篇文章有点像是上一篇文章的延续。在上一篇文章里面我们重点讨论了对 比、重复、对齐、分割在网页中的应用。以下内容我以几个优秀的网页作品作为实例,来说明卓越设计一直遵循的原则!

一、合理使用渐变
渐变不要滥用,更不要把渐变弄的跟彩虹似的,否则你的网页作品看起来比较外行。总而言之,合理的使用渐变对于优秀网站设计是有帮助的。

渐变、散景结合使用
Newism网站色彩丰富,但微妙的渐变与背景在视觉上结合的很到位。如果你也有兴趣在photoshop里面做这个散景效果,可以去Abduzeedo’s tutorial网站上面学习一下。
jiaocheng01 阅读全文 »

Categories: 交互设计 | No Comments

如何做得Banner通情达意

发表时间:2010-08-31

 

写在前面的话
有人觉得做个banner放2张图,排几个字的事,一点技术含量都没有,像其他门户banner基本上都是编辑们自己做的。我觉得这么说是不对的,其实一个banner可以研究的东西还是很多的,而且做一个banner是不难,难得是在短时间内做一个出彩的banner。门户的专题一般是编辑套模板拼成的,比较重要的专题,banner部分是由设计师来完成,一个banner的品质上去了,整个专题的质量感就上来了,所以这部分交给设计师来做也是重视品质的表现,这个毋庸置疑。但banner毕竟不比大型项目,从设计成本上说不可能给太多的时间给设计师,于是乎,设计师有时候是靠经验积累,有时候妙手偶得,质量也是时好时坏,更害怕的是当没有经验没头绪没有心情时,胸中无物,不知道如何下手,于是越急越乱,越乱越急,最后匆匆了事,这种状态下估计也出不了好的东西。在排除技术手段的前提下,如何通过一些经验的思考,让banner达到通情达意效果,也是我下面要说的,个人经验之谈,供大家参考。 阅读全文 »

Categories: 交互设计 | No Comments

网页设计师的七种类型

发表时间:2010-08-16

设计是一门共通的视觉语言,它超越所有的文化和国家地域的限制,同时它又是变幻无穷的一门艺术。虽然设计作品可以让全人类来共同欣赏,但是这些设计作品背后的艺术家们却是拥有他们自己独特的个性特征和天赋的个体。你是一名什么类型的设计师呢?你的原则是什么?你如何对设计社区贡献力量?来自不同社会生活的设计师们可能对这些问题拥有相似的答案,但是却是不同的。有些设计师认为自己有责任教育那些还没有创作出自己的网络设计作品和艺术的新手。有些设计师的目的在于提高互联网设计的整体质量。当然,也有些设计师主要是通过他们的才能来维持生计,最终为了将来能够过上好日子。

不管你当设计师是出于什么原因,你都是独特的个体:

  • 如果你想成为一名高薪的设计师,那么你得取悦客户。
  • 如果你希望获得设计师的奖项,那么就得关注自己的设计灵感。
  • 如果你想成为一名出色的设计师,那么你就得取悦大众。

认识七种不同类型的设计师


人们通常习惯戴面具来隐藏他们真正的感情、思想和性格特征。而设计师们也经常戴上他们自己的面具:与客户同台出席是另一个人;应对项目的细节时是另一个人;与同事共事协作是另一个人,与家人朋友交流时又是另一个人。人的天性就是根据他所扮演的角色来戴上不同的面具。 阅读全文 »

Categories: 网络文摘 | Tagged: , | 3 Comments

web设计趋势与潮流

发表时间:2010-07-23

19年前,世界上第一个网页诞生,它没有设计可言,由文本和url组成,样式只有最基本的<h1> <p>。 而如今,Web设计已经成长为独立而庞大的设计门类,一个网页的创造需要多个工种、多种技术的参与,其流程的复杂和挑战性已经超过任何传统设计类别。

这19年间,网站的拥有者越来越清楚自己的目标,而设计师们也越来越理性和专注,人们在不停寻求商业诉求、用户、审美和技术上的平衡点。每一年过去,都有无数过时的风格、特征元素以及实现技术被抛于身后。

设计风潮体现着一个时期内人们对特定的风格、趣味、审美、技术乃至理念等各种模型或特征的追随。新技术的发展、媒介载体的占有量的变化、新网站类型的诞生、全球的设计思潮的影响、行业领军者的转变、明星设计师个体的亮点,这些因素都在推动潮流的变化。 你可以回想一下那些曾经风靡一时的模式:复古的像素样式;Google的朴素之风;韩式清新插画风;Flashsite的兴起带来的不规则布局和动画的滥用;Apple引发的对质感的追求;用户和情境意识的觉醒;对细节的关注——圆角和阴影的广泛运用; Web2.0设计风潮中典型的配色和特征元素;空间与层次感的魔术……

09年流行的半透明风格:

阅读全文 »

Categories: 交互设计 | Tagged: | 3 Comments

改版,是一个问题。越来越多互联网公司产品人员意识到这个问题,无论是豆瓣的改版,还是Facebook的改版都遭到了用户的疯狂抵制。

  和传统1.0网站相比,2.0网站用户的力量被无限放大,也意味着用户在网站发展中拥有越来越多的话语权。任何的所谓改版,都会一定程度上影响已有用户的使用习惯,可能遭到用户的大规模抨击。

  这意味着,网站改版也许需要更多的智慧和精细化运作。

  为什么需要改版?

  一个网站刚成立的时候,总是陌生和懵懂,对于网站的核心价值有着最忠实的体现,这时候的网站可以被称为产品的初级阶段。

  伴随着用户需求和商业需求的变更,我们会给网站逐步作一些调整,以便更适应网站一步步发展的需求。当这些小的改变积累到一定程度,之前所做的产品界面设计和网站架构已经不能适应需求,这时候就需要改版。

  这一过程有点类似操作系统,我们刚开始接触XP的时候发现很爽,但是随着时间 阅读全文 »

Categories: 胡言乱曰 | Tagged: | 1 Comment

一组有意境的图

发表时间:2010-06-2

蛇,保护动物

Categories: 胡言乱曰 | Tagged: | 1 Comment

判断LOGO好坏的12条参考标准

发表时间:2010-05-28

要做一个漂亮的LOGO,或一个有创意的LOGO,对于大多数平面设计师来说并不困难。但要做一个成功的LOGO就相当困难了。这里有12条参考标准,可供设计师或客户去判断一个LOGO的好坏。

1. LOGO大要好看
当 一个logo大大的出现在户外看板上,它必须清楚的让所有人都一目了然,这是logo具有清楚辨识度的基本原则。

2. LOGO小要好看
当logo出现在明片上,比一个拇指还 小,因此设计一个logo,请用直径两公分的大小试试看,是不是缩小也一样好看。

3. LOGO黑白要好看
当你传真公司文件,logo颜色会变成 黑白,你的logo因该像Nike、Mac,在经过最糟糕的复制影印方式后看起来一样清楚。 阅读全文 »

Categories: 胡言乱曰 | Tagged: | No Comments

揭开SEO服务与SEO咨询中的骗局

发表时间:2010-05-17

seo

用心的人一看这个标题就是个悖论,SEO咨询不就是SEO服务吗?SEO服务难道不包涵SEO咨询?

几年前,就有人预测过,对将来SEO服务很不看好,原因很简单,因为无法保证它的效果。以及一些其他不可控因素。

这里牵扯到两个概念:1.SEO服务;2.SEO服务的效果;

什么是SEO就不用多说,它的价值已经被很多人认可,都知道SEO是很有前途的,也都知道SEO服务是有风险的,那么,这样的SEO服务究竟是什么呢?

答:一切跟SEO有关的SEO技术、SEO策略、SEO咨询、SEO培训、SEO指导、甚至SEO评论统可称为SEO服务!

那么,也就是说,关键词排名、整站优化、SEO指导、SEO培训、SEO顾问(也称SEO咨询),等等这些都是SEO服务。 阅读全文 »

Categories: 学习分享 | Tagged: | 1 Comment

深色调网页界面设计注意事项

发表时间:2010-03-20

深色调的网站设计是比较流行的,它能营造出简洁、富有创造性的效果。它能满足一些客户对网页设计风格的要求。然而,它并不能适用于每一个客户对网站设计风格的要求,设计师应根据实际情况而定。

尽管深色调的设计风格能做到引人注目的效果,但很多设计师不知道如果有效的使用它来打动、吸引浏览者。深色调网页设计经常出现的问题是不易读、没有吸引力、很少打破传统的设计模式。

这片文章,我们将讨论一些如何让你的下一个深色调网页设计更能吸引、打动广大浏览者的方法和技巧,真正做到让你的设计表达你的创意。最近的调查显示有超过47%的大众用户更喜欢亮色调的网页设计。内容的可读性是主要原因。大多数的用户不喜欢亮文字内容显示在深背景上,这样的对比效果是比较刺眼的,给人不舒服的感觉。 

相比之下,有10%的设计师通常选择深色调来设计网页,同时36%的人认为应该根据网页的具体风格要求进行选择。那么,哪个是正确的答案那?归结起来,每一个人都有自己的意见,事情就是这样。但是有相当一部分用户认为重色调的设计是可以接受的,有时是设计首选。作为网页设计师,我们不得不考虑如何有效的设计深色调的网页给我们客户与自己。信亮色调网页设计的爱好者们希望深色调的网页设计应该更易阅读、有好的用户体验。

多使用留白
或者应该叫“留黑”?合理有效的使用留白对于任何风格的设计来说都是非常重要的。但对于深色调的网页设计来说它则是必须的。
深色调的网页设计给人总体的感觉是“沉重的”,如果整体布局结构凌乱更增强了给人沉重的感觉。下面展示了一些比较受大众喜欢的深色调网页设计,他们合理使用了留白达到很好的设计效果。
Black Estate是互联网里深色调网页设计的一个而已,设计确实很棒并值得我们研究学习。设计自始自终都在合理、有效的使用留白,如何在设计元素周围有效的使用了留白,从而设计出了这样讲究的网页。 阅读全文 »

Categories: 交互设计 | Tagged: | 18 Comments

CSS 命名规范

发表时间:2010-03-12

XHTML-CSS写作建议

  1. 所有的xhtml代码小写
  2. 属性的值一定要用双引号(“”)括起来,且一定要有值
  3. 每个标签都要有开始和结束,且要有正确的层次
  4. 空元素要有结束的tag或于开始的tag后加上”/”
  5. 表现与结构完全分离,代码中不涉及任何的表现元素,如style、font、bgColor、border等
  6. <h1>到<h5>的定义,应遵循从大到小的原则,体现文档的结构,并有利于搜索引擎的查询。
  7. 给每一个表格和表单加上一个唯一的、结构标记id
  8. 给重要的区块加上注释,如:
  9. 给图片加上alt标签
  10. 所有的标签必须进行合理的嵌套
  11. 根元素前必须有元素,宣告使用那一种DTD
  12. 根元素必须有xmlns属性来指定使用http://www.w3.org/1999/xhtml的namespace

 
CSS样式表规范:

  1. id和class命名采用该版块的英文单词或组合命名,并第一个单词小写,第二个单词首个字母大写,如:newRelease(最新产品/new+Release)
  2. CSS样式表各区块用注释说明
  3. 尽量使用英文命名原则
  4. 不用加中杠和下划线
  5. 尽量不缩写,除非一看就明白的单词

 
CSS命名规范这段时间由于工作的需要对CSS的命名做了一些研究,主要是想让作出的文档等规范,更能让人看懂和读懂。 阅读全文 »

Categories: 学习分享 | Tagged: , | No Comments