要使一个设计看起来协调、井然有序并且具有专业感,这样就要专业的配色技巧.今天我们来看下如何用色彩制造出具有专业感的网站
使用色彩的最好方式就是从无色开始。在担心何种色度的黄绿色用起来更好之前,从设计中去掉色彩可以暴露出那些必须解决的基本问题。如果设计没有在黑白色下感觉正常,那么就需要做改动了。是否每个页面都有明确的目的?设计是否引导读者到页面内容?这些内容是引人入胜的,令人振奋的还是让人大开眼界的?标题是否清晰?连接是否与其他文本形成对比?色彩提供了这些功能,但是排版、字体和内容组织问题的解决,无法由色彩单独完成。要做重新设计,首先应该抽出色彩。冲掉过分饱和的初级目标,这一简单的动作就能显示一个网站的立场
色彩具有三个参数:色相、饱和度和明度(有时也称为亮度)(*HSV&HSL)。(*注: wikipedia - HSV&HSL)饱和度是指色相的纯度:霓虹灯的色彩饱和度高,而粉笔的色彩饱和低。亮度值表示一个色彩有多亮(即更靠近黑色还是白色)色相指的是色彩位于彩虹的哪个部分,比如红色或是绿色;人们总是对这一特性束手无策。没有哪样会像色相冲突一样对配色方案产生致命影响。即使一个设计使用了同一色相的上百种色度,从低饱和色到高饱和色,还是会看起来整齐划一,但是色相搭配错误的话,配色方案就会变得零散。有一种防止色相搭配冲突的办法就是将他们用第三种颜色分割,用黑色、灰色或是白色缓冲是最安全的,因为灰度的色调是中性的:你可以将彩虹中的任何色彩与黑白灰协调起来。第二种解决办法是对不同色相使用不同的比例。如果一个配色方案有,比如说,紫罗兰色和棕色,那么这个设计可以使用大量不同色度的棕色和一些亮紫罗兰色的高亮。另一个选择是变换明度。纯蓝色和亮青色结合是感觉一般般;但是深蓝色(海军蓝)和浅青色(天红蓝)拥有足够的对比度使得它们相互吸引。红色和紫罗兰色的差色不足以相互冲突,但是也不太容易区分;浅红色(粉色)和深紫罗兰色就有区别了。不幸的是,阻止一种错误的色彩加入和选择一种好的色彩并不是同一件事情。一个配色方案是否成功,不在于你是否感到满意,而在于你的观众是否感到舒适。
优秀的配色方案来自哪里?在上百种色彩和上千种组合中,你该如何选择?来自小型静态站点的设计者们会从内容中选取颜色。通常是指照片。在刚完成的一个八页网站设计中,我搭配了一个精心制作的金属支架来协调靛青色的天空。设置PS的取色工具的取样大小设置在5x5平均,我取出了天空里最暗和最亮的部分,然后将这几个差不多的色度分给了边栏、连接、标题以及页脚。当客户向我们询问我们如何能将网站设计的又好又快时,我们的回应是:“这是我们的本职(This is what we do——或者你不会喜欢的:这是我们应该做的)。”但其实,色彩已经在那里了,我需要做的只是把它寻找出来。相对存储的相片能用于解决快速设计的站点来说,大型动态网站的设计者们则需要从寻找他们的浏览者那里寻找灵感。浏览者的日常服装将是吸引他们的一个非常棒的指示。了解访问者平时穿什么,然后你就会知道怎样的色彩让他们感到舒服。如果你的网站是关于,比如说联赛,就该了解人们穿什么去看比赛而不是他们在工作中穿什么。如果你很幸运地弄到了目标人群的照片,那就将他们看成一体;你需要一个人群的平均。但是如果没有照片,那么去商店购物吧。能够持续经营的服装设计师们通常拥有对每一种情绪和生活方式都很棒的色彩感。不过你不需要跑到第五大道高级时装公司去,只要用google搜索下“野营用品商店”、“婴儿服装”、 “滑雪和泳装”以及“休闲生活”就能够得到很多非常不错的色彩搭配人们根据他们的品位穿着衣服。如果你使用了他们喜欢的色彩,那么他们浏览时会感到更舒适。
色相、饱和度和明度的轻微的抖动形成了纹理。单色纹理(就是只有一种色相的纹理)和图案给大多数网站提供了一个微妙的维度而不产生冲突。特别是,简单的纹理背景非常容易制作:
图层的名字不是随便选的,你可能需要尝试不只一张照片,最好别给你的图层类似“墙壁纹路”或者“纸张纹路”,你需要专注于它在网站上的效果,而不是它来自哪里
一套良好的配色方案有既定的特点。要将它看成是让设计保持一贯统一的一个框架或者是一套准则。一套配色方案应当:
六、使用即有框架以后的图形
、照片和图标是否能跟现在的配色方案协调?这个网站六天、周或者六个月后会需要一张怎么样的图片?这很难确定,但是内容确实是你的网站配色方案中的一部分。你可以通过制作根据配色方案制作图片或者是让你的配色系统跟着图片走来解决这个问题。要让你的配色方案生效,同时也对照片生效,一个非常好的办法是让所有页面看起来一致。最简单的解决方式是找到符合配色方案的照片。要记住配色方案具有一定的回旋余地:只要一张图片的主要色相与配色方案吻合,就可以使用。很多存储照片的网站允许你通过色彩搜索图片(我的意思是色相:通常主要是像红色、绿色和蓝色之类)。如果一张图片不符合你的配色方案,那就对它染色
七、具有专业感
没有任何一组色彩是“专业感的”或者是它本身。确切的说你得根据某个工序让它们有一种协调的井然有序的感觉。不管网站是关于什么的,浏览者都会知道它对待自己要做的事是认真的。