网页的色彩是树立网站形象的关键之一,色彩搭配却是网友们感到头疼的问题。网页的背景,文字,图标,边框,超链接...,应该采用什么样的色彩,应该搭配什么色彩才能最好的表达出预想的内涵呢?这里谈一些心得,希望对你有所启发。首先我们先来了解一些色彩的基本知识:

网页的色彩是树立网站形象的关键之一,色彩搭配却是网友们感到头疼的问题。网页的背景,文字,图标,边框,超链接...,应该采用什么样的色彩,应该搭配什么色彩才能最好的表达出预想的内涵呢?这里谈一些心得,希望对你有所启发。
首先我们先来了解一些色彩的基本知识:
1.颜色是因为光的折射而产生的。
2.红,黄,蓝是三原色,其它的色彩都可以用这三种色彩调和而成。网页html语言中的色彩表达即是用这三种颜色的数值表示例如:红色是color (255,0,0)十六进制的表示方法为(FF0000)白色为(FFFFFF), 我们经常看到的"bgColor=#FFFFFF"就是指背景色为白色。
3.颜色分非彩色和彩色两类。非彩色是指黑,白,灰系统色。彩色是指除了非彩色以外的所有色彩。
4.任何色彩都有饱和度和度的属性,属性的变化产生不同的色相,所以至少可以制作几百万种色彩。
  网页制作用彩色还是非彩色好呢?根据专业的研究机构研究表明:彩色的记忆效果是黑白的3.5倍。也就是说,在一般情况下,彩色页面较完全黑白页面更加吸引人。
  我们通常的做法是:主要内容文字用非彩色(黑色),边框,背景,图片用彩色。这样页面整体不单调,看主要内容也不会眼花。
●非彩色的搭配
  黑白是最基本和最简单的搭配,白字黑底,黑底白字都非常清晰明了。 灰色是万能色,可以和任何彩色搭配,也可以帮助两种对立的色彩过渡。如果你实在找不出合适的色彩,那么用灰色试试,效果绝对不会太差。
●彩色的搭配
  色彩,彩色的搭配是我们研究的重点。我们依然需要进一步学习一些色彩的知识。
一.色环。我们将色彩按"红->黄->绿->蓝->红"依次过度渐变,就可以得到一个色彩环。色环的两端是暖色和寒色,当中是中型色。(如下图)
红.橙.橙黄.黄.黄绿.绿.青绿.蓝绿.蓝.蓝紫.紫.紫红.红
|___________| |____| |_________| |_________|
| | | |
暖色系 中性系 寒色系 中性系
二.色彩的心理感觉。不同的颜色会给浏览者不同的心理感受。
红色---是一种激奋的色彩。刺激效果,能使人产生冲动,愤怒,,活力的感觉。
绿色---介于冷暖两中色彩的中间,显得和睦,宁静,健康,安全的感觉。 它和金黄,淡白搭配,可以产生优雅,舒适的
橙色---也是一种激奋的色彩,具有轻快,欢欣,热烈,温馨,时尚的效果。
---具有快乐,希望,智慧和轻快的个性,它的明度最高。
蓝色---是最具凉爽,清新,专业的色彩。它和白色混合,能体现柔顺,淡雅,浪漫的(象天空的色彩
白色---具有洁白,明快,纯真,清洁的感受。
黑色---具有深沉,神秘,寂静,悲哀,压抑的感受。
灰色---具有中庸,平凡,温和,谦让,中立和高雅的感觉。
  每种色彩在饱和度,度上略微变化就会产生不同的感觉。以绿色为例,黄绿色有青春,旺盛的视觉意境,而蓝绿色则显得幽宁,阴深。
●网页色彩搭配的原理
1.色彩的鲜明性。网页的色彩要鲜艳,容易引人注目。
2.色彩的独特性。要有与众不同的色彩,使得大家对你的印象强烈。(参考设计思考第二篇网站CI的标准色彩一节)
3.色彩的合适性。就是说色彩和你表达的内容相适合。如用粉色体现女性站点的柔性。
4.色彩的联想性。不同色彩会产生不同的联想,蓝色想到天空,黑色想到黑夜,红色想到喜事等,选择色彩要和你网页的内涵相关联。
●网页色彩的过程
  随着网页制作的积累,我们用色有这样的一个趋势:单色->五彩缤纷->标准色->单色。一开始因为技术和知识缺乏,只能制作出简单的网页,色彩单一;在有一定基础和材料后,希望制作一个漂亮的网页,将自己收集的最好的图片,最满意色彩堆砌在页面上;但是时间一长,却发现色彩杂乱,没有个性和风格;第三次重新定位自己的网站,选择好切合自己的色彩,推出的站点往往比较成功;当最后设计理念和技术达到顶峰时,则又返朴归真,用单一色彩甚至非彩色就可以设计出简洁精美的站点。
○网页色彩搭配的
  文章写到这里,有心急的网友要问了:“到底用什么色彩搭配好看呢?你能不能推荐几种配色方案?”别急,这里有一点,可以帮助你迅速成为调色大师
1.用一种色彩。这里是指先选定一种色彩,然后调整度或者饱和度,(说得通俗些就是将 色彩变淡或则加深),产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。
2.用两种色彩。先选定一种色彩,然后选择它的对比色(在photoshop里按ctrl shift I)。我的主页用蓝色和就是这样确定的。整个页面色彩丰富但不花稍。
3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。确定色彩的方法各人不同,我是在photoshop里按前景色方框,在跳出的拾色器窗中选择"自定义",然后在"色库"中选就可以了
4.用黑色和一种彩色。比如大红的字体配黑色的边框感觉很"跳"。
在网页配色中,忌讳的是:
1.不要将所有颜色都用到,尽罧刂圃谌
最新资讯
杨元庆:联想5G标准必要专利突破千件 新技术架构“春山可望”

杨元庆:联想5G标准必要

联想集团董事长兼CEO杨元庆今日表示,联想在5G领域申请
爱彼迎称计划在纳斯达克交易所上市

爱彼迎称计划在纳斯达

房屋短租初创公司爱彼迎(Airbnb)周二表示,计划在纳斯达克
原始黑洞是否可能是暗物质?

原始黑洞是否可能是暗

英国著名物理学家斯蒂芬·霍金提出过一个观点:看不见的
“智慧药片”存在吗?未来喝下神奇药片或将变成“超人”!

“智慧药片”存在吗?未

如果有一种方法可以突破极限,实现能力无限呢?如果有种神
地球上的生命:我们可能要感谢月球现已不复存在的磁场

地球上的生命:我们可

一项新研究表明,大约40亿年前生命正孕育之时,月球上的磁
乐视控股所持大圣科技股权被拍卖 广汽集团成唯一竞买人

乐视控股所持大圣科技

几经波折,乐视控股(北京)有限公司(下称乐视控股)的资产近日
最新文章
网页简单布局之结构与表现原则分享

网页简单布局之结构与

一般来说html结构 css表现 javascrip行为,网页布局要考
隐藏 Web 中的元素方法及优缺点教程详解

隐藏 Web 中的元素方

这篇文章主要介绍了隐藏 Web 中的元素方法及优缺点教
白话分析自适应跟响应式的区别详解

白话分析自适应跟响应

这篇文章主要介绍了白话分析自适应跟响应式的区别详解
div与div之间有空隙的解决方法

div与div之间有空隙的

今天在制作页面的时候发现两个div之间有空隙导致两个
推荐一款酷炫闪烁的告警按钮

推荐一款酷炫闪烁的告

今天小编给大家推荐一款酷炫闪烁的告警按钮,非常不错,具
移动端开发1px线的理解与解决办法

移动端开发1px线的理

这篇文章主要给大家介绍了关于移动端开发1px线的理解