网页美工设计模块二 网页色彩规划

网页美工设计模块二网页色彩规划任务一认识色彩情感

教学目标教学重难点１．认识色彩并区分色彩角色２．理解色彩情感及运用相关知识确立主色调通过学习，学生能够：1．能区分网页中不同色彩的色彩角色2．能运用色彩情感知识确立主色调新课导入我们生活的世界充满了各种各样的色彩，色彩与人的情感有着密切的联系，不同的色彩被人们赋予不同的意义，表达特定的情感。运用色彩时，除了色彩与色调本身的美感外，也通过色彩传递着相应的色彩联想与情感象征。如下图，我们的生活中充满了不同色彩感觉的事物：观察四张图片并思考：1.几张图片中的色彩带给你什么样的感受2.生活中哪些颜色给你留下了深刻的印象目标展示

主色调

辅助色点睛色背景色一、色彩角色：以以下图为例进行区分网页色彩角色的分析。目标展示二、色彩情感：如以下图以白色为例，用不同主色调的网页帮助大家理解色彩情感在网页中的运用。任务分解一、色彩角色网页中色彩的角色主要是根据其面积多少来区分主次关系，如果不同的颜色使用面积相当，会感觉页面主次不分、没有整体感；当使用颜色过多，会感觉页面过于琐碎、花俏，网页会显得轻浮而缺乏内涵。为网页配色的时候，应根据主题内容主次需要，选择不同的颜色发挥不同的功能，让其扮演不同的角色，根据色彩的视觉主次关系分为：1．主色调在网页中面积最大，出现次数最多，贯穿网页中所有页面的色彩。主色调好似乐曲中的主旋律，在创造特定的气氛与意境上发挥主导作用，是整个网站的色彩表现力的灵魂。在描述网页是什么色调时也是特指其主色调。2．辅助色仅次于主色调视觉面积的色彩，是衬托、支撑主色调，起到调和画面色彩关系，融合画面色彩感觉的色彩。3．点睛色在小范围内用强烈的颜色来突出效果、活泼气氛，使页面更加鲜明生动的色彩。主要使用于占用范围较小的按钮、标签等。同一个画面的点睛色可能是一种色彩，也可能是多种色彩，点睛色的数量根据画面需要而定。4．背景色用于网站背景的颜色，起到协调、衬托整体色彩关系的作用。有的背景色作用不大，仅仅起到陪衬的作用，在画面中显露的面积很小，但有些网页的背景色对画面的影响很大，既是背景，也是主色调。任务分解一、色彩角色

图2-1-5使用了多种色彩，让我们来区分其中的色彩究竟扮演何种角色：

主色调

辅助色点睛色背景色任务分解二、色彩情感1．白色白色让人联想到：正面的：纯粹、纯洁、洁净、正直、信赖、神圣、和平、单纯、成熟、优雅；负面的：单调、恐惧、无力。白色象征着纯洁、神圣、明快、虚无、贫乏。纯白色会带给别人寒冷、严峻的感觉。白色通常需和其他色彩搭配使用，白色是万能色，可以和任何颜色作搭配。白色是所有色彩中亮度最高的，给人一种轻快的感觉。白色能使和它搭配的色彩显得更加鲜明、突出，可以让明亮的色彩更柔和、优雅。白色与暖色搭配时可以增添华美的感觉,与冷色搭配时可以产生清爽轻快的感觉。白色常用来表达明亮、洁净的感觉，如清洁用品、卫生用品、家居用品等，如下图，在网页设计中白色多用做背景色与过度色。任务分解二、色彩情感2．灰色灰色让人联想到：正面的：知识、安定、斯文、气质、优雅、成熟、节制、谦逊、创造；负面的：悲伤、无力、阴暗、荒凉、内向。灰色象征谦虚、沉默、中庸、忧郁，不凸显自身。灰色具有柔和、高雅的意象，属于中间性格，男女皆能接受，是一种高风格的、有品位感的颜色。使用灰色时，大多利用不同明度的灰色变化或搭配其他色彩来调和画面的朴素、沉闷。灰色是中性色，和白色、黑色一样是一种无色彩属性的色彩。给人一种柔和、细致、朴素、大方、舒适、优雅的感觉，灰色作为背景色彩非常理想，搭配其他色彩，可以有效中和华美、张扬的感觉。如下图，电子产品、商业经济、军事类网站常常用灰色作为其主色调。任务分解二、色彩情感3．黑色黑色让人联想到：正面的：神秘、干练、威严、权威、教养、力量、强势、攻击；负面的：恐怖、不安、绝望、悲伤、沉默、虚无、孤独。黑色象征着崇高、严肃、粗莽、沉默、退缩、沉稳、黑暗，有消极、谦逊的意味，有高贵、稳重、科技的意象。电视、汽车、音响、仪器的色彩大多采用黑色，生活用品和服饰设计也大多利用黑色来塑造高贵的形象。黑色是万能色，可以和任何色彩搭配,同时黑色很酷又极具个性化，被称为永远的流行色,所以也适合用作音乐、时尚、个性化网页的主色调，如下图的音乐网站设计。任务分解任务分解二、色彩情感5．橙色橙色让人联想到：正面的：活力、健康、创造力、能力、快乐、华美、社交性；负面的：警告、不安。橙色象征着光明、华美、甜蜜、快乐、辉煌、动感，极具扩展性。橙色很容易让人联想到金色的秋天和成熟的果实，是一种快乐而幸福的色彩，同时也是能引起食欲的色彩。在工业平安用色中，橙色是警告色，登山服装、背包、救生衣等常用橙色引起别人的注意。如下图，橙色多用于餐饮、食品、运动及表现年青人活力的网站。任务分解二、色彩情感6．黄色黄色让人联想到：正面的：快乐、轻快、撒娇、可爱、理解、智慧、幸福、和平、明朗、希望；负面的：卑劣、妒嫉、欺骗、偏见、破坏、神经质。黄色也象征智慧和光明，在中国古代，黄色常用于皇室，是权利和尊贵的象征。黄色是喜庆的用色，象征着明朗、高贵、希望、开展、警示，黄色是明度最高的色彩。有警示的作用，是易于引起注意的代表色彩，有集中视线的效果，常用于道路的标志线、禁止通行路障、工程用的大型机器等。如下图，在网页设计中，黄色多用于商品销售、休闲娱乐、前卫时尚类网站。任务分解二、色彩情感7．绿色绿色让人联想到：正面的：生命、丰富、繁荣、希望、和平、舒适、安定、理性、正直、宽容；负面的：猜忌、贪婪、腐蚀、自我压抑。绿色传达了清爽、理想、希望、生长的意味，代表生命、成长。绿色综合了蓝色的冷静与黄色的活泼，象征着新鲜、安逸、和平、青春、平安、理想，是一种中庸的、明净的、大自然的颜色，能让人联想到伸展着绿叶的树木，展示着大自然的生命力。绿色还可以缓解疲劳，有让视觉“休息〞的效果，所以绿色调网站较适宜长时间浏览，如下图。绿色给人一种舒适的感受，文化教育与医疗卫生类网站常常使用绿色作为主色调。任务分解二、色彩情感8．蓝色蓝色让人联想到：正面的：博大、高远、开阔、深邃、无限、忠诚、真挚、信赖；负面的：冷淡、冰冷、紧张、忧郁。蓝色象征着寒冷、深远、沉静、内敛、理智、老实。蓝色容易让人联想到天空、大海、平静而开阔的水面，给人冷静、沉稳，永恒的感觉，所以宣传科技和效率的企业和商品，大多项选择用蓝色作为标准色，如下图。而且大多数人比较偏爱蓝色色调,使得蓝色成为网页设计中使用最多的一种色彩。任务分解二、色彩情感9．紫色紫色让人联想到：正面的：智慧、神秘、梦想、浪漫、神圣、伟大、崇高、高贵；负面的：悲哀、忧郁、孤独。紫色象征着优雅、高贵、神秘、魅力，具有强烈的女性化特征。紫色不易与其他色彩搭配，紫色为主色调的网页，往往用不同明度的紫色或紫色的渐变来装饰页面，如图2-1-22所示。紫色具有天然的高贵与冷傲气质，与女性有关的商品和企业形象常常使用紫色，如下图。课堂小结◆本任务我们学习了哪些知识？◆从这些知识出发引出了哪些技能？◆合作学习中，你发挥了多大的作用，有积极主动参与吗？◆自评、互评环节的评价结果是否吻合，不吻合的原因是什么？作业布置一、翻开素材文件/模块二/任务一/“2-1-29.jpg〞，在图中的白色区域内填充色彩,表现出“春、夏、秋、冬〞任意一种季节给人的色彩感受。二、翻开素材文件/模块二/任务一/“2-1-30.jpg〞，在图中白色区域内填充色彩，将“酸、甜、苦、辣〞任意一种味道用色彩的方式表现出来。知识技能拓展一、色彩的味觉效应色彩的味觉效应来自于现实中食品的色调关系长期作用于人的刺激体验，人们经过长期生活经验的积累，形成一种自然的联想能力和条件反射，如下图，不同色彩的食品带给人不同的味觉体验。色彩的味觉感受不完全是一种色彩对应一种味觉感受，很可能一种色彩与多种味觉感受相关，或者某些味觉感受需要多种色彩的搭配才能表达，色彩与味觉的大致对应关系如下：黄、黄绿色——酸，橙、粉红色、浅褐色——甜，黑、深褐色——苦，红、绿——辣；白、蓝、深灰色——咸，灰绿色、深绿色——涩，白——清淡，黑——厚重。知识技能拓展二、色彩与性格性格是人类的特征，色彩本身并没有性格，但由于色彩的象征性与人类性格表现出的一些特征有某些对应的关系，如下图的休闲风格和沉稳风格，所以才让人感觉到色彩与性格是相关联的，如图2-1-28所示。红色象征外向型性格，特点是刚烈、热情、大方、健忘、善于交流、不拘小节；黄色象征力量型性格，特点是喜欢支配，习惯于领导别人；蓝色象征条理型性格，特点是个性稳重，不轻易做出判断，易于亲近外向型性格；绿色象征适应型性格，特点是顺从、听话，善于倾听别人的述说。网页美工设计模块二网页色彩规划任务二搭配网页色彩

教学目标教学重难点１．从色环图开始理解色彩根本属性２．理解色彩搭配根底知识及运用知识搭配网页色彩通过学习，学生能够：1．能理解色彩的根本属性2．能理解色彩搭配的根底知识新课导入

初学者总是觉得色彩知识过于繁复深奥，不便于理解，那我们换一种思路，从图2-2-1所示的二十四色色环图出发来简单认识色彩。新课导入色彩可以分为非彩色与彩色两大类。非彩色指黑、白和各种深浅不一的灰色，而其他所有颜色均属于彩色。从视觉和心理学角度出发，彩色具有三个属性：色相、明度、纯度。一、色相指色彩的种类和名称，如红、橙、黄、绿、青、蓝、紫等不同的色彩,色相是颜色的根本特征，是一种色彩区别于另一种色彩的标准，如图2-2-2至2-2-5所示不同色相的事物。新课导入二、明度又叫亮度，指颜色的深浅、明暗程度，如图2-2-6展示了白色到黑色的明度变化。色彩的明度包括两个方面：一是指某一色相的深浅变化，如粉红、大红、深红，都是红色，但一种比一种深〔图2-2-1中内环到外环就是同一色相由浅到深的明度变化〕。二是指不同色相间存在的明度差异，如常见的七彩色中黄色明度最高，紫色明度最低，橙和绿、红和蓝处于相近的明度。如图2-2-7和2-2-8所示相同图像不同状态的区别。新课导入三、纯度也叫饱和度，指色彩的鲜艳程度。纯度取决于含有某一种色彩成分的比例，比例越大，纯度越大；比例越小，纯度越小。图2-2-1中处于中间位置的一环纯度最高，向内参加白色，提高了明度，同时降低了饱和度；向外参加黑色，降低了明度，同时也降低了饱和度。色彩越单纯其纯度越高，越混合其纯度越低，往色彩中参加任何其他色彩都会降低其纯度。如图2-2-9至2-2-11所示相同图像不同纯度关系时的区别。新课导入四、色彩的冷暖是指不同色彩之间的色彩感觉形成的差异，色彩分为冷、暖两大色调，如图2-2-12至2-2-15所示。从图2-2-1中可以清晰的看到从黄色到紫色的连线将整个色环分为两种具有明显冷暖差异的色彩体系：以红、橙、黄为代表的暧色调，以蓝、绿、紫为代表的冷色调。新课导入目标展示色彩搭配根底知识〔以同类色搭配为例〕任务分解一、同类色搭配同类色是指颜色在色相环上位置十分接近，大约在15°～30°左右的相邻色彩或者同一色相关系中不同明度或纯度的色彩搭配，例如深绿色与浅绿色、红色与橙红色等。同类色搭配可以产生有秩序的渐变感觉，色相差异小，显得协调统一，画面整洁有序，但相同的色彩感觉也容易产生平淡、单调的感觉，如下图。可以加大明度与纯度比照来弥补单调感，或者参加小面积的其他颜色作点缀。任务分解一、同类色搭配同类色搭配是最稳妥的配色方案，色彩搭配比较容易显得标准、美观，如下图。是色彩运用初期最容易掌握的搭配方式，强力推荐！任务分解二、近似色搭配近似色是指颜色在色相环上的位置在30°～60°左右，距离较近，颜色之间色相差异不大，例如红色与橙色、橙色与黄色、黄色与绿色、绿色与蓝色、蓝色与紫色等。近似色的搭配是一种非常理想的色彩搭配方案，在色相关系上色彩相近而不相同，统一中有变化，变化又不失协调。色彩既有比照又相互调和，视觉关系上能做到清晰明朗、层次丰富。任务分解二、近似色搭配近似色搭配是最常见，应用范围最广的一种配色方案。配色难度不大却极易出彩，如下图，是最值思考与运用的色彩搭配方式，竭力推荐！任务分解三、比照色搭配比照色是指颜色在二十四色色环图上相差120°左右的色彩,比照色在色相环中位置相距较远，颜色之间共同因素减少，色相差异较大，如三原色〔红、黄、蓝〕之间或者三间色〔橙、绿、紫〕之间的搭配。比照色搭配属于强比照搭配方案，视觉效果上强烈、鲜亮，画面效果上层次清楚、结构明显，特别易于突出主体，展示亮点，如下图。任务分解三、比照色搭配由于比照色搭配色相差异较大，色彩有一定的冲突感，在运用的时候多用深浅不一的灰色做过渡，以降低色彩的不协调性。同时，必须注意色彩的主次之分，加大主色调与辅助色的面积比照，以到达色彩平衡的效果，如下图。任务分解四、互补色搭配互补色是指颜色的位置位于色相环直径的两端，相差180°，是距离最远的色彩，色彩共同因素消失，色相差异巨大，如红与绿、黄与紫、蓝与橙是最常见的补色。互补色搭配是最强烈、最富刺激性的配色方案，互补色比照的画面特别鲜明、艳丽，很容易吸引人的注意力。互补色又极不调和，摆放在一起的时候，各自的色相感觉会更加明显，如下图。任务分解四、互补色搭配强烈刺激会让人产生不安定感，如果搭配不当，容易产生生硬、急躁的效果。因此要通过调整主色调与辅助色的面积大小，或者分散的方法来调节，也可以同时提高或者降低互补色的明度或纯度来进行搭配，以降低画面的不适感，如下图。课堂小结◆本任务我们学习了哪些知识？◆从这些知识出发引出了哪些技能？◆合作学习中，你发挥了多大的作用，有积极主动参与吗？◆自评、互评环节的评价结果是否吻合，不吻合的原因是什么？作业布置一、翻开素材文件/模块二/任务二/“2-2-26.psd〞，将这个网页的配色修改为同类色配色关系。二、翻开素材文件/模块二/任务二/“2-2-27.psd〞，将网页配色修改为比照色配色关系。知识技能拓展在实践操作中，我们可以用以下几种方法来协调配色效果1．大面积使用低纯度色彩，小面积使用高纯度色彩。2．多使用灰色系〔如黑、白、灰〕色彩作间隔色。3．用画面中主要色彩的中间色作为过渡色。4．降低双方或者一方色彩的纯度。5．提高或降低一种色彩的明度。网页美工设计模块二网页色彩规划任务三选择网页色调

教学目标教学重难点１．网页色调确立的原那么２．网页色调确立的方式通过学习，学生能够：1．能理解网页色调确立的原那么2．能理解如何确立网页色调新课导入新课导入目标展示以网站Logo决定色调为例任务分解一、网站Logo决定色调几乎所有的网站都有自己的Logo，其作用有些类似商标，每一个Logo都是独一无二的，用于展示网站形象，提高网站辨识度。上图左是Citrus-SEO网站首页设计，使用了网站Logo中飞溅果汁的橙色作为网页的主色调，橙色本就是食品网站的最正确用色之一，而且也与商品本身的色调相关，一举两得。上图右肯德基的Logo形象早已为大家所熟知，其网站使用Logo中的红色作为主色调，显得充满热情，也可以理解为其食品充满能量。任务分解上图左中略显灰暗的蓝色与橙色从色相关系上来说本是一组比照色的搭配，蓝色代表冷静、果敢，橙色代表警示、告诫、色彩比照鲜明而又显稳重，十分符合中情局的特点。如上图右所示的Poordesigners的网页，Logo的颜色是简单的黑色。Logo外形高端、大气，网页色调与Logo颜色相互照应，给人一种有品质、有内涵的视觉感受。以上几个网页不但展现了常见的Logo类型，同时网页的色彩搭配也是来自于Logo本身的色彩关系。使用Logo中的颜色作为网页的主色调是很好的选择，这样规划网页色彩有以下好处：一是Logo的色彩使用较为标准，往往都考虑了网站本身的特点，能更好的展示网站形象。二是Logo与网页色调相互照应，易于给访问者留下标准、严谨的印象。任务分解二、网站类型决定色调1．企业形象类企业网站就相当于一个企业的网络名片，是企业在互联网上进行网络建设和形象宣传的平台。企业网站的作用为展现公司形象，加强客户效劳，完善网络业务。蓝色、红色、白色、灰色常常用于企业形象类网站，如图2-3-7所示，给人带来理性、稳重、高效、平安的视觉感觉，有利于企业品牌形象的建立与提升。如：IBM的蔚蓝色、可口可乐的红色、联想集团的蓝色都与企业形象融为一体，已经成为企业的象征色彩。任务分解二、网站类型决定色调2．娱乐休闲类互联网的飞速开展，产生了很多的娱乐休闲类网站，如电影网站、音乐网站、游戏网站、交友网站、社区论坛等。这些网站为广阔网民提供了娱乐休闲的场所。娱乐休闲类网站的配色特点非常显著，通常设计风格或轻松活泼、或时尚另类，内容综合、表现灵活，多配以大量图片。色彩或鲜艳亮丽，采用饱和度较高的色彩搭配；或简洁明快，采用高明度低饱和度的色彩搭配。具体的选择上如红色、蓝色、绿色、红色与黑色的搭配、蓝色与绿色的搭配等。如图2-3-8和2-3-9所示，两个同为音乐类网站，但配色风格差异明显。任务分解二、网站类型决定色调3．信息资讯类信息资讯类网站将无数信息整合、分类，为上网者翻开方便之门，绝大多数网民通过信息资讯类网站来寻找自己感兴趣的信息资源,其中有如搜狐、网易、新浪等大型门户类网站，还有如百度、google等搜索引擎网站，如图2-3-10和2-3-11所示的搜索类网站设计。由于网站功能定位的问题，这类网站在配色上的变化不大，主要是以强调协调统一，易于长时间浏览，符合大多数人的根本审美需求。任务分解二、网站类型决定色调4．文化教育类文化教育类网站也是以提供资讯为主，一局部是以宣传学校本身为主，另一局部是提供在线教学、提供文化效劳为主。文化教育类网站有其独特的人文气质和精神内涵，在表现形式上也要充分考虑到网站类型的特殊性。在配色上尽量使用轻松，具有活力的颜色，如红色、蓝色和绿色。再有就是使用明度较高的颜色，如白色，浅褐色，浅灰色等。如图2-3-12和2-3-13所示的学校网站设计。任务分解二、网站类型决定色调5．个性化类是以个人名义开发创立的具有较强个性化的网站。一般是个人为了兴趣爱好或展示自我等目的而创立的。具有较强的个性化特色，带有明显的个人色彩，无论从内容、风格、样式上都形色各异、包罗万象。这类网站的用色没有明确的方向性，随心所欲、任意而为，一般会使用平时配色中少见的搭配方式，比方多种色彩的混搭、高饱和度色彩与灰色的搭配、黑色与绿色的搭配等，如图2-3-14和2-3-15所示的个性化网站设计。任务分解任务分解任务分解任务分解任务分解任务分解任务分解任务分解课堂小结◆本任务我们学习了哪些知识？◆从这些知识出发引出了哪些技能？◆合作学习中，你发挥了多大的作用，有积极主动参与吗？◆自评、互评环节的评价结果是否吻合，不吻合的原因是什么？作业布置一、任务一课后的练一练，我们上网查找了五组Logo并分析其色彩关系，现在我们从中选择一个品牌，并为其做一个形象页设计。二、通过色彩的运用，设计一个带有明显风格特征的欢送页。网页美工设计模块二网页色彩规划任务四走出配色误区

教学目标教学重难点１．网页配色错误的几种主要原因２．如何运用相关知识防止网页配色错误通过学习，学生能够：1．能理解网页配色错误的原因2．能运用知识防止网页配色错误新课导入

色彩如何运用的问题，有时不需要我们绞尽脑汁去寻找答案。我们生活的空间已经存在很多成熟而优秀的色彩搭配方案，如图2-4-1所示。只要我们平时多注意观察和分析，就能从中汲取色彩搭配的灵感：

浅灰色调适宜制作页面背景，明度高而不刺激，生活中的报纸就是这样的浅灰色背景配色方案，如果换成高亮度的纯白纸张，版面就会刺目，不宜于阅读。

男士着装强调成熟、稳重，所以一般无色彩系的黑、白、灰较多，这和我们网页中强调沉稳、大气的网站色彩搭配与出一辙，灰色系更显得低调奢华有内涵。

女性服饰色彩丰富，色调或清新脱俗或明艳动人，这和网页设计中女性用品网站的色彩搭配是一样的。目标展示以缺乏主色调为例任务分解一、缺乏主色调在网上常常可以看到这样的网站，网页上的元素众多、色彩凌乱，一个标题就是一种颜色，每个栏目、每个线条颜色都不相同。这样的网页，虽然画面色彩繁多，好象很丰富的样子，但过多的色彩感受只能给人一种复杂混乱的视觉效果，使访问者无法明确识别重点内容，甚至让人觉得难受、反感，不愿意再次访问浏览。一般来说，色调明确的网页更受访问者欢送，因为这样的网页主次清楚，易于识别、寻找，能减少访问者负担。如图2-4-2所示的配色，虽然只有红色一种色调，但色调统一、层次清楚，视觉效果强烈。任务分解二、文字能见度低人眼识别色彩的能力有一定的限度，由于颜色色的同化作用，色与色之间比照强那么易于分辨，比照弱那么难于分辨，这在色彩学上称为易见度。网页上的色彩通常与文字是结合在一起的，要么成为文字的背景色，要么成为文字本身的颜色，这就出现了文字与背景的比照问题。对浏览者来说，重要的是文字，因为文字才是传达信息最重要、最直接的元素。因此，网页色彩运用就必须注意文字的可识别性，也就是文字的易见度。文字与背景最简单快捷的搭配方式就是高明度背景上用低明度文字，反之亦然，如图2-4-3所示。如图2-4-4所示，如果背景和文字明度接近或者差异太小，就容易出现文字无法识别的问题。任务分解二、文字能见度低各种色彩比照的易见度是不同的，黄色在白色背景上的易见度最低，如图2-4-5所示。橙色与任何一种颜色搭配都很清楚，而且它兼具红色与黄色的优点，柔和明快，易于为人们接受，如图2-4-6所示。任务分解二、文字能见度低黄与白、绿与红、绿与灰、紫与红、紫与黑、青与黑等几种搭配的易见度低，是应该防止使用的色彩组合，如图2-4-7所示。任务分解三、增加视觉负担色彩刺激强度高，画面当然容易引人注目，但这样的色彩不适合大面积使用，否那么容易产生视觉疲劳，低明度色彩疲劳度虽小，但容易产生压抑、沉闷的感觉。一个能有效防止强烈刺激和平淡沉闷的方法就是大面积使用明快柔和的浅色调，而鲜艳的色彩小面积出现，画面呈现出一种既有比照又和谐统一的效果，如图2-4-8所示。任务分解三、增加视觉负担

红色是彩色系中最鲜艳的色彩，对视觉刺激十分强烈，长时间对着大面积的红色会产生烦躁、焦虑的情绪，很容易引起视觉疲劳，如果必须要用红色作背景，如图2-4-11所示使用低明度、沉稳、消极的色彩与其搭配可以有效抑制红色的视觉刺激。

任务分解四、风格与主题脱离

每一个网站都有自己的气质、风格，但在互联网上却常常可以看到这样的现象，一个青年人的网站用了沧桑厚重的配色，一个奢华酒店的网站采用了简洁明快的风格，这样的做法明显背离了主题，合造成形象传达不准确、不合理。

例如设计促销活动的网站，就要尽量使用热烈活泼的色彩，如图2-4-12所示。

任务分解四、风格与主题脱离如果是设计一个成熟稳重风格的别墅网站，就不能使用鲜艳、亮丽的色调，而是应该使用厚重沉稳的灰色调,即使页面中有比较鲜艳的色彩,也要降低其饱和度,使其更沉稳大气，如图2-4-13所示。网页配色涉及生理学、心理学、美学多个学科，不同的色彩能带来不一样的心理效应，例如美国的国旗由红、白、蓝三色组成，这三种色彩的排列在美国人心目中能唤起爱国主义情感，但对其他国家的人可能就没有这样的感受。色彩引起的知觉预期能够影响特定人群的感受，因此，色彩的选择要十分慎重，不能随心所欲。

课堂小结◆本任务我们学习了哪些知识？◆从这些知识出发引出了哪些技能？◆合作学习中，你发挥了多大的作用，有积极主动参与吗？◆自评、互评环节的评价结果是否吻合，不吻合的原因是什么？作业布置一、分析别人的问题与错误是防止自己出现问题与错误的有效方法，按前面所学的知识，分小组寻找最少三种你认为有问题的网页，并写出分析说明。二、红色因为其色彩鲜艳、刺激的特点，是一种网页设计中经常使用的色彩，但这样的特点也使得很多红色网站看上去让人很不舒服。通过上面的学习，大家来试着设计一个让人赏心悦目的红色调网站。