首页 >

众包知识 >

网站建设  >

网页设计

网页配色
网页配色
网页配色由浅入深,秩序渐进地讲解网页的色彩设计,及其相关技术。全书内容包括色彩设计的基本原则、网页色彩设计的常软件、网页配色技巧和提高,同时配合大量的精彩案例讲解。
1网页怎样配色?
我们经常所说的一个新颖充满创意的网页往往不是因为它真的有多特别,而是因为它用色彩搭配改变了人们对它的整体印象,带给用户的视觉冲击力极强引起的惊叹。有时候,光有一个不错的设计形态是很难得到用户的肯定的,只有用色彩方案赋予网页该有的品质才是一个好的网页设计。

色彩搭配虽然是一种抽象的东西,但它对于网页设计来说并不是那么困难,相信大多数用户对某种网站的主题和颜色的印象已经形成了一种定向,搭配起来容易得多。即使没有足够的理论知识和经验,甚至是色感,只要遵循以下几个方面,就可在网页上运用自如。

用户对颜色的认知绝大多数是类似的,无论是哪一类的网页,如果太过花哨不仅不会带给用户视觉的享受,还会干扰视觉,那么很明显,网页在显眼的颜色方面配色最好不要超过三种,以免造成页面视觉体验的混乱。

许多人认为不懂颜色搭配,就应找专业的颜色搭配来参考,从网络上搜集大量的配色工具来帮助设计,事实上这种方式会阻碍配色思维的发挥,甚至被误导。

对于主色,只要选择色相差异明显的,在对比色、临近色、冷暖色调之间能够达到互补就可以了,或者在自己选择好的主色中参考类似网站案例,就可以简单完成配色。

.......


查看全文 >>
2网页配色原则
一个在网页设计中最根本的原则是,无论你花了多少时间创造了一个辉煌的设计,其最终的作用是发挥出内容的核心位置。你的配色方案永远不应该比它呈现的内容的更加“响亮”。你的设计应该是在后台,目的是帮助突出网站的内容。

用Photoshop或者Sketch等软件设计网站的时候,创建设计的过程往往是相互独立的。有些设计单个看起来很不错,也能被你的客户所接受,但是当它真正被设计成网页的时候不适当的配色往往会分散访客的注意力。事实上,网页设计的过程是和内容紧密相连的,很多制作高品质的网页看上去空空荡荡,几乎没有内容。

这是一个伟大的想法:你可以在你的网站上先铺陈出你的内容,用设计软件也好用代码也好,然后在你内容的周围设计你的网页。当然这也是一个特殊情况,如果一个特定风格的图像和照片都能和你的设计和谐的融为一体,那么你的设计配色才算是完美。试想一下,网站的配色对内容而言就像衣服对于人的重要性,对此你必须制定一套完美的并且合身的衣服。

选择简单的灰色作为你网站的基调你可以为你的网站基调选择无数种颜色,不过我建议你采用最简单的颜色,比如白色/浅灰色与深灰色的搭配文字背景。

你可以看看任何热门的网站、模版、主题,白色或浅灰色与深灰色搭配成了大多数的选择,这当然也是有充分理由的。这样的搭配对访客而言提高了你内容的可读性,并且把你的图片突出在最前方。

一般来说,你的文字最好避免使用墨黑色,深灰色一般更容易阅读。我们提供一个比较舒服的文字颜色范围:#333333到#666666。

.......


查看全文 >>
3网站配色与布局
红色的色感温暖,性格刚烈而外向,是一种对人刺激性很强的色。红色容易引起人的注意,也容易使人兴奋、激动、紧张、冲动、还是一种容易造成人视觉疲劳的色。1、在红色中加入少量的黄,会使其热力强盛,趋于躁动、不安。2、在红色中加入少量的蓝,会使其热性减弱,趋于文雅、柔和。 3、在红色中加入少量的黑,会使其性格变的沉稳,趋于厚重、朴实。 4、在红中加入少量的白,会使其性格变的温柔,趋于含蓄、羞涩、娇嫩。

黄色的性格冷漠、高傲、敏感、具有扩张和不安宁的视觉印象。黄色是各种色彩中,最为娇气的一种色。只要在纯黄色中混入少量的其它色,其色相感和色性格均会发生较大程度的变化。 1、 在黄色中加入少量的蓝,会使其转化为一种鲜嫩的绿色。其高傲的性格也随之消失,趋于一种平和、潮润的感觉。 2、 在黄色中加入少量的红,则具有明显的橙色感觉,其性格也会从冷漠、高傲转化为一种有分寸感的热情、温暖。 3、 在黄色中加入少量的黑,其色感和色性变化最大,成为一种具有明显橄榄绿的复色印象。其色性也变的成熟、随和。 4、 在黄色中加入少量的白,其色感变的柔和,其性格中的冷漠、高傲被淡化,趋于含蓄,易于接近。

蓝色的色感冷嘲热讽,性格朴实而内向,是一种有助于人头脑冷嘲热讽静的色。蓝色的朴实、内向性格,常为那些性格活跃、具有较强扩张力的色彩,提供一个深远、广埔、平静的空间,成为衬托活跃色彩的友善而谦虚的朋友。蓝色还是一种在淡化后仍然似能保持较强个性的色。如果在蓝色中分别加入少量的红、黄、黑、橙、白等色,均不会对蓝色的性格构成较明显的影响力。 1、 如果在橙色中黄的成份较多,其性格趋于甜美、亮丽、芳香。 2、 在橙色中混入小量的白,可使橙色的知觉趋于焦躁、无力。

绿色是具有黄色和蓝色两种成份的色。在绿色中,将黄色的扩张感和蓝色的收缩感相中庸,将黄色的温暖感与蓝色的寒冷感相抵消。这样使得绿色的性格最为平和、安稳。是一种柔顺、恬静、潢足、优美的色。 1、 在绿色中黄的成份较多时,其性格就趋于活泼、友善,具有幼稚性。 2、 在绿色中加入少量的黑,其性格就趋于庄重、老练、成熟。 3、 在绿色中加入少量的白,其性格就趋于洁净、清爽、鲜嫩。

.......


查看全文 >>
412个在线网页配色软件介绍
对于Adobe Kuler,相信很多人都很熟悉这套工具。你不仅可以在上面寻找到预置的配色方案,也可以创建属于自己的色板。

COLOURlovers是一个极具创造力的色彩主题社群网站,这里有来自世界各地的设计师创造并分享他们自己的配色方案,你可以从这里获取灵感,而且这里更欢迎你在这里分享自己的色彩方案和观点,以及和大家一起探讨最新的色彩发展趋势。

Pictaculous可以帮助你直接从上传的图片中提取出一套配色方案。这是一个简单的网页,通过移动光标,网页的背景颜色也会发生变化,只需轻点鼠标就能将你想要的颜色和对应的代码保存在网页的左栏。

Hexu.al面对那些看起来干巴巴的16进制颜色代码,Hexu.al把它们表意成了具体的英文单词,比如代码为#ACCE55的颜色你可以将它记为Access,#C0FFEE可以记为coffee。掌握了这种方法,枯燥的16进制颜色代码也能变得有趣了起来!

CSS Color Names147 Colors列举了147种CSS颜色名称,对于网页设计师和开发人员来说实在是大有帮助。

50to255列出了140种常用颜色,点击一种颜色就可以看到基于这个颜色、从亮到按的渐变颜色列表,你可以选取自己满意的颜色直接复制代码使用。

.......


查看全文 >>
5网页配色理论与技巧
网页颜色搭配技巧颜色的使用在网页制作中起着非常关键的作用,有很多网站以其成功的色彩搭配令人过目不忘。但是对于刚开始学习制作网页的人来说,往往不容易驾驭好网页的颜色搭配。除了学习各种色彩理论和方法之外,笔者认为多学习一些著名网站的用色方法,对于我们制作…

色彩搭配原理与技巧原色 色盘上延伸最长的几段表示出了三种原色----红黄蓝。它们之所以称为原色。是因为其他的颜色都可以通过这三种颜色的组合而成。 色彩搭配原理与技巧 祺馨色彩色彩搭配原理与技巧 祺馨色彩第二色(间色) 将任何俩种原色混合起来,你…

对于做网页的初学者可能更习惯于使用一些漂亮的图片作为自己网页的背景,但是,浏览一下大型的商业网站,你会发现他们更多运用的是白色、蓝色、黄色等,使得网页显得典雅,大方和温馨。更重要的是,这样可以大大加快浏览者打开网页的速度。

一般来说,网页的背景色应该柔和一些、素一些、淡一些,再配上深色的文字,使人看起来自然、舒畅。而为了追求醒目的视觉效果,可以为标题使用较深的颜色。下面是我做网页和浏览别人的网页时,对网页背景色和文字色彩搭配积累的经验,这些颜色可以做正文的底色,也可以做标题的底色,再搭配不同的字体,一定会有不错的效果,希望对大家在制作网页时有用。

浅绿色底配黑色文字,或白色底配蓝色文字都很醒目,但前者突出背景,后者突出文字。红色底配白色文字,比较深的底色配黄色文字显得非常有效果。

.......


查看全文 >>

相关成功案例

网页设计方案
免费预约
相关知识
网页生成静态好处静态网页生成过程静态网页生成技术静态网页生成系统怎样生成静态网页?动态网页制作技术动态网页制作教程动态网页制作软件动态网页制作步骤动态网页制作是什么?