第3章-网页配色-PPT课件.ppt
- 【下载声明】
1. 本站全部试题类文档,若标题没写含答案,则无答案;标题注明含答案的文档,主观题也可能无答案。请谨慎下单,一旦售出,不予退换。
2. 本站全部PPT文档均不含视频和音频,PPT中出现的音频或视频标识(或文字)仅表示流程,实际无音频或视频文件。请谨慎下单,一旦售出,不予退换。
3. 本页资料《第3章-网页配色-PPT课件.ppt》由用户(三亚风情)主动上传,其收益全归该用户。163文库仅提供信息存储空间,仅对该用户上传内容的表现方式做保护处理,对上传内容本身不做任何修改或编辑。 若此文所含内容侵犯了您的版权或隐私,请立即通知163文库(点击联系客服),我们立即给予删除!
4. 请根据预览情况,自愿下载本文。本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
5. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007及以上版本和PDF阅读器,压缩文件请下载最新的WinRAR软件解压。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 网页 配色 PPT 课件
- 资源描述:
-
1、第第3 3章章 网页配色网页配色网站给用户留下的第一印象,既不是丰富的网站内容,也不是网站给用户留下的第一印象,既不是丰富的网站内容,也不是精妙的网站版面布局,而是网站的色彩。色彩是浏览者访精妙的网站版面布局,而是网站的色彩。色彩是浏览者访问时目光无法回避的设计要素,色彩对人的视觉效果影响问时目光无法回避的设计要素,色彩对人的视觉效果影响非常明显,色彩的冲击力往往是最强的,它很容易给用户非常明显,色彩的冲击力往往是最强的,它很容易给用户留下深刻的印象。在浏览者看到网站的一瞬间,对网页的留下深刻的印象。在浏览者看到网站的一瞬间,对网页的整体印象就确定了下来。整体印象就确定了下来。3.1 3.1
2、网页色彩基础网页色彩基础无论平面设计还是网页设计,色彩永远都是十分重要的一环。无论平面设计还是网页设计,色彩永远都是十分重要的一环。浏览者最先看到的不是优美的板式或美丽的图片,而是整浏览者最先看到的不是优美的板式或美丽的图片,而是整体的色彩。生活在数字时代的我们,提起数字最先想到的体的色彩。生活在数字时代的我们,提起数字最先想到的是是0和和1,计算机将所有的信息转换成,计算机将所有的信息转换成0和和1构成的信息流,构成的信息流,然后再进行传递。与模拟信号的概念不同,数字色彩也是然后再进行传递。与模拟信号的概念不同,数字色彩也是通过由通过由0和和1构成的数字信号显示颜色。构成的数字信号显示颜色。
3、3.1.1 RGB3.1.1 RGB色彩模式色彩模式在平面设计中使用最多的颜色模式是在平面设计中使用最多的颜色模式是CMYK表示方法,即青表示方法,即青、杨红、黄和黑色,如图、杨红、黄和黑色,如图3.2所示。而在网页设计中主要所示。而在网页设计中主要使用的颜色模式是使用的颜色模式是RGB,即红、绿、蓝三原色表示方法,即红、绿、蓝三原色表示方法。红、绿、蓝三色称为。红、绿、蓝三色称为RGB三原色,这三种颜色通过任三原色,这三种颜色通过任意混合可以得到其他所有的颜色。现在,几乎所有的电意混合可以得到其他所有的颜色。现在,几乎所有的电子显示设备都以子显示设备都以RGB颜色模式为主,如图颜色模式为主,
4、如图3.3所示。所示。 3.1.2 HTML3.1.2 HTML语言对色彩的描述语言对色彩的描述在网页中,在网页中,HTML语言对色彩的描述方式采用语言对色彩的描述方式采用RGB的十六制的十六制表示方法。对于三原色,表示方法。对于三原色,HTML分别给予两个十六进制去分别给予两个十六进制去定义,这样每个原色就有定义,这样每个原色就有256种彩度,三原色则可以混合种彩度,三原色则可以混合生成生成1700万多种颜色,如图万多种颜色,如图3.4所示。其定义颜色的语法所示。其定义颜色的语法规则是规则是#RRGGBB,例如红色的代码是,例如红色的代码是#ff0000,绿色的,绿色的代码是代码是#00ff
5、00。3.1.3 3.1.3 色彩的分类色彩的分类色彩是人对眼睛视网膜收到的光做出反应,继而在大脑中产色彩是人对眼睛视网膜收到的光做出反应,继而在大脑中产生的某种感觉。物体表面色彩的形成取决于生的某种感觉。物体表面色彩的形成取决于3个方面:光个方面:光源的照射、物体本身的反射、环境与空间对物体色彩的源的照射、物体本身的反射、环境与空间对物体色彩的影响。色彩可分为无彩色系和有彩色系。影响。色彩可分为无彩色系和有彩色系。3.1.4 3.1.4 色彩三要素色彩三要素色相、饱和度、亮度是色彩最基本的三要素,在色彩学上也成色相、饱和度、亮度是色彩最基本的三要素,在色彩学上也成为色彩的三属性,是正常视觉感
6、知色彩的为色彩的三属性,是正常视觉感知色彩的3个重要因素。个重要因素。3.1.5 3.1.5 网页色彩原理网页色彩原理一个网站的整体色彩效果取决于主色调、前景色与背景色的一个网站的整体色彩效果取决于主色调、前景色与背景色的关系。网站是倾向于冷色或暖色,还是倾向于明朗鲜艳关系。网站是倾向于冷色或暖色,还是倾向于明朗鲜艳或素雅质朴,这些色彩倾向所形成的不同色调给人们不或素雅质朴,这些色彩倾向所形成的不同色调给人们不同的印象,也就有了不同的色彩效果。网站色彩的整体同的印象,也就有了不同的色彩效果。网站色彩的整体效果取决于网站的主题需要以及浏览者对色彩的喜好,效果取决于网站的主题需要以及浏览者对色彩的
7、喜好,并以此为依据来决定色彩的选择和搭配。并以此为依据来决定色彩的选择和搭配。3.2 3.2 网站色彩搭配网站色彩搭配色彩搭配既是一项技术性工作,同时也是一项艺术性很强的色彩搭配既是一项技术性工作,同时也是一项艺术性很强的工作。要设计出色彩鲜明的网站,设计者需要遵循一定工作。要设计出色彩鲜明的网站,设计者需要遵循一定的艺术规律,同时考虑网站的主题。网页色彩的运用要的艺术规律,同时考虑网站的主题。网页色彩的运用要达到独特创意的效果,单纯地靠多种色彩的机械组合是达到独特创意的效果,单纯地靠多种色彩的机械组合是不行的,必须对色彩进行合理配置。不行的,必须对色彩进行合理配置。3.2.1 3.2.1 色
8、彩的平衡原则色彩的平衡原则色彩平衡非常重要,它是使网站整体变得和谐美观的钥匙。色彩平衡非常重要,它是使网站整体变得和谐美观的钥匙。唯有使网站整体的色彩均衡,才能打动浏览者的视知觉唯有使网站整体的色彩均衡,才能打动浏览者的视知觉。色彩平衡主要有以下几点原则:。色彩平衡主要有以下几点原则:1.全局掌控全局掌控2.不同的物体色彩感不同不同的物体色彩感不同3.色彩不能偏于一方色彩不能偏于一方4.纯度与亮度之间要均衡纯度与亮度之间要均衡3.2.2 3.2.2 色彩的适应性原则色彩的适应性原则色彩的适应性,主要指色彩与所要表达的对象之间的相互适色彩的适应性,主要指色彩与所要表达的对象之间的相互适应的关系。
9、在网页配色中,要针对所要表达的对象采用应的关系。在网页配色中,要针对所要表达的对象采用与之相符合的色彩,这便是色彩的适应性原则。例如,与之相符合的色彩,这便是色彩的适应性原则。例如,设计一个以乳类饮品为主题的网站时,整体色彩便可以设计一个以乳类饮品为主题的网站时,整体色彩便可以采用绿色,绿色可以使浏览者联想到植物、大自然、健采用绿色,绿色可以使浏览者联想到植物、大自然、健康等,让人的眼睛放松。如图康等,让人的眼睛放松。如图3.22所示,为伊利优酸乳所示,为伊利优酸乳网站截图。设计时,设计人员要充分了解各种颜色所能网站截图。设计时,设计人员要充分了解各种颜色所能产生的联想,避免使用不恰当的色彩搭
10、配。产生的联想,避免使用不恰当的色彩搭配。3.2.3 3.2.3 网页的配色方法网页的配色方法将色彩具体到网页的搭配中,可分为以下几种配色方法:将色彩具体到网页的搭配中,可分为以下几种配色方法:1.单色搭配单色搭配2.类比色搭配类比色搭配3.补色搭配补色搭配4.分离补色搭配分离补色搭配5.原色搭配原色搭配6.暖色色彩搭配暖色色彩搭配7.冷色色彩搭配冷色色彩搭配8.全色搭配全色搭配3.3 3.3 色彩心理与网页表现色彩心理与网页表现色彩是大自然中神奇的现象,我们生活在色彩斑斓的世界中色彩是大自然中神奇的现象,我们生活在色彩斑斓的世界中,色彩时时刻刻影响着我们的生理与心里活动。我们常,色彩时时刻刻
11、影响着我们的生理与心里活动。我们常常感觉不到色彩对自己心理的影响,这些影响总是不知常感觉不到色彩对自己心理的影响,这些影响总是不知不觉地左右我们的情绪。色彩的心理效应发生在不同的不觉地左右我们的情绪。色彩的心理效应发生在不同的层次,有的是直接刺激,有的需要通过间接地联想,而层次,有的是直接刺激,有的需要通过间接地联想,而有些更高层次的则涉及人的观念与信仰。有些更高层次的则涉及人的观念与信仰。当我们看到某种颜色时,总会自然地将这种颜色和现实生活当我们看到某种颜色时,总会自然地将这种颜色和现实生活中的事物联系起来。色彩能引发强烈的心理共鸣,设计中的事物联系起来。色彩能引发强烈的心理共鸣,设计人员在
12、进行色彩搭配时,需要考虑所选的颜色会引起什人员在进行色彩搭配时,需要考虑所选的颜色会引起什么反应。例如,红色是一种刺激性很强的颜色,容易使么反应。例如,红色是一种刺激性很强的颜色,容易使人兴奋、激动、紧张、冲动,同时又容易造成视觉疲劳人兴奋、激动、紧张、冲动,同时又容易造成视觉疲劳。所以使用红色可以引发强调和注意,但若用在。所以使用红色可以引发强调和注意,但若用在?尘吧尘吧惺笨赡芟缘霉惺笨赡芟缘霉谇苛摇谇苛摇?3.3.1 3.3.1 红色心理与网页表现红色心理与网页表现红色是最具有视觉冲击力的色彩,暗示速度和动态,可以刺激心跳加速、加快红色是最具有视觉冲击力的色彩,暗示速度和动态,可以刺激心跳
13、加速、加快呼吸、刺激食欲。红色是热烈、冲动的色彩。如图呼吸、刺激食欲。红色是热烈、冲动的色彩。如图3.31为主要采用红色的为主要采用红色的网页截图。网页截图。1.色彩联想色彩联想具体联想:火焰、血液、太阳、性、西红柿、西瓜瓢、太阳、红旗、口红等。具体联想:火焰、血液、太阳、性、西红柿、西瓜瓢、太阳、红旗、口红等。抽象联想:激情、爱情、力量、活力、侵略、愤怒、革命、危险、残忍等。抽象联想:激情、爱情、力量、活力、侵略、愤怒、革命、危险、残忍等。2.颜色搭配颜色搭配在红色中加入少量的黄,会使其活力旺盛,趋于躁动、不安,极富动感和张扬在红色中加入少量的黄,会使其活力旺盛,趋于躁动、不安,极富动感和张
14、扬。在红色中加入少量的黑,会使其颜色性格变得沉稳,趋于厚重、朴实。在红色中加入少量的黑,会使其颜色性格变得沉稳,趋于厚重、朴实。在红色中加入少量的白,会使其颜色性格变得温柔,趋于含蓄、羞涩,白色能在红色中加入少量的白,会使其颜色性格变得温柔,趋于含蓄、羞涩,白色能冲淡红色的强烈的浓重,缓和红色给人潜意识带来的危机感。冲淡红色的强烈的浓重,缓和红色给人潜意识带来的危机感。红色与浅黄色最为相配,大红色与绿色、蓝色、橙色相斥,与奶黄色、灰色为红色与浅黄色最为相配,大红色与绿色、蓝色、橙色相斥,与奶黄色、灰色为中性搭配。中性搭配。3.3.2 3.3.2 黄色心理与网页表现黄色心理与网页表现黄色是亮度最
15、高的色,在高明度下能保持很强的纯度。黄色给人的感觉是黄色是亮度最高的色,在高明度下能保持很强的纯度。黄色给人的感觉是冷漠、高傲、敏感,具有扩张和不安宁的视觉印象。黄色,有着太阳般冷漠、高傲、敏感,具有扩张和不安宁的视觉印象。黄色,有着太阳般的光辉,因此象征着照亮黑暗的智慧之光,同时也有着金色的光芒,象的光辉,因此象征着照亮黑暗的智慧之光,同时也有着金色的光芒,象征着财富和权力。征着财富和权力。1.色彩联想色彩联想具体联想:阳光、沙滩、小鸡、向日葵、香蕉、蛋黄、面包、菜花等。具体联想:阳光、沙滩、小鸡、向日葵、香蕉、蛋黄、面包、菜花等。抽象联想:聪明、乐观、光辉、明快、希望、光明、喜悦、嫉妒、怯
展开阅读全文