网页设计——入门与提高 教学课件 作者 王维 吴菲 王丽娜 第03章.ppt

《网页设计——入门与提高 教学课件 作者 王维 吴菲 王丽娜 第03章.ppt》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、第3章网页色彩设计3.1色彩基础知识网页设计是一种特殊的视觉设计，它对色彩的依赖性很高，色彩设计同时还是网站风格设计的决定性因素之一。色彩搭配虽然十分重要，但缺少了其他方面的配合和统一协调，也无法设计出优秀的作品。我们通过学习关于色彩的基础知识、配置方法来了解色彩、掌握色彩，并且运用色彩为网页服务。3.1.1网页安全色216网页安全颜色是指在不同硬件环境、不同操作系统、不同浏览器中都能够正常显示的色彩集合，也就是说在任何浏览用户显示设备上都能显示相同效果的色彩。使用216网页安全色彩进行网页配色可以避免失真问题。我们不需要特别的记忆216网页安全

2、色彩，很多常用网页制作软件中已携带216网页安全色彩调色板，非常方便。在Photoshop的Swatches面板菜单中选择WebHues、WebSafeColors和WebSpectrum等调色板，载入色彩板中的任何色彩在任何进算计中显示都可以保证显示效果是一样的。3.1.2色彩的三要素色相（Hue）色相指的是色彩的相貌特征。将视觉所能感受到的红、橙、黄、绿、蓝、紫这些不同特征的色彩，定出名称、相互区别，这就是色相的概念。如果明度是色彩隐秘的骨骼，色相就是色彩外表的华美肌肤。色相体现着色彩外向的性格，是色彩的灵魂。在可见光谱中，红、橙、黄、绿、蓝、

3、紫这些色相散发着色彩的原始光辉，构成了色彩体系中的基本色相。3.1.2色彩的三要素明度(Value)明度就是色彩的敏感强度。明度高是指色彩较亮，明度低就是色彩较暗。在无彩色系中，明度最高的颜色为白色，明度最低的颜色为黑色，中间存在一个从亮到暗的灰色系列；在有彩色系中，黄色为明度最高的色，紫色是明度最低的色。一个彩色物体表面的光反射率越大，对视觉刺激的程度越大，看上去就越亮，这一颜色的明度就越高。纯度(Chroma)纯度指的是色彩的鲜艳程度，也叫饱和度或彩度。我们的视觉能辨认出的有色相感的颜色，都具有一定程度的鲜艳度。纯度体现了色彩内向的品格。同一个

4、色相，如果纯度发生了哪怕是细微的变化，也会立即带来色彩性格的变化。3.2色彩象征色彩本身除了具有知觉刺激，能以引起人的生理反应之外，还会经由观赏者的生活经验、社会意识、风俗习惯、民族传统和日常用品等因素的影响，而对色彩产生具象的联想和抽象的感情，这种联想和感情是人类对色彩的共同认识。从心理学的角度去科学地认识色彩的感情因素和象征意义，有助于更好地为网页设计和色彩选择服务。3.2色彩象征1.红色具象联想：火焰、太阳、血……抽象联想：热烈、危险、活力、愤怒……3.2色彩象征2.橙色具体联想：橘子、灯光、秋叶……抽象情感：温暖、健康、欢喜、嫉妒……3.2

5、色彩象征3.黄色具体联想：柠檬、黄金、枯叶……抽象情感：光明、希望、富贵、朝气……3.2色彩象征4.绿色具体联想：大地、草原、庄稼、森林、蔬菜、青山……抽象情感：自然的、健康的、新鲜、和平、凉爽、清新……3.2色彩象征5.蓝色具体联想：天空、海洋、水……抽象情感：平静、科技、理智、速度、诚实……3.2色彩象征6.紫色具体联想：葡萄、夜空……抽象情感：优雅、高贵、细腻、秘密、不安定……3.2色彩象征7.白色具体联想：雪、云、白纸、天鹅……抽象情感：纯洁、清白、纯粹、清净、明快、高尚、整洁……3.2色彩象征8.灰色具体联想：水泥、鼠、阴天……抽象情感：

6、平凡、谦和、失意、中庸……3.2色彩象征9.黑色具体联想：夜晚、黑发、烟、乌鸦、煤炭……抽象情感：厚重的、老年的、恐怖、死亡、严肃、刚健……3.3配色方案配色就是处理好作品中色彩的统一与变化、秩序与多样性之间的关系。我们掌握色彩的理论知识是为了培养对配色的感觉。色彩是要与环境结合来判断的，即使是一种非常漂亮的颜色，也只有在与周围的环境相搭配时才能真正称得上漂亮。色彩的使用没有明确的限制，如门户网站不能用黑色，或是红色不能用在男士网站里，等等。当纯色过于强烈不适合网站信息时，更改一下纯度和明度，也许就符合了设计的要求。根据色彩规律来制定配色方案，可以

7、帮助我们解决色彩设计时可能遇到的一些问题。3.3.1基于色相的配色方案色彩学家为使色彩更便于研究，将色彩根据不同色相的渐变排列在一个圆形中，称为色环。常见色环有12、24、48不同的色相，色环中最少的色彩有6种，将“赤橙黄绿青蓝紫”中的“青”与“蓝”合并成一种，便于研究。十二色色环3.3.1基于色相的配色方案色相环中跨度15度以内的色彩对比。1.同类色色相3.3.1基于色相的配色方案色相环中跨度45度左右的色彩对比。2.邻近色色相3.3.1基于色相的配色方案色相环中跨度120度左右的色彩对比。3.对比色色相3.3.1基于色相的配色方案色相环中跨度1

8、80度左右的色彩对比。4.互补色色相：3.3.2基于色彩情感的配色方案从理论上说，色彩就是一个系统的体系。色相是色彩系统的