当前位置:HOME > 新闻资讯 > 网站建设 > 分享下网页设计的配色技巧

分享下网页设计的配色技巧

日期:2019-05-20      浏览次数:

用户界面的构建过程之中,尤为耗时的事情是色彩的选择。其实能够与整个设计项目贴合、能够覆盖整个设计之中所有元素需求的配色,需要于设计之中急速的调整与验证。一套强大因而有效的配色方案,可能需要好几个小时来回的打磨。
 
所以,今天的文章,我们总结了6个关键的配色技巧,帮助设计师于进行网页设计的时候,选择合适的色彩,使得配色的过程更为轻松高效。
 
技巧1、掌握60-30-10原则
 
60-30-10原则最为早是源自在室内设计领域,室内设计师借助这一原则,创造出协调的室内设计配色。这一原则非常容易理解,借以达到平衡的配色,几种色彩遵循这60%—30%—10%这样的色彩配比。其中占据60% 的是主色,因而30%亦是次住色,因而占据10%的色彩应当作为提亮色。
 
这一的配色比例遭认为是甚作为令人愉悦的,于视觉感知之上,它提供了一个十分让人舒适的色彩层次,这样的控制让整个网页的色彩以此一种可控的比例呈现出来,因而绝不是把整个设计弄得一团糟。
 
技巧2、对比是你最为好的朋友
 
色彩的对比基本上是任何视觉构图的关键部分。对于比度创造了UI元素的差异,亦赋予它们以此性格。值得注意的是,UI其中来自同一色系的色彩常常绝不会呈现出明显的对比度,因而可识别度比较低的文本尤为界面信息传达与交互的障碍。
 
设计师需要依据设计目标,来合理地控制整个产品的对比度高低。举个例子,假如你需要让用户注意到特定的元素,那么最为好使用高对比度的色彩来达到引人瞩目的视觉体验,比如使用高对比度的红色与蓝色。CTA按钮经常便是使用这样的色彩。
 
不过,把UI视作为整体的话,高对比度的色彩可能并且总额能奏效。文本内容与背景的对比需要控制于一个合理的度下面,的话便会由于对比过小产生「晕影」的视觉效果,这会影响长时间阅读的阅读体验。这便是为什么会建议设计师采用温和的对比度控制,并仅于特定的元素之上使用高对比度。透过于不同的设备之上测试,可以让设计师保持配色的可用性与泛用性。
 
技巧3、参考色彩心理学
 
正在如同我们于前文之中所提到的,大量我们所熟知的设计工作流程均是根据心理学原理开展的。色彩心理学是与设计息息相关的一个心理学分支,它重要研究色彩对人类情绪与行为之上的影响。我们脑部对色彩的反应实际上是非常敏感与多样的,不过于日常生活之中我们非常难直观地、迅速地感受到。如果人的眼睛感知到一种色彩的时候,会往大脑之内的分泌系统发出信号,并释放刺激产生对应情绪的激素。
 
每种色彩对我们的感知与思维均有独特的影响力,了解这些可能的反应最后可以帮助设计师正确地传递信息,并引导用户依照设计师的预期用以执行。上面是一些颜色的基本的特征与含义:
 
红色,象征爱情,自信,激情与愤怒,它是充满活力与温暖的色彩,予人带来兴奋的感觉。
 
黄色,能传递出幸福,阳光,喜悦与温暖的情绪。
 
绿色,亦经常能予人自然、清新、富有生命力的感觉。
 
蓝色,是目前最为受欢迎的颜色之一,企业经常会使用蓝色来传递自信与让人信赖的感觉。
 
紫色,和皇室、财富关联密切,这亦是代表神秘与茉莉的色彩。
 
黑色,尽管与死亡、悲剧有关,不过亦能营造沉稳大气的高级感。
 
白色,代表纯洁无暇,传达出高雅,纯粹与清晰的感觉。
 
除此之外,设计师也需要明白一个事情,便是人与人的视觉感受一般是不同的,对色彩的认知也受到文化背景的影响,性别的因素对色彩偏西好的影响亦绝不小。所以,了解目标用户的特征是非常有必要的。
 
技巧4、你们忘了文化差异
 
正在如同前文所说的,文化背景对色彩有着深刻的影响。不同的文化有着不同的传统文化与信仰特征,而且同一一种颜色于不同的国家有着截然不同不同的解读方式。白色于欧美国家经常象征着纯洁与高贵,不过于亚洲地区,丧事亦经常遭称为“白事”,代表着死亡与悲伤。于中国,色彩饱和度高的正色是传承了几千年的视觉文化元素,不过于日本,反而以此间色与低饱和度的色彩作为美。
 
只于专业的色彩知识架构下,深入了解受众当地的文化特征,便能越来越好的降低遭误解的风险,创造出优秀的设计。
 
技巧5、努力让色彩协调起来
 
协调的UI设计是设计师的目标之一,因而这意味着配色某种要和谐因而令人感到舒适。透过色彩来营造富有吸引力的协调设计,能够让用户清晰明了地感知到UI之中的内容,除此之外留下良好的第一印象。
 
随著多年的摸索,于配色方案上前人总结了一些基本的配色方法:
 
单色配色。单色配色并且绝不是说仅有一种颜色,或者根据同一色系来进行配色,不同明暗、饱和度的色彩组合到一起,构成配色方案。
 
类似色。于色轮之上彼此靠近的颜色构成的配色方案。
 
对于比色。色轮之上彼此处于相对位置的色彩能够构成鲜明的对比,这些对于比色能够构成高对比度的配色方案。
 
拆分互补色。拆分互补色的配色原理与互补色相似,不过不同的地方在于,这样的配色其中会采用越来越多的颜色,如果你选择蓝色后,和之搭配的绝不是对位之上的橙色,或者橙色两边的黄色与红色。
 
三元色。它是于色轮之上挑选互相为120度角的三个颜色类进行配色。建议使用其中的一种色彩为主导,此外两种色彩用来提亮。
 
双互补色。采用两对互补色来作为主要的配色方案。
 
技巧6、自大自然获取配色
 
大自然是世界之上最为好的艺术家与设计师,我们于自然环境之中看到的色彩组合多半均十分的协调,而且可以说接近完美。人们所喜欢的日落与黎明,喜欢秋日的落叶与冬天的山野,由于这些色彩组合有着独特的美感。

上一篇:网站建设之网站定位很重要

下一篇:11个网页设计的技巧分享

返回列表

更多 +联系我们

业务电话:0573 / 8221698018257330123

业务 QQ:  935003069

客服电话:0573 /82216980

客服 QQ569963278 E-mail:  service@seatec.cn

关于海纳科技

嘉兴市海纳网络科技有限公司20年专注于网站定制与互联网产品开发。始终秉承以客户为中心的服务理念,"海纳百川,服务永久"的服务宗旨。致力于为客户建设一个全方位的互联网营销体系,帮助传统企业实现"互联网+"转型升级。

多年来海纳科技为企业提供全方位的网络支持。包含网站定制开发、微网站/公众号开发、小程序/APP 定制开发、企业邮箱、宣传片/商业拍摄等,从策划、设计、开发、实施维护等各阶段,不断探索视觉与体验的完美结合,为客户提供专业化的整体解决方案。

我们珍视与客户的每次合作,始终把与客户的共同发展作为己任,与众多客户在蓬勃发展的市场环境中互促共生。