谈网站界面设计(UI设计)(3)
三、 色彩在设计中的运用
(一)色彩的常识
最基本的有三种(红,黄,蓝),其它的色彩都可以由这三种色彩调和而成。我们称这三种色彩为“三原色”。 黑白灰属于非彩色系列。其它的色彩都属于彩色。任何一种彩色具备三个特征:明度、纯度和色相,其中非彩色只有明度属性。
明度,也叫亮度指的是色彩的明暗程度的大小,明度越大,色彩越发亮。比如一些购物,儿童类网站。用的是一些鲜亮的颜色,让人感觉绚丽多姿,生气勃勃。明度越低,颜色越暗。主要用于一些游戏类网站,充满神秘感;一些个人站长为了体现自身的个性,也可以运用一些暗色调来表达个人的一些孤僻,或者忧郁等性格。有明度差的色彩更容易调和。如紫色(#993399)跟黄色(#ffff00),暗红(#cc3300)跟草绿(#99cc00),暗蓝(#0066cc)跟橙色(#ff9933)等。
纯度,指色彩的鲜艳程度,纯度高的色彩纯,鲜亮。儿童、动漫、时尚、购物等多用亮色调,给人以活泼、明朗、大方特点,纯度底的色彩暗淡,含灰色。多用于艺术、科技等技术含量高的领域,给人以深远、稳重之感。
色相,指的是色彩的名称。这是色彩最基本的特征,是一种色彩区别于另一种色彩的最主要的因素。比如说红色,绿色,蓝色等等都代表了不同的色相。同一色相的色彩,调整一下亮度,或者纯度很容易搭配,比如,深红,暗暗,桃红等。
暖色,暖色跟黑色调和可以达到很好的效果。暖色一般应用于购物类网站,电子商务网站,儿童类网站等等,用以体现商品的琳琅满目,儿童类网站的活泼,温馨等等效果。
冷色,冷色一般跟白色调和可以达到一种很好的效果。冷色一般应用于一些高科技,游戏类网站,主要表达严肃,稳重等效果,绿色,蓝色,蓝紫色等等都属于冷色系列。
相近色:色环中相邻的三种颜色。相近色的搭配给人的视觉效果很舒适,很自然。所以相近色在网站设计中极为常用。
互补色,色环中相对的两种色彩。对互补色,调整一下补色的亮度,有时候是一种很好的搭配。
色彩均衡,网站让人看上去舒适,协调,除了文字,图片等内容的合理排版,色彩的均衡也是相当重要的一个部分。比如一个网站不可能单一的运用一种颜色,所以色彩的均衡问题是设计者必须要考虑的问题。色彩的均衡,包括色彩的位置,每种色彩所占的比例,面积等等。比如鲜艳明亮的色彩面积应小一点,让人感觉舒适,不刺眼。这就是一种均衡的色彩搭配。
(二)色彩的运用
蓝色是现代商务领域的流行色,也是最“安全”的WEB流行色。如果设计师对自己控制色彩的能力没有太大把握,那么使用蓝色是最好的选择。蓝色受设备偏色的影响最小。
红色既可以象征着热血、激情、冲动、勇气与力量也可以象征恐怖与暴力,在主要由红色构成的色彩中,有桃红色的浪漫与温馨,也有深红色的稳健与深沉,由于红色本身的亮度和饱和度都比较强,所以在与亮度和饱和度同样比较强的冷色(如蓝色绿色)相配时,中间最好能有一些过渡行的颜色。比如纯红与纯蓝搭配时可以在中间插入面积适中的白色,这样一来,页面中各视觉元素之间的冲突就不会那么强烈。
黄色是一种非常难以驾驭的颜色,同一种黄色与其他颜色搭配在不同的环境下表现出的视觉和心理效应往往会有很大差异,同样的黄色既可以在某个环境中表现出热情奔放的一面也可以在另一种环境中表现出阴险狡诈的一面。
绿色由于自身很难与其他颜色搭配,所以是网页设计中比较少用的颜色,在以绿色为主的优秀网页设计中大多会有橙色的参与。
橙色是朝阳的颜色也是柑橘的颜色,橙色象征着快乐、温馨、时尚和动感。橙色有红色热情奔放的特点,但又不像红色那么鲜艳和夺目;橙色有黄色敏快和爽朗的一面但又不像黄色那么容易产生平庸的感觉,大面积使用橙色的网页,可以让人感觉到扑面而来的温暖与活力。另一方面,网页设计师们越来越喜欢在白色、绿色、蓝色、灰色、黑色的网页中使用小巧而醒目的橙色元素,比如,橙色的小箭头、小按钮等元素,这种设计可以非常有效的吸引浏览者的注意力。
紫色与红色蓝色在色调上有着近似的关系,与黄色、绿色、橙色等可以形成鲜明的对比,深紫色适于表现幽雅、神秘、忧郁等主题,浅紫色则适于表现浪漫温馨等主题。
(三)确定网站的主题色
一个网站不可能单一的运用一种颜色,让人感觉单调,乏味;但是也不可能将所有的颜色都运用到网站中,让人感觉轻浮,花俏。一个网站必须有一种或两种主题色,不至于让客户迷失方向,也不到于单调,乏味。所以确定网站的主题色也是设计者必须考虑的问题之一。
一个页面尽量不要超过4种色彩,用太多的色彩让人没有方向,没有侧重。当主题色确定好以后,考虑其它配色时,一定要考虑其它配色与主题色的关系,要体现什么样的效果。另外哪种因素占主要地位,是明度,纯度还是色相。
(四)色彩的搭配
在学习了解了色彩的一些基本概念及色彩的一些搭配问题,具体运用到网页中,各要素的色彩又是如何搭配的呢?
1、网页标题
网页标题是网站的指航标,浏览者要在网页间跳转,要了解网站的结构,网站的内容,都必须通过导航或者页面中的一些小标题。所以我们可以使用稍微具有跳跃性的色彩,吸引浏览者的视线,让他们感觉网站清晰、明了,层次分明。想往哪里走都不会迷失方向。
2、网页链接
一个网站是由许多页面组成的,实现网页间相互跳转的就是网页的链接,所以文字与图片的链接是网站中不可缺少的一部分。这里特别指出文字的链接,因为链接区别于文字,所以链接的颜色不能跟文字的颜色一样。大多数浏览者不会花太多的时间用在寻找网站的链接上。设置了独特的链接颜色,让人感觉他的独特性,自然而然好奇心必然趋使他移动鼠标,点击鼠标。
3、网页文字
多数网站都会运用背景颜色,这就要求设计者考虑到背景颜色的用色,以及前景文字的搭配等问题。一般的网站侧重的是文字,所以背景可以选择纯度或者明度较低的色彩,文字用较为突出的亮色。让人一目了然。
4、网页标志
网页标志是宣传网站最重要的部分之一,所以这两个部分一定要在页面上突迎而出。怎样做到这一点呢?我们将LOGO和BANNER做的鲜亮一些,也就是色彩方面跟网页的主题色分离开来。有时候为了更突出,也可以使用与主题色相反的颜色。
5、网页的留白
中国的书法讲究留白,好的留白的运用可以带给浏览者对画面的联想,更为重要的一点就是,在网站使用中浏览者通常会划动鼠标来快速浏览页面,如果没有留白,浏览者很可能会误点链接,给浏览带来不便。
为了能让自己的网页设计得更靓丽、更舒适,为了增强你的页面的可阅读性,必须合理,恰当地运用与搭配页面各要素间的色彩!
综上所述,我们了解到网站的界面不单单是美工设计那么简单,它包括了心理学,生理学,平面构成,色彩构成等多方向的知识,只有了解并可以很好的运用这些知识,我们设计出的网站才能更好的为受众服务。
- 上一篇:公司企业网站设计方案书
- 下一篇:企业塑造品牌,迫在眉睫