当前位置:首页 >> 计算机软件及应用 >>

网页设计与色彩_图文

色彩与网页设计
【摘 要】 :在网页设计中,颜色的搭配使用占据着相当重要的地 位。一个成功的网站离不开合理的色彩设计。 【关键词】 :色彩 网页 网页设计是一个新兴设计领域,相对于传统媒体,它的构成元素更加 复杂,包含了文字、图像、色彩、声音、动画等各元素。在网页众多元素 中,色彩有着不可或缺的重要地位。用户在浏览网页时,首先看到的就是 网页的色彩,然后才是图片、文字等信息。研究资料表明,在网页设计中, 色彩能提高信息浏览和分类的速度和准确度,能提高理解的速度,比文字 和字体变化更能提高理解的准确度[1]。色彩不但给用户带来美感和愉悦感, 而且可以有效地传达网站理念和信息。

一、网页色彩基础知识
现实生活中的色彩分非彩色和彩色两类。 非彩色是指黑,白,灰系统 色,其只有明度属性;彩色是指除了非彩色以外的所有色彩,其具有色相、 明度和饱和度的属性。 色相是指色彩的基本相貌,是区别颜色的最主要特征。红、橙、黄、 绿、青、蓝、紫等描述说的就是色相。 明度是人眼能感觉到的明暗程度。在纯白色和纯黑色之问划分了 256 个级别的亮度,也就是从白到灰,再转黑。 同理,在 RGB 模式中则代表 个原色的明暗度,即红绿蓝三原色的明暗度,从浅到深。 饱和度是指颜色的纯洁性。色彩越鲜艳、活跃、刺激;纯度越低,色 相表现越模糊,色彩越浑浊、稳重、平淡、柔和。 另外色彩还有联想、象征、冷暖感觉、空间感、轻重感、情绪感等的 功能属性。这些属性在网页开发过程中是必须要考虑的。

二、网页配色原则
设计师在进行网页设计时不仅要考虑网站本身的特点,还用遵循一定 的艺术规律,把握的用户的情感反应,才能设计出个性而令人难忘的网站。

1.与网站主题和谐一致

一个网站的用色必须要有自己独特的风格,运用独特的色彩会使网站 与众不同, 独特的色彩搭配可以衬托出网站的独特个性,从而彰显自身特 色,给浏览者留下深刻的印象[2]。例如,政府部门的网页风格应有庄重感, 呈现宁静、严肃、高雅的氛围,以冷色调为宜;而绿色象征生命与希望, 给人健康、安全的感觉,很适宜作为健康类网页的主调色。电子商务类网 页往往可以通过红色、橙色、黄色等暖色调色彩的搭配,呈现温馨、和煦、 热情的氛围。蓝色是广阔而内在的色彩象征,给人的心理印象是崇高、深 远、广大而睿智,为高科技企业所钟爱,如 IBM、联想集团等都是以蓝色 为主色调进行页面设计。

红色的民族魂

橙色的淘宝

2.把握网站的整体性
设计一个网站,必须有一个贯穿始终的设计思路和整体形象,这样才 可以有效树立网站特有形象,使网站具有整体性[3]。作为一名合格的设计 人员,不能只考虑单个网页的局部,必须在整个网站上把握色彩。比如说 主色调与辅助色的选用,单个网页内颜色的对比与调和。设计时强调其整 体性,可以使浏览者更快捷、更准确、更全面地认识它、掌握它,并给人 一种内部有机联系、外部和谐完整的美感。整体性也是体现一个站点独特 风格的重要手段之一。主要有这么几个方面的因素:简洁、搭配合理、延 续性。延续性就是说一个网站的使用不是一时的,是长久的,它的风格在 很长一段时间内都不会改变。 所以也用色还要考虑到一个长久使用的问题。

简单的百度

合理的迅播影院

3.把握浏览者的心理效应
一般情况下,色彩能使人产生轻重、新旧、空间、冷暖、软硬等心理 感觉,这是色彩的心理效应。从认识论的角度来说,色彩心理是人对客观 世界的主观反映。由于人的自身经历、文化素养、年龄结构,性格特征等 不同,会对不同的色彩产生不同的心理效应。只有正确把握网页浏览者的 色彩心理效应,才能准确定位网页色彩的基调,以吸引其注意力[4]。例如, 网站的浏览者是儿童,在用色上就可以较多使用高饱和度色彩,以营造活 泼、愉快而富童趣的视觉效果,使其符合儿童的心理需求。以知识分子为 主要对象的教育、科研等网站,就适合使用以中性色为主的色彩,显得和 谐而具有文化气息。

色彩鲜明的儿童网站

偏暖的红袖添香

三、网页配色方法
色彩是网页设计中不可缺少的元素,但网页的色彩数量不宜过多,否 则过于花哨,喧宾夺主。有时网页色彩简单明了更能突出主题,给人舒适 的视觉效果。 合理选配、配比网页色彩,形成主色调为主、小色块为辅, 既对比又调和的色彩画面, 一定会赋予网页以活力和个性, 最大限度地

吸引网民的视线[6]。

1.主色调与辅助色
主色调是指能体现网站形象和延伸内涵的色彩。比如,可口可乐的红 色,百事可乐的蓝色,德克士的橙色都给人和谐的视觉感受,这些网站以 其成功的色彩搭配令人印象深刻。一般说来,一个网站的标准色彩不超过 三种,色彩过多易造成搭配效果的杂乱无章。在网页配色设计中,确定网 页的主色调是非常关键的一步。主色调就犹如船的风帆,对整个网页起着 主导作用。在主色调的选择上,首先应该明确网站的主题、服务对象和想 要传达的信息,以及利用色彩想要达到的视觉和心理效果。辅助色在网页 中所占的比例不大,但却对整个页面的色彩起着调和的作用,它让页面更 活泼、富有生气,并使主色调更加流畅地贯穿整体。辅助色可以使用跟主 色调相邻近的颜色,也可以用主色调的对比色[7]。

幽深的爵士当铺

英雄联盟

2.对比与调和
色彩搭配所产生的美感虽然千变万化,但归纳起来,无非是处理好对 比与调和的关系。页面中各种色彩的色相、明度、纯度和面积、形状、位 置以及心理刺激的差别构成了色彩之间的对比。色彩调和是指将有差别、 有对比效果的色彩经过调整与组合,形成统一和谐的整体效果。色彩的对 比和调和是色彩设计中对立统一的因素,既互为矛盾,又相辅相成。 色彩对比和调和的方法有:(1)运用同类色。 选择一种色相,调整其 明度和纯度形成一个色彩系列,这样的配色统一和谐,有层次感。 (2)运 用邻近色。 即选择色轮上邻近的色组来设计网页,易形成主色调明确、柔 和、统一的效果。(3)运用对比色。使一种颜色占有较大面积,再辅以对比 色,起到点缀并丰富色感的作用。(4)运用黑色、灰色和其他中型色。 黑

色与白色时对色彩的最后抽象,虽然不如彩色那样耀眼、奔放,但黑白所 具有的抽象表现力和神秘感,似乎超越任何色彩的深度。

3.流行色的使用
设计师还要适当关注流行色的发展,给网页增添流行色彩。流行色是 指某个地区、某个时期内,被广泛流传的具有倾向性的、深受大众喜爱的 色彩。流行色是人们对色彩的偏好和追求时髦的心理表现,受时间性和季 节性的影响,体现了不同时代、不同文化背景下的人们对于色彩的选择和 情感,反映了一个时代的审美特征。2008 年是奥运年,红色是当年的流行 色,不论是在奥运场馆还是大大小小的网站,无处不在的就是那一抹中国 红[5]。

奥运会主题网站

四、总结
色彩是冲击人视觉的第一要素,就远观效果而言,色彩传达更优于图 形图像和文字的传达。 色彩作为网页设计中一个重要而独特的设计元素, 应该受到网页设计者的重视。我们要把美学规律同现代网页设计技术结合 起来,综合考虑浏览者的色彩心理和审美倾向,以独特的企业形象为指导, 创作出既规范合理又赏心悦目的美的网页。

五、参考文献:

[1](英)克拉恩,帕斯卡雷洛, 杰姆著; ajaxcn.org 译 《Ajax 实战》 人民邮电出版社 2006 年 4 月版 [2]陈心威. 浅谈色彩在网页设计中的应用 [3][5] 李建 . 网页设计的色彩搭配和应用 . 安庆师范学院学报 ( 自然科 学 [4]吴方. 网页的色彩设计思考. 江苏广播电视大学学报, 2002 年 12 月 版), 2010 年 5 月 [6]岳俊杰. 浅析网页色彩设计的原则与方法. 改革开放,2010 年 12 月刊 [7]杨旭兰.色彩在网页设计中的应用研究[D].南京林业大学学报, 2009.