广州总部电话:020-85564311

TOP

收起快捷

首页 > 关于途必 > 途必学院 > 大型网站如何正确运用色彩
大型网站如何正确运用色彩
发布日期:2015-05-07 09:03:42
浏览次数:
来源:广州网站建设

在21世纪的今天,人们通过互联网获得工作、学习以及生活所需要的信息,一个优秀的网站不仅能提供信息资讯服务,还得给浏览者带来视觉享受。信息量庞大的大型网站建设更要注意网站的整体美观,并不是网站运用了色彩就会美了,基础色调没有统一,色彩多而杂乱,就会适得其反,让浏览者心生厌恶。吸引用户浏览是网站建设者的孜孜追求,那么如何正确运用色彩,来赢得浏览者的欢心呢?下面,我们一起来探讨一下吧:

 

1、确定网站的风格

网页的色彩设计需要首先确定网站的风格。不同的网站有着自己不同的风格,这取决于所要设计的网站是何种主题,是商业、金融或是教育等。不同的主题将决定一个网站不同的风格,同时也就决定了一个网站的色彩基调。例如商业网站,一般呈现的是稳健、信任及安全的色彩感觉;教育类网站则通常展现的是理想、希望和生长的色彩意象。

确定了网站的主题和风格,即可着手开始准备网站的整体色调。一个网站的色彩可以分为主色、辅助色和点缀色。

先来看主色,映入观者眼中面积大、受瞩目的一般就是主色彩。从它的定义和特性中可以看出,主色是一个网站留给受众印象的主要来源,如麦当劳官网的红色,苹果产品主页的白色等。在无数种色彩中,饱和度(纯度)高的颜色作为主体会比较稳定,所以通常将饱和度高的颜色定位为主色,这是一个很有帮助的关于主色使用的诀窍。

确定了主色,再为页面选择合适的辅助色。辅助色可用来增强页面主题内容表达的活力和情感。选择辅助色有两种截然不同的方法,但都很有效:可选择与主色同色系的颜色(称为同类色),达成画面统一和谐;也可选择与主色相反的颜色(称为对比色),使画面刺激、活泼。以上这两种方式都可以使画面整体达到稳定的效果。

后一步是确定点缀色。点缀色的特点是出现次数比较多、颜色非常跳跃、引起阅读性,且与其他颜色反差较大;它是比较跳跃的色彩,如果反差很小,就无法提起人们注意,起到引导阅读的作用了。

总体概括来说,主色决定着作品风格的趋向,辅助色将使得作品更完美或更丰富,而点缀色则具有引导阅读的功能性,同时也具有装饰和辅助性。在创作过程中需要考虑多种色彩间的强弱关系以及如何搭配的问题。色彩作为一种表达丰富的语言,伴随在形式需求之中,充当着重要的情感元素。每一种色彩都有着很深刻的文化沉淀,当一种色彩成为主角时,它可以决定一个作品的文化方向。在一组页面初开始创作的时候,若还没有形成清晰的思路,可以考虑先从色彩基调入手,确定了大方向后再进行不同的摸索和尝试也不失为一种很有效的方式。

 

2、灵活使用色彩

首先要了解网站所要传达的信息,选择能够加强这些信息的颜色,可以选取其中一种作为网站的主色。例如在设计强调稳健的金融或商业机构时,就应选择冷色系的颜色,如蓝、灰或绿;而在面对教育类网站选色时,黄色、橙色、绿色等展现活力、生命和成长的颜色应成为优选。

其次要了解你的读者群,文化差异可能会使色彩产生非预期的反应。与此同时,不同地区与不同年龄层对颜色的反应亦会有所不同。例如,年轻族群一般比较喜欢饱和度高的颜色,但这样的颜色往往不能引起高年龄层的兴趣等。因此,受众的研究对色彩选择的正确与否将产生至关重要的决定性作用。

在设计中不宜使用过多的颜色,注意把握网站的标准色。标准色指的是能体现网站形象和延伸内涵的色彩,用于网站的标志、标题、主菜单和主色块,给人以整体统一的感觉。其它色彩当然可以使用,但应当只是作为点缀和衬托,绝不可喧宾夺主。一般来说,一个网站的标准色彩不可超过3种,太多则会让人眼花缭乱,影响读者的注意力。

文字和图片作为内容的重要载体,在设计的过程中也应当给与足够的关注。通常在阅读的部分需使用对比色,因颜色太接近将无法产生足够的对比效果,这将妨碍受众的阅读。大型网站的信息量较大,使用白底黑字的阅读效果好,并在关键信息的部分建立功能性的颜色(可作为点缀色的一种),例如标题和超级链接等,确保文字与网页的背景色对比突出:底色深,文字的颜色就应浅,以深色的背景衬托浅色的内容(文字或图片);反之,底色淡,文字的颜色就要深些,以浅色的背景衬托深色的内容(文字或图片),这样才能保证颜色的选择符合其原本应有的加强信息传递的使命。

注意用色的延续性,这一点在大型网站中尤为重要。此类网站通常由众多不同内容的子页面组成,子页面所承载的信息各不相同,所需要的色彩自然也会有所差异,但是要注意保持整体颜色风格的统一。随着时间的推移,网页信息会不断的更新,或许网页版式也会定期进行修改,但是整体网站的色彩基调和风格不应随意进行频繁的变动,而应该保持一定时间内的延续性,这样才能加深网站留给读者的印象。

 

3、遵循基本的色彩心理

色彩的直接心理效应来自色彩的物理光刺激对人的生理所产生的直接影响。日常生活中观察的颜色在很大程度上受心理因素的影响,即形成心理颜色视觉。不同的颜色有着不同的含义,给人各种丰富的感觉和联想。例如蓝色让人联想到海洋,绿色让人联想到森林,白色让人联想到白雪等。上述这些联想是基于人类所能看到的实物,设计师通过将这种感知作用于创作中,经过时间的积累,从而在色彩中提炼出了各类情感的元素,形成象形意义。以下列举了几种常见色彩所能代表的感知:

红色:积极、活力、开放、喜庆;

橙色:阳光、欢快、温暖、舒适;

黄色:轻松、开朗、热闹、幼儿;

绿色:生命、安全、娇嫩、和平;

蓝色:理智、清凉、知性、公正;

紫色:优雅、高贵、女性、庄重;

粉色:柔软、甜美、甜蜜、卡通;

白色:纯洁、简单、洁净、清淡;

灰色:高雅、低调、复古、传统;

黑色:神秘、严肃、正式、豪华;

棕色:大地、自然、厚朴、木质;

作为一名网页设计师,需要不断培养形成自己的特色,千篇一律的色彩选择只会让作品呈现大众风格,略显乏味。但在创新的过程中,仍然需要遵循基本的色彩心理。作品首先应该要在情理之中,其次才是考虑如何呈现意料之外的精彩。

 

4、色彩搭配方法

网页颜色搭配是否合理将直接影响访问者的情绪,好的色彩搭配会给访问者带来很强的视觉冲击力,不恰当的色彩搭配则会让访问者浮躁不安。以下分别列举出了不同情况下的色彩搭配组合所产生的效果:

(一)同种色彩搭配:首先选定一种色彩,然后调整其透明度和饱和度,将色彩变淡或加深而产生新的色彩,这样的页面看起来色彩统一,具有层次感。

(二)邻近色彩搭配:在色环上位置相邻的颜色,如绿色和蓝色、红色和黄色即互为邻近色。采用邻近色搭配可避免网页色彩杂乱,易于达到页面和谐统一的效果。

(三)对比色彩搭配:一般来说,色彩的三原色(红、黄、蓝)能体现色彩间的差异。色彩的强烈对比具有视觉诱惑力,对比色可以突出重点,产生强烈的视觉效果。通过合理使用对比色,能够使网站特色鲜明、重点突出。在设计时,通常以一种颜色为主色调,其对比色作为点缀,以起到画龙点睛的作用。

(四)暖色色彩搭配:使用红色、橙色及黄色等色彩的搭配,这种色调的运用可为网页营造出稳性、和谐和热情的氛围。

(五)冷色色彩搭配:使用绿色、蓝色及紫色等色彩的搭配,这种色彩搭配可为网页营造出宁静、清凉和高雅的氛围。

关闭
推荐新闻
童心无界 童萌有礼——六一儿童节活动来啦!
童心无界 童萌有礼——六一儿童节活动来啦!
六一儿童节是属于“孩子们”节日,不管是天真卡爱的小朋友,还是童心未泯的大朋友。跟着我们一起重回童年,让童心出发吧。
2024.06.03 10:56:04
途必科技十一月生日会--关怀与爱
途必科技十一月生日会--关怀与爱
时隔一个月,又迎来了我们可爱小伙伴们的生日,本月有好几位的寿星生日。途必科技为了关怀员工,特地举办了此次的集体生日会活动,并且还有很多丰富的小吃零食,饮品饮料,当然更重要的蛋糕也是不可或缺的。
2023.11.29 10:57:26
一起成长---十月途必科技员工生日会
一起成长---十月途必科技员工生日会
秋高气爽的季节里头,我们迎来了十月份途必科技小伙伴们的生日,在这个温馨的聚会里一同感受着生日的快乐,能在工作繁忙之余享受到节日带来的温暖。每一次的生日会都是大家在共同的成长,当然啦,成长的路上少不了磕磕碰碰,但是在我们的人生里头,总会相遇温暖,陪伴左右,成长也就变得更加有意义。
2023.10.30 09:29:30
温暖与你同在-八月途必科技小伙伴生日会
温暖与你同在-八月途必科技小伙伴生日会
在每个人成长的背后,总会有温暖相伴,像在途必科技的大家庭里,大家都可以感受到这样的氛围,又温馨,有爱。也许有时候自己都忘了的生日,却是有人记得你的生日,有人愿意为你祝福,这又何尝不是一种温暖呢。途必科技与大家一同成长,也将爱送给大家,途必科技对出席生日会的每一位小可爱表示热烈的欢迎和衷心的感谢,同时也为八月份生日的寿星们送上美丽的祝福~祝愿可爱的寿星们天天开心,心想事成,身体健康,另外也希望每位途必科技的小伙伴在未来的工作中越来越顺利,生活里也越来越好。
2023.08.30 10:32:55
这次圣诞节,我们玩大的
这次圣诞节,我们玩大的
这次的圣诞节,我们玩大的,为了让大家感受到如火热情般的圣诞节,此次带来了很多不一样的玩法和活动。行政人事部代表途必科技给大家制造了很多不一样的惊喜,在这里你可以收获丰富满满的礼物,漂亮小姐姐和可爱圣诞老人的合影,小伙伴们其乐融融的氛围,
2022.12.25 17:00:04
推荐案例
眼光高度决定品牌厚度!
业务展示
专业团队,品质服务

预算不足没关系,

这里

广州市途必企业管理中心(有限合伙)版权所有 粤ICP备2020085998号 Copyright © 2023 All Rights Reserved
 
扫码咨询

专属顾问
扫码咨询您的优网专属顾问!