编者按：前几天有一篇给大学生的上海网站制作教程很火，看过的同学还记得作者重点圈出来的网站制作四大原则吗？为了帮同学们有效掌握，并且灵活运用它们，今天咋们深入聊一下四大原则中的对比，全文近5000字，案例生动，赶紧趁着这回把对比原则学个透吧！

等同和对比，联系与分别，归类和不归类等全是能将元素中相同或不同的元素加以差异的方法。基于它们所承载的信息，咋们希望等同的元素能发生某种联系，用以表明它们在某一方面的相似性。咋们一样也希望不同的元素加以区分，以显示它们分属不同的类别。

等同和对比是通过元素之间所呈现的关系表现出来的，假如两个元素有着某种联系，可以确定这两个元素一定有相同的特性。当然，两个不同元素也一定看上去不同。

基础特性

你是如何表达元素间的等同和对比性的？是的，从它们的基础特性中表现出来。

那么，什么是元素的基础特性呢？基础特性便是指的元素自身所固有的特点。举例来说，这样的元素是什么颜色？它有多大？它是什么形状？

这些特性都试图传递着关于元素的较实质的信息。假如一个标题看上去比另一个标题更大，那么咋们就会预估先进个标题更加重要。咋们也会把那些尖锐的凹凸不平的东西视为危险信号。

通常，元素的一类特质通过与另一元素的同类特质相比较才具有意义，上面关于标题便是这样子一个例子。一个标题必须与另一个标题或另外一片文字相比较才能凸显它的重要性。在这里，大小成为一个很重要的对比特质。通过比较，元素才得以表达出它们之间的等同和对比。

另外一种情况是，咋们让几个元素在视觉上出现相同的特质，让这些元素成为一组同类元素。假如一个网页上出现两个元素：两个红色圆圈，顾客当然就会对此产生好奇，为什么它们全是红色？为什么全是圆圈？这会引发出的结论是也许它们不止是外观上的等同，还有其他更深的联系。元素外观的等同也会让人联想到它们会携带相似的信息。

一样的，假如咋们让两个元素外观上不同，那么它们表达出的便是两个有效不同的元素，它们的意义也有所不同。

任何可以被改变的元素特性，都可以让上海网站制作元素变得等同或不同。下边所列出的上海网站制作元素特性便是如此：

• 尺寸
• 形状
• 颜色
• 赋值
• 纹理
• 位置
• 方向

一个长方形和一个圆形的形状对比很明显，而两个红色元素在颜色上具有一致性。一个红色长方形和一个红色圆形就会出现形状各异而颜色相同的情况。你怎样平衡元素中的等同和不同的元素特性，这将确定你的元素要与顾客交流些什么。

注意：

基础特性是区分类似与不同的基本方法，但还有其他方法可以对它们加以区分：元素具体上所承载的信息信息。例如“停”和“走”这两个字的对比，“停止”和“停下”这两个词的相似。图片对比文字，长文章对应短文章，等等。

对比

当人类看到不同的元素会本能地产生紧张的反应，这是当然进化的生存机制，以使咋们能迅速辨认出威胁，让咋们迅速反应出能否必须要立刻飞奔回到保险的地方。

咋们的这种分辨异类的能力使“对比”这一方法变得特别强大。凡对比定会引起注意。它便是吸引眼球的方法。想要让某个元素获得注意，那就让它在视觉外观差异于其他元素就可以。如此一来，咋们便能制造出视觉焦点。事实上，正由于让元素从环境中脱颖而出的方法是如此简单，咋们也不难猜测，假如想要你的设计变得更有趣，这或许也是一个较有效方法。

对比的确可以增强诱惑力。它也能在两种元素间建立起分界。举例来说，主要信息和花絮信息的不同背景色就能轻松将它们区离开来，让顾客一瞧便知哪里是主要信息，哪里是花絮。

对比也能起强调的作用，高亮显示某一重点元素和信息。越是明显的不同，对比越明显，其重要性就越强。

例如，有两种不同的文字标注方法：加粗和斜体。加粗通常会让对比更为明显。即使是远距离一瞥也能比斜体文字更易辨认。

假如你想要区分两个元素，那就将放大它们之间的对比。相信你不希望让顾客自个来判断它们能否不同吧？对比直观且显而易见。不要有模糊不清的地方，让人产生困惑。不要用16px的文字去对比15px的文字。人们通常不可能注意到细微的差异，就算是注意到，也会发生误判。

不过，也请不要对比得太过火。慎用对比。假如所有元素都有差异，都在争抢专注力，那么，其实就等于没有对比一样。过多的干扰产生视觉混乱。

太多的对比也会打破设计中的和谐，造成不用要的紧张和凌乱。也许在某些特别的设计中必须要用到它，不过平时绝对少碰为妙。*先确认什么元素必须要突出，然后让它们与其他元素发生对比。

对比与格式塔

格式塔完形规律在某方面也是依赖于等同和对比的。相对图案背景和突出焦点来说，对比是特别重要的。

不清楚什么是格式塔的同学，百度百科：http://baike.baidu.com，维基百科：格式塔心理學美學

图案背景

当咋们看到一个对象，咋们先进件事便是去区分哪里是背景哪里是主角。这对关系确定了这一对象中其他元素的角色信息。主角与背景必须要有显而易见的对比，否则咋们将很难区分它们。

焦点

焦点是指那些较具吸引和趣味的元素。设计它们时就必须要让它们从周围环境中凸显出来。这一对比也让他们脱颖而出从而获得注意。在一个对象中较突出的便是这样的对象的*要元素，而在此对象中，那些次要突出的便是焦点。

等同

咋们人类的另一个生存机制，除了让咋们察觉不同，也让咋们注意到相同。这让咋们能辨认出什么是咋们应该相信的，从而差异于潜在的危险。对等同有着较强的觉知力，这便是为什么人类能很快认出多种模式。模式赞助咋们理解周围的世界，提供信息并且迅速掌握规律，当形成习惯就能变作咋们的直觉和本能。

当咋们设计两个或多个同类元素时，咋们就在暗示，假如其中一个为真，另外那几个等同的元素也为真。假如一个元素重要，其他几个也一样重要。假如其中一个元素可点击，那么其他几个视觉上类似的元素也可点击。这便是咋们这样子在大段文字之中识别出哪里是链接。视觉对比使得链接文字和其他文字不同吸引你的注意，同时，其他有链接的文字的类似也提醒了你，假如其中一个链接可点击，其他的也一样可以。

同等能显示出几个元素间存在某种联系。它能给你的设计提供熟悉和一致感。

同等让咋们组织信息能力日臻好。当咋们环顾视觉环境，并要对其加以理解，咋们当然而然会将所有事物开展分类，以此掌握越来越多的信息，用记忆的形式存储起来。让它变成咋们的长期记忆，以备以后剖析问题解决问题而使用。

将相同信息的地方设计得外观上也相似，这将会赞助顾客处置和理解信息，而这也正是咋们设计的目标。

元素中的基础特性共同点越多，它们看上去就越等同，从而也就有越来越多顾客认为它们是相同的。它们看上去在某方面成为同类，即使它们只有其中先进一个特性相同。

咋们用等同去构建系统性和模式。任何两个元素的等同都会暗示着它们也许是一个系统。假如再在这样的系统里增加一部分同类元素，那么就会演变成为一种模式，在视觉上它会形成图案、纹理或者具有节奏感的视觉成效。

不是所有看上去相似的信号全是等同的。如下图所示，你是通过形状或是颜色来分类图形？你看见的是一组圆形和一组方形图形？或者，你看见的是红色图形和蓝色图形？

你也许*先注意到颜色，将元素划分为红色和蓝色。这就表明，颜色所传递的等同的信号比形状更强。这也不是有效绝对的，举个例子，一部分红绿色盲的人就不可能注意到颜色的差异，他们*先注意到的是图形的形状。

等同和格式塔

咋们又迅速提到格式塔定律，每个格式塔全是关于咋们如何察觉到物体间的等同和对比。下边是一部分被认为显示出等同的关键之处。

关闭

在一个整体中不同的元素全是这样的整体的一部分

对称和顺序

对称的元素两相互属

统一性的联结

视觉上有联系的元素间的等同

共同区域

在一个相同的区域里元素的等同

邻近

在一个相同的区域里相续元素的等同

连续

在空间中以某种节奏或频率出现的元素等同

共同命运

在运动中的一致

平行

在方向上的一致

等同和对比之间的关系

等同和对比用以表达元素间的关系。一个独立的元素没有意义。一个元素总是与处于同一环境下的其他元素发生着联系。

一个大圆的一角有一个小圆，这样子的设计暗示着什么？一段银灰色文字比其他文字缩进越来越多这又试图表明什么？

可以这样子说，等同和对比就似乎是一个天平，一端是有效不同，一端是有效相同。大多数情况全是介于二者之间的，咋们设计出的发生关系的元素特性也是部分罢了，并不是全部。等同和对比便是表达发生在这样的天平两极之间的关系。

即便我没有说得很清楚，你都可以知道等同和对比是彼此互补的。它们彼此相依而存在，对比是等同所缺少的，而等同也是对比所缺少的。其互补水平全凭其在天平上的位置。

当你将这二者结合在一起来思考就会感受到它们的作用。你可以只用颜色这一元素特性来制造出差异，给几个元素用上同一颜色就让它们发生了联系，然后用另一颜色又让另外几个元素发生了联系，然后这两组元素由于颜色的不同又发生了对比。

色彩代码便是一个很好例子，它是一种特别有效的编码方法，让写代码的人即使看一眼也能很快理解代码的结构，迅速开展上海网站制作。

当一切都等同，无疑会让你感到厌倦。假如一切不同，又会让你烦躁。先进的设计应该让这二者获得很好的平衡，然后又能清楚表达出想要传递的信息。

以上信息由新概念科技（上海网站开发,上海网站制作）为您提供，越来越多精彩信息：http://www.jianzhan0.com/

关注“新概念科技”微信公众号，迅速获取互联网较新资讯