淘宝网店页面设计布局配色装修一本通第3版教案第6章-页面色彩搭配基础知识

1、淘宝网店页面设计、布局、配色、装修第淘宝网店页面设计、布局、配色、装修第3 3版版2开店指导开店指导页面中的色彩是浏览者对网店最直观的了解，也是网店统一风格设计的主要组成部分。一个网店设计成功与否，在很大程度上取决于页面色彩的运用和搭配，页面色彩处理得好，可以锦上添花，达到事半功倍的效果。色彩是树立网店形象的关键之一，因此，在设计页面时，必须要高度重视页面色彩的搭配。第第6 6章章 页面色彩搭配基础知识页面色彩搭配基础知识6.1 6.1 色彩的原理3 自然界中有许多种色彩，如香蕉是黄色的，橘子是橙色的自然界中有许多种色彩，如香蕉是黄色的，橘子是橙色的我们日常见的我们日常见的太阳光，实际由红、绿

2、、蓝三种波长的光组成，物体经光源照射，吸收和反射太阳光，实际由红、绿、蓝三种波长的光组成，物体经光源照射，吸收和反射不同波长的红、绿、蓝光，经由人的眼睛，传到大脑形成了我们看到的各种颜不同波长的红、绿、蓝光，经由人的眼睛，传到大脑形成了我们看到的各种颜色。色。6.2 6.2 色彩的分类4 我们生活在五彩缤纷的世界里，天空、草地、海洋都有它们各自的色彩。你、我们生活在五彩缤纷的世界里，天空、草地、海洋都有它们各自的色彩。你、我、他也有自己的色彩，代表个人特色的衣着、家装、装饰物的色彩，可以充分我、他也有自己的色彩，代表个人特色的衣着、家装、装饰物的色彩，可以充分反映人的性格、爱好、品位。色彩一般

3、分为无彩色和有彩色两大类反映人的性格、爱好、品位。色彩一般分为无彩色和有彩色两大类。6.2.1 6.2.1 无彩色5 无彩色是黑色、白色及二者按不同比例混合所得到的深浅各异的灰色系列。在光的色谱上见不到这3个色，不包括在可见光谱中，所以称为无彩色。6.2.2 6.2.2 有彩色6 有彩色是指可见光谱中的红、橙、黄、绿、青、蓝、紫7种基本色及其混合色，即视觉能够感受到的某种单色光特征。我们所看到的就是有彩色系列，这些色彩往往给人以相对的、易变的、抽象的心理感受。有彩色是由光的波长和振幅决定的，波长决定色相，振幅决定色调。6.3 6.3 色彩的三要素7 明度、色相、纯度是色彩最基本的三要素，也是人

4、正常视觉感知色彩的明度、色相、纯度是色彩最基本的三要素，也是人正常视觉感知色彩的3 3个重要个重要因素因素。6.3.1 6.3.1 明度8 明度表示色彩的明暗程度。色彩的明度包括无彩色的明度和有彩色的明度。在无彩色中，白色明度最高，黑色明度最低，白色和黑色之间是一个从亮到暗的灰色系列；在有彩色中，任何一种纯度色都有自己的明度特征，如黄色明度最高，紫色明度最低。6.3.2 6.3.2 色相9 色相是指色彩的名称，是不同波长的光给人的不同的色彩感受，红、橙、黄、绿、蓝、紫等都各自代表一类具体的色相，它们之间的差别属于色相差别。色相是色彩最基本的特征，是一种色彩区别于另一种色彩最主要的因素。6.3.

5、3 6.3.3 纯度10 纯度表示色彩的鲜浊或纯净程度，纯度是表明一种颜色中是否含有白或黑的成分。假如某色不含有白或黑的成分，便是纯色，其纯度最高；如果含有白或黑的成分越多，其纯度亦会逐渐下降。 在一定条件下，不同色彩之间的对比会有不同的效果。在不同的环境下，多色彩给人一种印象，单一色彩给人另一种印象。 116.4 6.4 色彩对比色彩对比每一种颜色都有自己的明度特征，因明度之间的差别形成的对比即为明度对比。明度对比在视觉上对色彩层次和空间关系影响较大。126.4.1 6.4.1 明度对比明度对比 色相对比是指因色相之间的差别形成的对比。当主色相确定后，必须考虑其他色彩与主色相是什么关系，要表

6、现什么内容及效果等，这样才能增强其表现力。136.4.2 6.4.2 色相对比色相对比 纯度对比是指较鲜艳的颜色与含有各种比例的黑、白、灰的色彩对比，即模糊的浊色对比。146.4.3 6.4.3 纯度对比纯度对比 色彩的面积对比是指页面中各种色彩在面积上多与少、大与小的差别，影响到页面主次关系。156.4.4 6.4.4 色彩的面积对比色彩的面积对比 用冷热差别而形成的色彩对比称为冷暖对比。冷暖本来是人体皮肤对外界温度高低的触觉。冷色与暖色是依据人的心理错觉对色彩的物理性分类，是人对颜色的物质性印象，大致由冷暖两个色系产生。166.4.5 6.4.5 色彩的冷暖对比色彩的冷暖对比 在页面设计中

7、，色彩搭配是树立网店形象的关键，色彩处理得好可以使页面锦上添花，达到事半功倍的效果。色彩搭配一定要合理，给人一种和谐、愉快的感觉，避免采用容易造成视觉疲劳的纯度很高的单一色彩。在设计页面色彩时应该了解一些搭配技巧，以便更好地使用色彩。176.5 6.5 网店页面色彩搭配方法网店页面色彩搭配方法 就像小说和电影中有主角和配角一样，在色彩设计中也就像小说和电影中有主角和配角一样，在色彩设计中也有不同的职责分别。在色彩设计中，有主色、辅助色和点缀有不同的职责分别。在色彩设计中，有主色、辅助色和点缀色不同的功能色不同的功能。186.66.6主色、辅助色、点缀色主色、辅助色、点缀色 在舞台上，主角站在聚光灯下，配角退后一步来衬托他。配色上的主色也是一样，其配色要比辅助色更清楚、更强烈。在一个页面中，占用面积大，受瞩目的色彩一般就是主色。 196.6.1 6.6.1 主色可以决定整个店铺风格主色可以决定整个店铺风格 辅助色使页面丰富多彩，使主色更漂亮，辅助色可以是一种颜色，也可以是几种颜色。辅助色的功能在于帮助主色建立完整的形象，判断辅助色用得好不好的标准是：去掉它，页面不完整，有了它，主色更显优势。206.6.2 6.6.2 辅助色