网站建设模块网站及网页的色彩搭配要点.ppt

04模块 网站及网页的色彩搭配 网站的色彩搭配非常重要，色彩搭配好的网站能给浏览者留下很好的印象，而色彩搭配不好的网站则很难吸引浏览者。本模块主要介绍的色彩搭配的相关知识。内部包括三原色、常见网页色彩、色彩的冷暖视觉、网页的安全色、网站色彩规划与搭配原理和常见配色方案等。 能力目标 1．能区分冷暖色调。 2．能用Photoshop CS5拾取图片颜色。 3．能根据网站内容规划网站色调。 知识目标 1．三原色。 2．冷暖色。 3．常见网页颜色代码。 4．常见网页配色方案。 知识1 色彩的基础知识 在物理学中，颜色由红、绿和蓝三原色[1]（又叫三基色）构成。三种原色的不同的组合，构成现实世界中的所有丰富多彩的颜色。黑色不是有颜色，而是黑色物体不反射任何光线，看上去才表现为黑色。白色不是没有颜色，而是含有全部的颜色。 在设计中，颜色分为彩色与非彩色两种。非彩色是指含有灰、白、黑三系的颜色。彩色是指非彩色以外的所有颜色。 网页HTML语言中的色彩表达即是分别用红、绿和蓝三种颜色的值来表示的。分别把红、绿和蓝三种颜色分为256个（0至255）等级，用不同的组合形成不同的颜色。经过组合后网页就可以表示224种颜色。通常每种颜色的值用两位十六进制数来表示，并以“#”开头。如红色表示为#FF0000，绿色表示为#00FF00，蓝色表示为#0000FF，白色表示为#FFFFFF。 Photoshop颜色拾取 知识2 网页色彩的冷暖视觉 从色彩心理学角度来考虑，桔红的纯色被定为最暖色，在色立体上为暖极；天蓝的纯色被定为最冷色，在色立体上称为冷极，并用冷暖两极的关系来划分色立体其他颜色的冷暖程度与冷暖差别。与暖极近的为暖色，与冷极近的为冷色，与两极距离相等的颜色，称为中间色。由此可知，红、橙和黄等为暖色，蓝绿、蓝和蓝紫是冷色，黑、白、灰、彩和紫等色为中性色。 淡雅清爽的百度网址大全首页 温暖活泼的淘宝网首页 知识3 网页的安全色 不同的硬件环境、操作系统、浏览器对各种颜色的表现有所不同。当显示的颜色与设计的颜色不同时，就会产生失真。但所有的这些环境都可以显示216种颜色集合（调色板），也就是说这些颜色在任何计算机上的显示都是相同的。所有网页中如果使用这216种颜色，就可以避免失真的问题。 网络安全色是当红色（Red）、绿色（Green）、蓝色（Blue）颜色数字信号值为0、51、102、153、204、255时构成的颜色组合，它一共有6 * 6 * 6=216种颜色（其中彩色为210种，非彩色为6种）。 当网页中的有些颜色显示设备无法正确还原时，显示设备就会使用与需要相似的颜色，使显示的颜色尽量达到需要的效果。因此用这216种颜色表现高清晰度的图片时可能会有所欠缺，但表现网页的文字、背景的颜色还是完全可以的。 使用216中安全色是网页设计中累积经验的结果，在进行网页的页面设计时，要尽量使用网页安全色，这样就可以更准确、真实地表现网页的颜色效果。 知识5 网站总体色彩规划 1．定义网站的色彩基调 定义网站的色彩基调就是选择一个颜色作为网站最主要的风格色调。需要注意以下几个方面。 (1)网站的色彩要鲜明。人们在浏览网站时，更愿意接受鲜明的颜色。黯淡的颜色会给人一种压抑的感觉。 (2)网站的色彩要独特。一个优秀的网站，往往与别的网站有着不同的色彩风格。用户可能根据网站的独特风格而接受这个网站。 (3)色彩需要与网站的内容谐调。网站色彩应该依据网站内容给消费者营造相应的气氛。例如科技和教育类网站可以使用浅蓝色，婚庆类网站可以使用粉红色，庆典类网站可以使用大红色。 (4)要注意色彩和颜色的联想性。例如，黑色让人联想到夜晚，蓝色让人联想到天空或海洋，大红色可以让人联想到喜庆等。 2．站点内各栏目色彩搭配原则 在对网站进行颜色搭配时，需要遵循一些颜色搭配的原理和方法。这些配色原理是根据长期设计的经验和人们对颜色的感知形成的。网站的各个栏目，因为需要体现出不同的内容和浏览方式，需要针对不同的网站栏目进行不同的配色。 一般来说，需要吸引用户注意力的栏目应该使用鲜明的颜色。不同的栏目之间应该有一些颜色的对比，增强网页色彩的层次感。 知识6 网页色彩搭配原理 在网页中的一般处理方法是主要内容文字用非彩色（黑色），边框、背景、图片等次要内容用彩色。这样，页面的整体感觉很清爽但不单调，也不会给人眼花缭乱的感觉。 在非彩色的搭配中，黑白是最基本和最简单的搭配，白底黑字或白字黑底页面的内容都非常自然。灰色是万能色，可以和很多种颜色搭配，可以实现不同颜色的和谐过度。在网页中，当有两种对比很强烈的颜色组合在一起，而不好搭配其它颜色时，可以考虑使用灰色为过度的中间色。 彩色搭配是一个比较复杂的内容。网页进行配色时，需要先确定网页的主色调。然后