`

网页色彩的搭配

阅读更多

网页的色彩是树立网站形象的关键之一,色彩搭配却是网友们感到头疼的问题。网页的背景,文字,图标,边框,超链接...,应该采用什么样的色彩,应该搭配什么色彩才能最好的表达出预想的内涵呢?

阿捷这里谈一些心得,希望对你有所启发。 首先我们先来了解一些色彩的基本知识:

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.不要将所有颜色都用到,尽量控制在三种色彩以内。
2.背景和前文的对比尽量要大,(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。

分享到:
评论

相关推荐

    网页色彩搭配设计师必备宝典

    ### 网页色彩搭配设计师必备宝典 #### 一、引言 随着互联网技术的发展,网页设计成为了连接用户与信息的重要桥梁。优秀的网页设计不仅能够提升用户体验,还能有效地传达品牌形象,而色彩搭配则是其中不可或缺的...

    网页色彩搭配常见实例及讲解

    "网页色彩搭配常见实例及讲解"这一主题旨在深入探讨如何有效地运用色彩理论,创建出吸引人的、具有品牌特色的网页。 首先,我们要了解色彩的基本原理。色彩可以分为原色(红、黄、蓝)、二次色(绿、橙、紫)以及...

    8款网页色彩搭配软件

    以下介绍的8款网页色彩搭配软件,将帮助设计师轻松解决这一问题。 1. **Adobe Color**(原Kuler):由Adobe公司开发,提供丰富的色彩主题库,用户可以通过调整色彩轮或选择现有的色彩模式创建自定义调色板。此外,...

    网页颜色搭配精选十例__教程网页颜色搭配精选十例__教程

    ### 网页颜色搭配精选十例教程 #### 网页色彩掌握的过程与技巧 在网页设计过程中,色彩搭配是非常关键的一个环节。随着设计师经验的积累,他们往往会经历一个从简单到复杂再回归简单的色彩运用过程。这个过程大致...

    网页色彩搭配内涵解析

    网页色彩搭配的内涵涉及到色彩心理学、美学以及视觉传达等多个领域。 首先,我们来看红色,它是最能吸引人注意力的颜色,带有强烈的热情、活力和刺激感。在网页设计中,红色可以用于吸引用户的焦点,比如重要的按钮...

    网页高手必备-颜色搭配(最实用版)

    "网页高手必备-颜色搭配(最实用版)"这个资源,显然是一份专为网页设计师和前端开发者准备的指南,它深入浅出地讲解了如何有效地进行网页颜色搭配,以创造视觉上和谐且引人入胜的网页设计。 颜色在网页设计中扮演着...

    网页色彩搭配内涵.txt

    网页色彩搭配是网页设计中至关重要的一环,它不仅关乎页面的美观度,更直接影响到用户的体验和情感反应。良好的色彩搭配能够提升网站的吸引力,帮助信息的传递,增强品牌形象,而错误的色彩选择则可能使用户感到不适...

    网页颜色搭配

    网页颜色搭配是设计领域中的一个重要话题,特别是在网页设计中,色彩的选择和搭配直接影响到用户的视觉体验和信息传达的效率。颜色能够激发情绪、引导视线、强化品牌识别度,因此理解和运用网页颜色搭配对于创建吸引...

    网页色彩搭配-配色表

    在本主题中,我们将深入探讨网页色彩搭配的一些核心概念、原则以及实际应用。 1. **色彩理论基础** - **色相**:色彩的基本类型,如红、黄、蓝等。 - **饱和度**:色彩的纯度,饱和度越高,颜色越鲜明。 - **明...

    网页色彩搭配理论

    网页色彩搭配理论。。。。。。。。。。。

    网页设计色彩搭配

    - **灰色应用**:灰色是一种非常实用的颜色,能够很好地与其他任何颜色搭配,也可以帮助对立色彩之间平滑过渡。 2. **彩色搭配**: - **色环概念**:通过将颜色按照“红->黄->绿->蓝->红”的顺序排列,形成一个...

    网页色彩搭配

    网页色彩搭配是网页设计中至关重要的一环,它不仅关乎页面的美观,更直接影响到用户的体验和情感反应。根据给定的文件信息,我们可以提炼出以下关键知识点: ### 知识点一:基本配色原则 - **职业色彩**:灰色和...

    网页颜色搭配器。很实用的哟、

    这是一款可以在网页制作中搭配网页主色调的颜色搭配器。

    20个国外优秀的网页色彩搭配案例分享

    ### 网页色彩搭配的重要性 网页设计中色彩搭配的重要性不言而喻,它直接影响到用户对网站的第一印象。色彩是视觉传达中最直观、最有效的元素之一。一个网站的色彩是否和谐,能直接影响到用户的感受,甚至决定用户...

    颜色代码表 网页颜色搭配知识

    本资料包“色彩”中可能包含了各种颜色代码及其对应的颜色示例,帮助设计师们在创建网页时选择合适的配色方案。 1. **颜色代码类型**: - **十六进制颜色代码(Hex)**: 如#FF0000代表红色,由三组两位十六进制...

    网页制作者颜色搭配器

    网页制作者颜色搭配器是一种非常实用的工具,它专为网页设计师...总的来说,网页制作者颜色搭配器是网页设计师不可或缺的辅助工具,它将复杂的色彩理论转化为直观易用的界面,帮助设计师轻松创建出引人入胜的网页设计。

    网站颜色搭配代码全集

    网页颜色搭配是设计领域中的重要一环,尤其是在网站制作中,色彩的运用直接影响到用户的视觉体验和信息传达的效果。颜色代码是网页设计师必备的基础知识,它们以六位数的十六进制表示法(如#000000代表黑色,#ffffff...

Global site tag (gtag.js) - Google Analytics