网页效果图设计之色彩索引
欢迎转载，请注明出处，未经作者允许，禁止一切商业应用。网页顽主论坛，[url]www.go2here.net[/url]，作者：froglt这是即将出版的Fireworks CS3经典教程的部分章节，算是预读版，请多支持，欢迎大家提出意见和建议，你的回贴有机会印刷到这本书的封底哦！谢谢大家支持！
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
人们用自己的眼睛和头脑来感受色彩。这不仅仅是物理层面上的，而且包含着精神和情感层面。当我们看色彩时常常想起以前与该色相联系的感受或事物，这种因某种色彩而出现的感受，我们就称之为色彩的联想。色彩的联想是通过过去的经验，记忆或知识而取得的。
这种感受的结果，就是让不同的色彩具有了其特定的意义。色彩的象征意义多数情况下也是一种文化认同。不同文化中色彩所代表的意义和给人产生的联想是大不相同的，有时可能甚至相反。设计师在应用某种色彩之前，要好好调查一下这种色彩的意义以及它在特定环境下将带给人们的联想。
3.4.1 红色
是最具有视觉冲击力的色彩；暗示速度和动态；可以刺激心跳速度、加快呼吸、刺激食欲；红色的衣服使人身形显大；红色的车最容易被偷，如图3-27所示。
[attach]80969[/attach]
图3-27 红色
3.4.1.1 红色的具象联想
火焰、鲜血、性、西红柿、西瓜瓤、太阳、红旗、口红、中国国旗。
3.4.1.2 红色的正面联想
激情、爱情、鲜血、能量、热心、激动、热量、力量、热情、活力。
3.4.1.3 红色的负面联想
侵略性、愤怒、战争、革命、残忍、不道德、危险、幼稚、卑俗。
3.4.1.4 红色的文化域
在非洲，红色代表死亡。
在法国，红色代表雄性。
在亚洲，红色代表婚姻、繁荣、快乐。
在印度，红色是士兵的颜色。
在南非，红色是丧服的色彩。
3.4.1.5 实例说明
如图3-28所示，为中企动力8周年主题网站（[url]http://ex.ce.net.cn/8tm/index.html[/url]）网页截图，整个页面使用红色作为主色调，给人以喜庆、热闹的感受。
[attach]80970[/attach]
图3-28 中企动力8周年主题网站网页截图
3.4.1.6 红色系配色方案
红色系的配色方案如下，如图3-29所示：
1、在红色中加入少量的黄，会使其热力强盛，趋于躁动、不安。
2、在红色中加入少量的蓝，会使其热性减弱，趋于文雅、柔和。
3、在红色中加入少量的黑，会使其性格变的沉稳，趋于厚重、朴实。
4、在红中加入少量的白，会使其性格变的温柔，趋于含蓄、羞涩、娇嫩。
[attach]80971[/attach]
图3-29 红色系配色方案
3.4.2 橙色
橙色能促进食欲；橙色的房间代表了友善，带给人愉快，能促使人谈话和思考；橙色能够用来强化视觉，这就是为什么海滩救生员的救生服采用橙色的原因，如图3-30所示。
[attach]80972[/attach]
图3-30 橙色
3.4.2.1 橙色的具象联想
秋天、桔子、胡萝卜、肉汁、砖头、灯光。
3.4.2.2 橙色的正面联想
温暖、欢喜、创造力、鼓舞、独特性、能量、活跃、模拟、社交、健康、奇想、活力、华美、明朗、甘美。
3.4.2.3 橙色的负面联想
粗鲁、时髦、喧嚣、嫉妒、焦躁、可怜、卑俗。
3.4.2.4 橙色的文化域
在爱尔兰，橙色代表新教运动。
在美洲土著文化里，橙色代表学习和血缘关系。
在荷兰，橙色是国家的颜色，因为荷兰的君主来自于Orange-Nassau家族。
在印度，橙色代表印度教。
3.4.2.5 实例说明
如图3-31所示，为韩国芬达网站（[url]http://www.fanta.co.kr/[/url]）网页截图，整个页面使用橙色作为主色调，和其主打产品－橙味汽水紧密结合。
[attach]80973[/attach]
图3-31 韩国芬达网站网页截图
3.4.2.6 橙色系配色方案
橙色系的配色方案如下，如图3-32所示。
1、在橙色中混入大量的白，有一种干燥的气氛。
2、在橙色中混入少量的蓝，能够形成强烈的对比，有一种紧张的气氛。
3、在橙色中混入少量的红，给人以明亮、温暖的感受。
[attach]80974[/attach]
图3-32 橙色系配色方案
3.4.3 黄色
是人眼睛最容易注意到的色彩；比纯白色的亮度还要高；可以促进新陈代谢；明亮的黄色是所有色彩中最容易让人产生疲劳感的颜色，它很刺激人的眼睛；暗淡的黄色可以加强人们的注意力，所以多应用于提示牌，如图3-33所示。
[attach]80975[/attach]
图3-33 黄色
3.4.3.1 黄色的具象联想
阳光、沙滩、蛋黄、香蕉、向日葵、小鸡、面包、菜花。
3.4.3.2 黄色的正面联想
聪明、才智、乐观、光辉、喜悦、平凡、泼辣、明快、希望、光明、明媚、理想主义。
3.4.3.3 黄色的负面联想
嫉妒、怯懦、欺骗、警告。
3.4.3.4 黄色的文化域
在佛教里，法师穿着金黄色的袈裟。
在埃及和缅甸，黄色意味着丧服。
在日本，黄色联系到人的勇气。
在印度，黄色是商人和农民的标志。
在印度教文化中，穿着黄色用来庆祝春节。
在古代中国，黄色是帝王专属的颜色。
3.4.3.5 实例说明
如图3-34所示，为韩国立顿红茶网站（[url]http://www.lipton.co.kr/[/url]）网页截图，整个页面使用黄色作为主色调，给人以明快、温暖的感受。
[attach]80976[/attach]
图3-34 韩国立顿红茶网站网页截图
3.4.3.6 黄色系配色方案
黄色系的配色方案如下，如图3-35所示。
1、在黄色中加入少量的蓝，会使其转化为一种鲜嫩的绿色。其高傲的性格也随之消失，趋于一种平和、潮润的感觉。
2、在黄色中加入少量的红，则具有明显的橙色感觉，其性格也会从冷漠、高傲转化为一种有分寸感的热情、温暖。
3、在黄色中加入少量的黑，其色感和色性变化最大，成为一种具有明显橄榄绿的复色印象。其色性也变的成熟、随和。
4、在黄色中加入少量的白，其色感变的柔和，其性格中的冷漠、高傲被淡化，趋于含蓄，易于接近。
[attach]80977[/attach]
图3-35 黄色系配色方案
3.4.4 绿色
是所有色彩中最能让人的眼睛放松的色彩；绿色对人的精神有镇静和恢复的功效，通常在医院中让病人放松；通常绿色的意义是“通行”，还有秩序的意义；绿色可以促进消化，还可以减轻胃痛，如图3-36所示。
[attach]80978[/attach]
图3-36 绿色
3.4.4.1 绿色的具象联想
植物、大自然、环境、西瓜、树叶、山、草。
3.4.4.2 绿色的正面联想
和平、安全、生长、新鲜、丰产、金钱、种植、康复、成功、自然、和谐、诚实、青春。
3.4.4.3 绿色的负面联想
贪婪、嫉妒、恶心、毒药、侵蚀、缺乏经验的。
3.4.4.4 绿色的文化域
在伊斯兰国家，绿色是天堂的颜色，同是也是伊斯兰教的代表色。
在爱尔兰，绿色就是其国家的象征。
在凯尔特文化中，绿色的巨人是丰收之神。
在美洲土著文化中，绿色联系到人们的愿望和意志。
3.4.4.5 实例说明
如图3-37所示，为韩国真露烧酒网站（[url]http://www.chamisulfresh.com/default.asp[/url]）网页截图，整个页面使用绿色作为主色调，符合真露烧酒以植物为原材料提取的产品理念。
[attach]80979[/attach]
图3-37 韩国真露烧酒网站网页截图
3.4.4.6 绿色系配色方案
绿色系的配色方案如下，如图3-38所示。
1、在绿色中黄的成份较多时，其性格就趋于活泼、友善，具有幼稚性。
2、在绿色中加入少量的黑，其性格就趋于庄重、老练、成熟。
3、在绿色中加入少量的白，其性格就趋于洁净、清爽、鲜嫩。
[attach]80980[/attach]
图3-38 绿色系配色方案
3.4.5 蓝色
在自然界中很难找到蓝色的事物，抑制食欲，让人没有胃口；能让人的身体分泌安定素，放松身体；在蓝色的环境中工作效率比较高；蓝色的服装通常会体现出一种忠诚和信赖的意味，如图3-39所示。
[attach]80981[/attach]
图3-39 蓝色
3.4.5.1 蓝色的具象联想
海洋、天空、湖水。
3.4.5.2 蓝色的正面联想
学识、凉爽、和平、雄性、沉思、忠诚、正义、智慧、平静、悠久、理智、深远、无限、理想、永恒。
3.4.5.3 蓝色的负面联想
消沉、寒冷、分裂、冷漠、薄情。
3.4.5.4 蓝色的文化域
在世界大多数地区，蓝色代表男性。
在中国，蓝色代表小女孩。
在西方的婚俗中，蓝色代表爱情。
在伊朗，蓝色是丧服的色彩。
在世界范围内，蓝色是最容易被大众接受的色彩。
3.4.5.5 实例说明
如图3-40所示，为康师傅劲凉风暴FIR歌友会网站（[url]http://icetea.allyes.com/[/url]）网页截图，整个页面使用蓝色作为主色调，给人以清爽、时尚的感受。
[attach]80982[/attach]
图3-40 康师傅劲凉风暴FIR歌友会网站网页截图
3.4.5.6 蓝色系配色方案
蓝色系的配色方案如下，如图3-41所示。
1、如果在蓝色中分别加入少量的红、黄、黑、橙、白等色，均不会对蓝色的性格构成较明显的影响力。
2、如果在蓝色中黄的成份较多，其性格趋于甜美、亮丽、芳香。
3、在蓝色中混入小量的白，可使橙色的知觉趋于焦躁、无力。
[attach]80983[/attach]
图3-41 蓝色系配色方案
3.4.6 紫色
是一种娇柔的、浪漫的品性；通常与中性化产生联系；自然界中很难找到紫色，所以紫色有一种“人造”的意义；古代紫色染料洗染的衣物只有贵族和富有的人才能够穿上；紫色能够激发人们的想像力，因此通常用来装饰儿童的房间，如图3-42所示。
[attach]80984[/attach]
图3-42 紫色
3.4.6.1 紫色的具象联想
皇家、精神、茄子、熏衣草、紫水晶、葡萄、紫菜、礼服。
3.4.6.2 紫色的正面联想
优雅、高贵、重、神秘、女性化、奢侈、智慧、想像、诡辩、等级、灵感、财富、高尚、古朴。
3.4.6.3 紫色的负面联想
夸大的、过多的、疯狂、残忍、消极。
3.4.6.4 紫色的文化域
在泰国，在窗户上悬挂紫色，是为了悼念自家的丈夫过世。
在日本，紫色代表了各种仪式，启发性的事物，或是自大的人。
在在拉丁美洲，紫色意味着死亡。
3.4.6.5 实例说明
如图3-43所示，为超级名模姜培琳官方网站（[url]http://www.jiangpeilin.com/shirley.htm[/url]）网页截图，整个页面使用紫色作为主色调，给人以神秘、时尚和女性化的感受。
[attach]80985[/attach]
图3-43 超级名模姜培琳官方网站网页截图
3.4.1.6 紫色系配色方案
紫色系的配色方案如下，如图3-44所示。
1、在紫色中红的成份较多时，其知觉具有压抑感、威胁感。
2、在紫色中加入少量的黑，其感觉就趋于沉闷、伤感、恐怖。
3、在紫色中加入白，可使紫色沉闷的性格消失，变得优雅、娇气，并充满女性的魅力。
[attach]80986[/attach]
图3-44 紫色系配色方案
3.4.7 黑色
黑色服装能使人看上去瘦一些；黑色幽默是病态的；黑色能让和它相配的颜色看上去更明亮；在色彩治疗学中，认为黑色可以激发自信和力量；黑色通常会与黑手党产生联系，如图3-45所示。
[attach]80987[/attach]
图3-45 黑色
3.4.7.1 黑色的具象联想
夜晚、死亡、墨汁、煤炭、毛发、礼服、洋伞。
3.4.7.2 黑色的正面联想
权力、威信、重量、诡异、高雅、仪式、严肃、高贵、孤独、神秘、时髦、严肃、刚健、坚实、生命。
3.4.7.3 黑色的负面联想
恐惧、消极、邪恶、秘密、屈服、服丧、重量、懊悔、无知、悲哀、阴沉、冷淡。
3.4.7.4 黑色的文化域
在美国、欧洲和日本，黑色是叛逆的颜色。
在中国，黑色代表小男孩。
在亚洲，黑色代表事业、紫色、服丧和忏悔。
在世界范围，黑色代表深肤色血统人种。
3.4.7.5 实例说明
如图3-46所示，为韩国genesis汽车网站（[url]http://www.the-genesis.co.kr/[/url]）网页截图，整个页面使用黑色作为主色调，给人以大气、贵雅的感受。
[attach]80989[/attach]
图3-46 韩国genesis汽车网站网页截图
3.4.8 白色
一些文化认为如果身着白色服装举行结婚仪式，将会带来好运；白色是表达到最完美平衡的颜色；由于白色太明亮，会引起某些人群的头疼感；白光会引起暂时的失明；白色经常会同上帝、天使联系起来，如图3-47所示。
[attach]80990[/attach]
图3-47 白色
3.4.8.1 白色的具象联想
雪、白纸、白兔、白云、砂糖、光芒、纯净、面粉。
3.4.8.2 白色的正面联想
清洁、神圣、洁白、纯洁、纯真、神秘、完美、美德、柔软、庄严、简洁、真实、婚礼。
3.4.8.3 白色的负面联想
虚弱、孤立。
3.4.8.4 白色的文化域
在日本和中国，白色是葬礼的色彩。
在世界范围内，白色的旗帜代表休战。
在欧洲和北美，白色代表了浅肤色的高加索人种。
在印度，如果已婚妇女穿着白色，会引起人的不愉快。
3.4.8.5 实例说明
如图3-48所示，为韩国影星daniel-henney的官方网站（[url]http://www.daniel-henney.com/[/url]）网页截图，整个页面使用白色作为主色调，给人以干净、清爽的感受，和daniel-henney的气质非常的贴切。
[attach]80991[/attach]
图3-48 韩国影星daniel-henney的官方网站网页截图
3.4.9 灰色
灰色通常不能引起观众比较强烈的情感变化；灰色是白色和黑色平衡的结果；灰色的补色也是其本身，如图3-49所示。
[attach]80992[/attach]
图3-49 灰色
3.4.9.1 灰色的具象联想
乌云、草木灰、树皮、中性。
3.4.9.2 灰色的正面联想
平衡、安全、可信、谦虚、成熟、智能、才智、平凡、古典主义。
3.4.9.3 灰色的负面联想
阴天、老龄、厌倦、悲伤、失意、缺少承诺、不确定、喜怒无常、优柔寡断、糟糕的天气。
3.4.9.4 灰色的文化域
在美国，灰色代表荣誉和友谊。
在亚洲，灰色代表在路途中有帮助的人。
在世界范围内，灰色让人联想到白银和金钱。
3.4.9.5 实例说明
如图3-50所示，为韩国影星安在旭官方网站（[url]http://www.ahnjaewook.co.kr/main/[/url]）网页截图，整个页面使用灰色作为主色调，给人以沉稳、大气的感受。
[attach]80993[/attach]
图3-50 韩国影星安在旭官方网站网页截图
[[i] 本帖最后由 froglt 于 2008-3-8 01:10 编辑 [/i]] 沙发```不错的讲解```:) 收藏慢慢看 谢谢分享 让人对颜色的表像和内涵有了立体的认识,并且浅显易懂,很有收获,收藏了慢慢看:)
PS:印到封底的回帖算稿费吗~~~~~~:o :D 看过后收益非浅,谢谢搂主~ 不错~收藏了~ 说句谢谢``` 谢谢辛苦
蓝绿之间的青色呢？ 不错,收藏了,学习下 不错,收藏了 学习中。。。。。 很好,希望能多出点这样的好帖... 收藏了，好贴 收藏先,继续学习! 怎么说呢？
这帖子对没接触过配色，非设计类专业的人来说确实有相当大的吸引力。但是目前市面上这种设计类的书也不少了，我书架上5本类似的书中至少四本讲了同样的内容。 总觉得配色光学理论是不可能做出让人喜欢的页面的
这是一个积累和丰富经验的过程
碰到过某些读了1，2本色彩学的书就自以为对配色在行的人在指手画脚，让人非常不爽 很好的学习材料
收藏 恩 很好的索引～～ 配色还是需要长期的奋斗才会有成果啊 我只看过半本色彩的书=。=，感觉有经验上的差别，学到了东西，顶一个。:D
[color=DimGray]PS：
蓝色的第三条是不是出错呢？看不懂
“3、在蓝色中混入小量的白，可使橙色的知觉趋于焦躁、无力。”[/color] 长知识了，好东西收下下慢慢看。 楼主辛苦了
谢谢分享
虽然不您看了就马上可以掌握色彩搭配的精髓
但是有一定的帮忙是肯定的了
有好的东西,就应该拿出来分享 楼主辛苦了 我不是学美术的设计 受益匪浅！ [quote]原帖由 [i]74sf[/i] 于 2008-3-24 17:28 发表 [url=http://bbs.blueidea.com/redirect.php?goto=findpost&pid=3909873&ptid=2835894][img]http://bbs.blueidea.com/images/common/back.gif[/img][/url]
我只看过半本色彩的书=。=，感觉有经验上的差别，学到了东西，顶一个。:D
PS：
蓝色的第三条是不是出错呢？看不懂
“3、在蓝色中混入小量的白，可使橙色的知觉趋于焦躁、无力。” [/quote]
对，不好意思，打错字了，应该是：
[color=Red]在蓝色中混入小量的白，可使蓝色的感觉趋于焦躁、无力[/color]
我已经不能修改了，请大家参考这里 楼主辛苦,写的挺全面的 收藏，谢谢
回复 #1 froglt 的帖子
Thanks! 留下脚印~ 强贴留名顶个~ 收藏了...谢谢 谢谢我也收藏了，留名慢慢看 太感谢了，我正需要这个 惊叹啊。呵呵收藏啊。宝贝啊！ 好贴,很让我这个新手好好学习一翻.谢谢楼主.
[url]http://www.z990.com[/url]
楼主,能指点一下我网站的配色,怎么样呀? [quote]原帖由 [i]zhouyuling909[/i] 于 2008-4-4 22:57 发表 [url=http://bbs.blueidea.com/redirect.php?goto=findpost&pid=3930549&ptid=2835894][img]http://bbs.blueidea.com/images/common/back.gif[/img][/url]
好贴,很让我这个新手好好学习一翻.谢谢楼主.
[url]http://www.z990.com[/url]
楼主,能指点一下我网站的配色,怎么样呀? [/quote]
你的网站做的很不错了，干净简洁，导航和正文可以使用和背景比较强烈的颜色对比来强调一下 很好啊! .........复制下来到word,省得何时图片什么的出问题
..........算
有2m...-_!! 收了，谢谢！ 经典~！
很有研究价值 不错，学习了～～ 好东西，收藏啦 不错，我也收藏了 还不错...顶一个 收了先....
期待继续:eek: 收藏了，谢谢楼主 太好拉 太好了 非常感谢
抽出时间马上学习。 Thank you. 很棒~~~ 你的设计风格很喜欢！！！:) :) 谢谢 收藏了. 不错，先收藏了！ 不错.学习. 太棒了，收藏备用 谢谢楼主分享！！
先收藏，再研究:) 我对配色一点也不会...我应该怎么样的角度去看你的东东...又应该怎么去学怎么去做 内容不错，给了我很大的启发，那几个例子都很棒！原来运用得当的色彩搭配能给我带来这么强烈的视觉冲击！！ 学到了一些，但实际应用还需要不断地去尝试 学习 让我在配色方面更进了一步 。 记之以后观 学到了.谢谢楼主.
色彩是一个重点.但也很难征服 对于配色，一直都很头痛，现在看了楼主的讲解，算是明白了一点
页:
[1]
2