(2.2)--2.2色彩的应用.pdf

《(2.2)--2.2色彩的应用.pdf》由会员分享，可在线阅读，更多相关《(2.2)--2.2色彩的应用.pdf（30页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、任务二：色彩的应用色彩使宇宙万物充满情感，生机勃勃。色彩作为一种最普遍的审美形式，存在于人们日常生活的各个方面，人们的衣、食、住、行、用，均与色彩发生着密切的关系。色彩的搭配不是炫目的颜色在设计表面简单地组合，色彩搭配的“好”与“坏”，直接影响着浏览者的情感取向，色彩的应用要掌握以下3个知识点：色彩模式 应用色彩 配色方案的应用任务二：色彩的应用我国国家政府的网站色彩有什么共性？色彩的来源是什么？探究及讨论我国国家政府的网站色彩有什么共性？色彩的来源是什么？政府网站网页的主色调一般以蓝色和红色居多，用以表现一种严肃、稳重的效果。所以在色彩搭配设计上要尽量做到稳重、大气、协调。合理运用颜色规律，

2、以主色调为中心，利用颜色的明度、纯度、色相三要素的变化和主色调一同构成网页整体调和一致的色彩关系。探究及讨论自然界中有很多种色彩，但是最基本的色彩有三种（红，绿，蓝），其他的色彩都可以由这三种色彩调和而成，这三种色彩称为“三原色”。现实生活中的色彩可以分为彩色和非彩色。其中黑、白、灰色属于非彩色系列，其他的色彩都属于彩色。色彩模式1色彩模式是数字世界中表示颜色的一种算法。在数字世界中，由于成色显示原理不同于纸媒呈现，因此决定了显示器、投影仪、相机这类靠色光直接合成色彩的设备，与打印机、印刷机这类靠使用颜料的印刷输出设备，在生成最终色彩方式上有着区别，下面介绍四种颜色模式。色彩模式1（1）HSB

3、模式：这是一种从视觉角度定义的颜色模式。在HSB模式中，H表示色相，S表示纯度，B表示亮度，HSB模型描述颜色的3个特征。色相，是纯色，即组成可见光谱的单色；饱和度，表示色相中彩色成分所占的比例，即色彩的纯度；亮度，是色彩的明亮程度。色彩模式1（2）RGB色彩模式：这是工业界的一种颜色标准，表示红色、绿色、蓝色，又称为三原色，英文为R(Red)、G(Green)、B(Blue)，通过它们相互之间的叠加来得到各种颜色。通常情况下，RGB各有256级亮度，用数字表示就是从0、1、2至255，共256级。按照计算，256级的RGB色彩总共能组合出约1678万种色彩，即2562562561677721

4、6，通常也被简称为1600万色或千万色，也称为24位色(2的24次方)。色彩模式1（3）CMYK模式：CMYK模式与RGB模式相反，是一种减色模式。CMYK代表印刷上用的四种颜色，C：青色，Cyan。M：洋红色，Magenta。Y：黄色，Yellow。K：黑色，blacK。（4）Lab模式：由3个信道组成，L信道表示亮度，控制图片的亮度和对比度，a通道包括的颜色从深绿低亮度值到灰色（中亮度值）再到亮粉红色（高亮度值），b通道包括的颜色从亮蓝色低亮度值到灰色再到焦黄色（高亮度值）。色彩模式1色彩是网页设计中最直接、最有力的表现形式，优秀的色彩应用可以准确的表现网站风格、树立网站形象，给人留下深刻

5、印象。应用色彩2（1）色彩的冷暖红、橙、黄等颜色使人联想到阳光、烈火，故称为“暖色”；绿、青、蓝等颜色与黑夜、寒冷相连，故称为“冷色”。网页设计中对于色彩冷暖的合理运用，具有凸显网页主题内容的作用，例如：食品类网页多采用暖色调，因为暖色调相比于冷色调更能让人产生食欲；科技类网页则多采用具有科技感与高级感的冷色调进行色彩搭配。应用色彩2（2）色彩的轻重各种色彩给人的轻重感不同，从色彩得到的轻重感，是质感与色感的复合感觉。浅色密度小，给人分量轻的感觉；深色密度大，给人分量重的感觉。色彩的轻重在不同领域起着不同作用，如：纺织、文化、自然等领域可用轻感色，而机械、科技等领域可用重感色。网页设计中，应注

6、意色彩轻重感的心理效应，如网页上灰下艳、上白下黑、上素下艳等，给人一种稳重沉静之感，忌反之。应用色彩2（3）色彩的前进与后退透视是对空间的想象，如果等距离地观察两种颜色，可以给人不同的远近感。暖色比冷色更富有前进的特性。两色之间，亮度偏高的色彩呈前进性，饱和度偏高的色彩也呈前进性。例如，观察一张由蓝色、绿色、红色组合而成的色彩构成图，就会发现红色显得距离最近，蓝色显得距离最远。由此可知，颜色可以通过距离改变而发生变化。红色从近处看才显得明亮，离远时则显得发蓝。应用色彩2（4）色彩的对比色彩诱人的魅力主要在于色彩对比的妙用，色彩对比强烈，视觉刺激力便强；色彩对比弱，则易产生协调的效果；色彩若无对

7、比关系，便会出现混沌、模糊等效果。应用色彩2（5）色彩的软硬色彩的软硬与明度有关，明度低则坚硬、冷漠感强；明度高则柔软、亲切感强；软色调给人以明快、亲切之感；黑白两色的软硬感不明确，视环境而定；高纯度、低明度的色彩坚硬；低纯度、高明度的色彩柔软。应用色彩2（6）色彩的动静色彩的动静是人的情绪在视觉上的反映，红、橙、黄色给人兴奋感；青、蓝、灰给人以沉静感、稳重感；绿、紫介于二者之间；白色、黑色及高纯度颜色给人以紧张感。网页的布局要具有层次性的色彩设计，会增强页面动感性。应用色彩2（7）色彩的艳丽与素雅如果是单色，饱和度越高，色彩越艳丽。饱和度越低，色彩越素雅。除了饱和度，亮度也有一定的关系。不论

8、什么颜色，亮度高时，即使饱和度低也给人艳丽的感觉。应用色彩2（8）色彩的均衡网页设计想达到看上去舒适协调感觉，除了文字、图片的合理排版，色彩的均衡也相当重要。一般网站不可能单一的运用一种颜色，因此色彩均衡问题也是设计者必须要考虑的问题之一。应用色彩2（1）红色色系红色是最鲜明生动的、最热烈的颜色，因此红色也是代表热情的情感之色。鲜明红色极容易吸引人们的目光,如左图所示。在主要由红色成分构成的色彩中，粉红色象征了浪漫、温馨，暗红色象征了神秘、深沉，桃红色象征了时尚、明亮。配色方案的应用实例3（2）蓝色色系蓝色是色彩中比较沉静的颜色，它是现代商务领域常用的流行色。蓝色与绿色、白色的搭配在现实生活中

9、随处可见。主色调选择明亮的蓝色，配以白色的背景和灰亮的辅助色，可以使站点干净而整洁，给人庄重、充实的印象。蓝色、青绿色、白色的搭配可以使页面看起来非常干净清澈，如右图所示。配色方案的应用实例3（3）其他色系p橙色：使用高亮度橙色的站点通常都会给人以一种晴朗新鲜的感觉p黄色：阳光的色彩，具有活泼与轻快的特点，给人十分年轻的感觉p绿色：代表生命与希望，充满青春活力，经常用于与自然、健康相关的站点配色方案的应用实例3（4）黑白灰色彩黑白灰是万能色，可以跟任意一种色彩搭配。当用户为某种色彩的搭配苦恼的时候，不妨试试黑白灰。当用户觉得两种色彩的搭配不协调，试试加入黑色或灰色。对一些明度较高的网站，配以黑

10、色，可以适当地降低明度。总而言之，作为展示给浏览者的页面，色彩是视觉感受的重要要素，网站的功能布局可通过色彩来进行视觉上的空间划分。配色方案的应用实例3（5）网页色彩搭配网页色彩搭配应根据网站内容、风格以及企业形象设计（英文缩写为CIS)应用要素的规范要求，为网站整体指定一套色彩组合，用于网站的视觉传达设计，以体现网站整体形象或特点，强化刺激以及增强对网站的识别。首先，基于网站的形象选择标准色，其次根据标准色，确定辅助色。网页色彩可采用同种色系，即指先选定某种色彩然后调整亮度或者饱和度，产生新的色彩，用于网页色彩搭配。这样的页面看起来色彩统一，有层次感。配色方案的应用实例3（5）网页色彩搭配其

11、次，采用对比色彩。先选定一种色彩，然后选择它的对比色，如用蓝色和橙色，整个页面色彩对比强烈但不显凌乱。或者，采用同一个明度的色彩，如淡蓝、淡黄淡绿或者土黄土灰、土蓝。在网页配色中还要注意：一个页面尽量不要超过4种色彩，用太多的色彩让人感受不到重点。背景和前文的对比尽量要大，不要用花纹繁杂的图案作背景，最好使用纯色背景，以便突出主要文字内容。配色方案的应用实例3（6）背景与各个网页元素的色彩搭配1)背景与文字一般网站侧重的是文字信息，所以背景可选择纯度或明度较低的色彩，文字采用较为突出的颜色且中文多使用黑体字、楷书等字体笔画较为明显粗壮的字体，拉丁文字则采用无明显字脚及弧度变化的无衬线字体。这样

12、最终设计出的效果一目了然。配色方案的应用实例3（6）背景与各个网页元素的色彩搭配应用2)LOGO和BANNERLOGO与BANNER是宣传网站的重要组成部分之一。LOGO应该在页面中达到醒目、脱颖而出的效果。一般选用鲜亮的色彩或与主题色相反的色彩，会令其更为突出。BANNER设计要突出重点，采用有吸引力的宣传用语；合理安排画面内容，做到主次对比鲜明；颜色不宜过度夸张，努力营造愉悦、舒服的感观效果。配色方案的应用实例3（6）背景与各个网页元素的色彩搭配应用3)导航和小标题导航与小标题起到指引、帮助了解网站结构与内容的作用，在页面间跳转需要通过导航和小标题。因此可采用具有跳跃性色彩以吸引浏览者视线，让浏览者感受到网站清晰明了、层次分明。4)链接颜色的设置文字与图片的链接是网站不可缺少的一部分。由于链接区别于文字，因此色彩要与文字区别开，且有利于浏览者快速找寻，点击链接。可查看雅诗兰黛官网的色彩搭配，如下图所示。配色方案的应用实例3配色方案的应用实例3THANKS