网页设计色彩搭配

  由于是初学这个,所以也没有什么经验之谈!但是我相信只要去学,就会有经验了。有了好的框架和页面设计,而色彩把握不准,则会导致整个设计失败。

  色彩,是最先也是最持久地给浏览者以网站形象的因素。色彩和谐的重要性,是你我都明白的:)。如何做好色彩的搭配呢?下面总结了几个色彩实用设计的要点,希望能给大家带来帮助。

  一、确定主体色

  遵循主从关系,这是最稳定的处理色彩原则。

  通常我们形容页面颜色会这样说:榕树下(http://www.rongshuxia.com)是绿色的。蚁盟(http://www.yimeng.org)是紫色的。

  其实红、黄、绿、蓝、紫等每一个字都代表一类具体的颜色,也就是色相了,它是指色彩的相貌,是区别色彩种类的名称。在页面上,除白色为背景外大 量使用的颜色,就是这个网页的主体颜色。如果在同一个页面内运用了多种颜色,把握不好的话,就无法确定哪个是主体色。因为其他的颜色面积不能过大,遵循主 从关系。

  二、相近色

  选择色彩相近的颜色,非常容易搭配。

  解释一下:假设在红色里面加白,红色就会越来越亮,明度提高。而加黑,红色就越来越暗。明度降低。那么色彩的明度就是指任何一种色彩的明暗程度。

  假设在蓝色里面加了黑、白、灰,或另一种颜色,就会使得蓝色不纯,不再鲜艳。那么色彩的纯度就是指彩色系中每个色彩的鲜艳程度。

  同色彩系(同色相),明度不同或纯度不同的几种颜色容易搭配,比如挑几种深浅不同的绿色来搭配,一般页面不会有太大问题;同一页面尽量不要多出 4种颜色。超级连接的色彩搭配也是遵循以上的原则。而文字颜色的搭配,则要与背景分离。有个小方法:打开Dreamweaver的颜色盒(如下图)。如果 它们6色为一组的话,每组都是很不错的配色方案,但是都比较高调。其实如果搭配颜色的时候遇到麻烦,就可以在颜色面板中,调入不同的几种色系,看看它们相 邻的颜色,或隔几种色来搭配,找合适你页面的颜色绝对不难。

  调色板

  三、色彩均衡

  它是比较保险的配色互补原则。多种颜色同时存在的时候不容易把握好,一定要调和统一。

  比如利用色彩错视现象,其中的重量错视在实用设计时用处很多。也就是明度高的浅亮色看起来较轻,明度低的深暗色则较重。

  那么在网页设计中,如果运用了较多明度较高的颜色。比如图3中左边是比较浅的颜色或亮的颜色,就可以用黑色,或同色相的深色小面积压一下,点缀 一下,使得页面不要太轻,达到色彩重量的平衡。平衡的颜色较符合多数人的色彩心理。根据你的情况,如选用黑色,可能会严肃和庄重,而用同色相的深色,则轻 松一些。

  四、黑白灰运用

  其实黑白灰是宝贝,万不可小看它们。

  如果在用色上遇到麻烦,可以大面积的加白,灰;小面积加黑来调节其他颜色搭配不当。遇到使用纯度很高的颜色,比如纯蓝,纯黄等,这样的搭配会很鲜艳,视觉感觉比较兴奋。把这样的颜色明度抬高或降低,搭配上灰、白色,也是调节的方法。

  http://www.kvad.com/v5/portfolio/design.html,用黑色调节红和绿,搭配得和谐稳定。

  五、色彩心理与情感

  选择适合内容风格的颜色。

  1.色彩有冷暖的感觉。如儿童类站点不要使用冷色系,且色彩要丰富一些。

  2.色彩有柔软和坚硬感。同色相,明度高,则有柔软感。明度低,则会有坚硬感。女性站点,适量选用柔美的淡粉色或高级灰,而男性类站点,就可以使用棕色,深蓝色。

  3.从色相看,暖色给人的感觉华丽;从明度看,明度高的感觉华丽;从纯度看,纯度高的色彩给人的感觉华丽。由此首饰类站点可以使用高雅的咖啡和金黄色,而香水类站点可以用明度高的淡绿或浅蓝色。

  4.色彩的联想。主要色相抽象的联想(省略具体的联想):

  红色:热情。橙色:温暖、欢乐。黄色:光明、快活。绿色:和平、新鲜。蓝色:安宁、平静、理智。紫色:优雅、高贵、庄重、神秘。黑色:恐怖、死亡。白色:纯洁、神圣、清净。灰色;谦逊等等。

  如游戏站点,适合黑色,暗色比较神秘。旅游类站点,可以选用草绿搭配黄色。政府类站点,可以使用红色,蓝色。时装类站点,可以选择高级灰、紫色等,突出高雅氛围。校园类站点也适合绿色。科技类适合深蓝色。新闻类适合深红色,或黑色,搭配高级灰等等。

  5.色彩明度的高低与声音的高低相关。强烈的色彩如亮黄色、鲜红色,具有尖锐、高亢的音乐感。暗浊色如海蓝色、深灰色等具有低沉浑厚的音乐感。现代音像艺术正是采用了视觉与听觉等多媒体相结合的方法,展现了丰富、新颖的视听效果。

  6.根据色彩的味觉感。绿色、黄绿色是未成熟的果实色彩,有酸、涩的味感。橙色、浅黄色、浅棕色、粉红色使人想到了成熟的瓜果色彩而产生甜甜的味感。设计饮食类站点,就可以遵循以上原则。

  六、页面的色彩分配

  1.网页内容,是信息存储空间,要求背景要亮,文字要暗,对比度要高。一般是白黑字,如果是黑底,也可以是灰字,可以用很淡的颜色来做,淡到让人可以忽略。

  2.网页标头,是LOGO和主要信息放置的地方。一般要深色。具有较高对比度,以便用户能够非常方便地看到他在该站点的所在位置。标题通常与页面其它部分有不同的"风貌",它可以使用与网页内容非常不同的字体或颜色组合。也可以采用网页内容的反色。

  3.导航菜单所在区域。把菜单背景颜色设置暗一些,然后依靠较高的颜色对比度、比较强烈的图形元素或独特的字体将网页内容和菜单的不同目的准确地区分开。

  4.侧栏,尽管不是所有网页都使用侧栏,它仍不失为显示附加信息的一个有用方式。它应与网页内容清楚地区分开,同时也要易于阅读。

  5.页脚,这一项最不重要,不应该喧宾夺主。可以考虑和侧栏相同的颜色,或稍微压一下深一些的颜色。

  6.在配色上使用一些比较跳跃的颜色,用来引导视线。如:http://www.biznew.com/灰棕色为主题色。用跳跃性的橙色来做导航、按钮,指引视线的去向。

时间: 2024-09-16 19:06:16

网页设计色彩搭配的相关文章

网页设计色彩搭配宝蓝色的介绍

古典的色彩组合带有势力与权威的意味,强烈的宝蓝色(royal blue)是任何一个古典色彩组合的中间装饰色.它是如此地醒目,就算和其它的色彩搭配在一起,也毫不会逊色.古典的色彩组合表示真理.责任与信赖.又因为它接近绿色,宝蓝色会唤起人持久.稳定与力量的感觉,特别是和它的分裂补色--红橙和黄橙色搭配在一起. 补色色彩组合 原色色彩组合 单色色彩组合 21 69 20 68 4 36 68 67 70 68 68 22 70 17 69 2 34 66 71 69 68 70 68 17 66 18

网页美工设计色彩搭配

在网页设计中色彩搭配是相当重要的一个环节,网页的视觉效果情况对于游客的印象分有着很大的影响,因此也就形成了网页美工这个行业.因为网页视觉效果的重要性,因此在网页设计的过程中,色彩搭配原则是作为一名合格的网页美工必须要掌握的. 网页设计色彩搭配原则网页美工设计中,最常用的几个颜色为蓝色.绿色.橙色,以及暗红色. 蓝色多与白.橙搭配,蓝为主调.白底,蓝标题栏,橙色按钮或ICON做点缀;蓝天白云,沉静整洁的感觉. 绿色多与白.兰两色搭配,绿为主调.白底,绿标题栏,兰色或橙色按钮或ICON做点缀,绿白相

网页设计之色彩搭配

  网页设计涉及到的技术至关重要,它实质上更多的是一门艺术.出色的网页设计能够给用户留下深刻的印象,包括整个页面的布局,图片展示以及内容编辑等,都影响着用户对网页的评价,但是所有的网页元素设计都离不开色彩的搭配学问,因为网站的整体格调,版面效果等是由颜色决定的,也是用户产生视觉共鸣的第一要素. 我们经常所说的一个新颖充满创意的网页往往不是因为它真的有多特别,而是因为它用色彩搭配改变了人们对它的整体印象,带给用户的视觉冲击力极强引起的惊叹.有时候,光有一个不错的设计形态是很难得到用户的肯定的,只有

网页设计常用色彩搭配表,配色表

  考虑到国庆也有很多人没有办法在电脑前着手教程,那么,给你好的货就果断收走吧! 文章末尾还有小惊喜哦~ 在我们做网页设计的过程中,我们心里想要的各种色彩怎样调试出来的呢?特别是在我们的计算机中呢?下面,我们通过色相搭配和印象搭配的分类方法,在电脑上进行色彩搭配,并对搭配出来的每一种颜色附上对应的计算机代码.这样,在我们设计网站的过程中,就能够轻易地得到自己想要的颜色. 色彩搭配中色相搭配分类 网页设计中常见的色彩搭配按照色相的顺序归类.每类都以该色相为主,配以其他色相或者同色相的,应用对比和调

网页设计中色彩搭配的内涵_CSS/HTML

网页的色彩搭配往往是网友们感到头疼的问题,尤其是那些完全没有美术基础的网友.到底用什么色彩搭配好看呢?  一.红色的色感温暖,性格刚烈而外向,是一种对人刺激性很强的色.红色容易引起人的注意,也容易使人兴奋.激动.紧张.冲动.还是一种容易造成人视觉疲劳的色.  1.在红色中加入少量的黄,会使其热力强盛,趋于躁动.不安.  2.在红色中加入少量的蓝,会使其热性减弱,趋于文雅.柔和.  3.在红色中加入少量的黑,会使其性格变的沉稳,趋于厚重.朴实.  4.在红中加入少量的白,会使其性格变的温柔,趋于含

25个巧用字体排版帅气的优秀网页设计

  虽然排版是网页设计 中极为重要的组成部分,但是绝大多数的网站并未在排版上做过专门的设计和调整. 事实上,在我看来我们日常访问的许多网站在排版设计上并无亮点,这也是为什么,当我们发现这些在排版设计上用心雕琢的网站的时候,会由衷地感受到喜悦和别样的幸福感. 如果你厌倦了无处不在的宋体.雅黑.Arial和Helventica,那么你应该会喜欢接下来的案例,这些巧用字体排版帅气的优秀网站会再次扩充你的网页收藏夹. 1. V02 Group 雅致的文字排版悬浮在半空中,和背景融为一体,这种设计除了众所

网页设计色彩及网站配色

一个网站,给用户留下第一印象的既不是网站丰富的内容,也不是网站合理的版面布局,而是网站的色彩.色彩对人的视觉效果非常明显,一个网站设计成功与否,在某种程度上取决于设计者对色彩的运用和搭配.因为网页设计属于一种平面效果设计,在排除立体图形.动画效果之外,在平面图上,色彩的冲击力是最强的,它很容易给用户留下深刻的印象.因此,在设计网页时,我们必须要高度重视色彩的搭配. 一.色彩的基础知识 色彩五颜六色.千变万化,我们平时所看到的白色光,经过分析在色带上可以看到,它事实上包括红.橙.黄.绿.青.蓝.紫

有关网页设计的那些事儿

从这周起,将汇总QQ交流群中每天回复读者的一个网页设计方面的问题,按照一周的周期集结成文章,每周五发布在博客并共享在群中,供大家阅读参考.相较于我们经常发布的设计教程,这样的问答对于个人来说更有针对性,离我们日常的设计工作更近一些.我个人也有这样的体会,有时会有一两个问题长期停留在脑子里,得不到解决,偶然的碰到刚好涉及到这方面的文章,会有一下子豁然开朗的感觉.所以这样的形式也是非常有价值的.以下就是第1周的所有问题和答复,希望在设计对大家有所帮助. 一.质感的表现.作品好坏的评价(小李飞刀于8月

网页设计中文字颜色的搭配技巧

技巧|设计|网页|网页设计|中文 对于做网页的初学者可能更习惯于使用一些漂亮的图片作为自己网页的背景,但浏览一下大型的商业网站,你会发现他们更多运用的是白色.蓝色.黄色等,使得网页显得典雅,大方和温馨.更重要的是,这样可以大大加快浏览者打开网页的速度. 一般来说,网页的背景色应该柔和一些.素一些.淡一些,再配上深色的文字,使人看起来自然.舒畅.而为了追求醒目的视觉效果,可以为标题使用较深的颜色.下面是我做网页和浏览别人的网页时,对网页背景色和文字色彩搭配积累的经验,这些颜色可以做正文的底色,也可