图片展示

网页中用到的对比原则(一):色彩对比

浏览:10814 发表时间:2017-05-08 10:00:33

说起专业,小编学的是平面设计,后来慢慢转到了网页设计,这么多年过去了,小编用蝉知系统也是给多个行业领域的客户定制了诸多的网站。所以今天小编来给大家分享一下怎么将平面设计的一些知识运用到网页设计当中去。


形式美法则是人类在创造美的形式和过程中对美的形式规律的总结概括,世间万物的美都可以用形式美法则来概括。在平面构成中也有形式美法则:统一和变化,对称和平衡,节奏和韵律,对比和调和。小编曾给大家介绍《写给大家看的设计书》这本书,书中作者也概括了设计四大基本原则,分别是:对比、重复、对其和亲密性。平面构成的形式美法则和Robin在书中概括出的设计四大原则中都包含了对比,这两者所表达的内容是一样的,可见对比在设计中的重要性。


一个网页是由很多个不同元素构成的,这些元素的重要性都不同,有些元素需要特别突出、有些元素彼此之间存在着联系,而另外的元素之间则一点关联性都没有。如何去平衡元素中的等同和不同的元素特性,就显得特别重要,因为如果不能将这些元素在一个画面当中协调处理,这个画面便变得突兀。对比就是两个或更多个元素之间的不同。通过对比,设计师就可以创造出视觉趣味性,同时引导用户的注意力。


常见的对比有这么多的表现形式:

1) 色调上的明暗对比、冷暖对比等;

2) 形状上的大小对比、方圆对比、粗细对比、长短对比等;

3) 方向上的垂直对比、水平对比、倾斜对比等;

4) 数量上的疏密对比等;

5) 图片上的虚实对比、黑白对比等;

6) 事物的动静对比等。


对比的表现形式比较多,今天小编先来跟大家分享一下网页界面当中的——色彩对比。


不同的颜色可以表达不同的感受,颜色上的对比也有很多,这个跟色彩构成有很大的关系。颜色对比主要分色相对比明度对比纯度对比

色相即各类颜色色彩的相貌称谓,任何黑白灰以外的颜色都有色相的属性。如朱红、普蓝、柠檬黄等。色相是色彩的首要特征,是区别各种不同色彩的最准确的标准。

明度指的就是色彩的亮度。比如:深黄、中黄、淡黄、柠檬黄等,这些黄颜色在明度上就不一样。颜色有深浅、明暗的变化,这些颜色在明暗、深浅上的不同变化,也就是色彩的明度变化。

纯度指的是色彩的鲜艳和深浅程度。纯度是色彩鲜艳度的判断标准,纯度最高的色彩就是原色,随着纯度的降低,色彩就会变暗、变淡。


一、色相对比。两种以上色彩组合后,由于色相差别而形成的色彩对比效果称为色相对比。它是色彩对比的一个根本方面,其对比强弱程度取决于色相之间在色相环上的距离(角度),距离(角度)越小对比越弱,反之则对比越强。

根据色相环可以看出色环上的颜色是多丰富多彩,随意抽取两个颜色,都能形成不一样的对比。因此色相对比又分很多,有补色对比、对比色对比、色相对比等等。


1、互补色对比

在色相环的组成中,相隔 180 度的色彩我们称之为互补色:红与绿互补,黄与紫互补而蓝色与橙色互补。互补色的对比效果强烈、眩目、响亮、极有力,但也需要慎用,因为使用不当易产生幼稚 、原始、粗俗、不安定、不协调等不良感觉

Orangina这个网站就是巧妙的运用了蓝色和橙色互补色的对比,设计者在颜色的轻重上做了很好的拿捏,整个网站以蓝色为主,橙色为辅,加上适当的白色来削弱橙色的对比,界面显得效果醒目和有冲击力。


如果加大界面橙色部分会变成怎样呢?

可以看到,当橙蓝各占一半的时候,这时候的对比是最强烈的,也是最容易

图片展示
  • 联系人:
  • QQ:
  • 留言内容:
  • 验证码:
    请输入验证码

留言列表


【5】 2017-04-30
66666
回复内容2017-04-30
去你的……
重置文章字号 更多+

贴心服务

  • 网站每周自动备份
  • 生成APP,一下高大上
  • 云服务器,不需另外买空间
  • 域名代备案

帮助中心

  • Bootstrap前端框架
  • SuperSlide.2.1.1
  • FlexSlider-0690ec2
  • 有问必答

联系我们

  • service@sanxiegang.com
©2008-2017 三斜杠网络公司版权所有 盗用必究 QQ:2558731797
三斜杠专注于深圳小微企业网站建设,为您打造个性化互联网平台. 粤ICP备17053880号