讲述网页设计中统一原则的运用

　　形式美法则是人类在创造美的形式和过程中对美的形式规律的总结概括，世间万物的美都可以用形式美法则来概括。在平面构成中也有形式美法则：统一和变化，对称和平衡，节奏和韵律，对比和调和。前面跟大家有分享了对比、留白在网页当中的运用，今天设计中国网的笔者分享网页当中那么多元素是如何做到统一一致的。

　　在视觉上的统一可以体现在：图片，色彩;区块;布局;字体，视觉元素。此外，还有一个交互上的统一。

　　1、图片统一

　　图片统一体现在图片大小尺寸上的统一，颜色色系上的统一和图片风格的统一。

　　不管是京东还是天猫淘宝，这些商城在网站上的图片处理就用了这样的统一原则。不一样的场景下对图片的要求也都不一样。比如京东商城的首页，每一个区块起到一定的导航性作用，在这样的场景下，需要的图片都是比较简洁而不是背景复杂的。

　　图片风格上的统一主要体现在网页当中的图片选择上，在写实风格的网页中就不适合卡通的图片，在清爽的界面当中，就不适合劲酷的图片。

　　2、色彩统一

　　色彩统一指的是网页当中色彩色系运用的统一性，这样的统一性可以体现在网页中的整体色系，也可以体现在网页当中所有区块标题的颜色，甚至统一到整个网页界面当中按钮的颜色搭配。一般情况下如果不知道网页定什么色系好，小编给的意见和建议就是跟着你们的logo颜色走。

　　3、字体统一

　　都知道界面当中的字体显示尤为重要，所以字体一定不能让观者觉得乱，一定要做好统一。

　　字体可以在变化中找统一，不管是字体、字号或是颜色上的统一，切勿为了突出字体而做过多效果，反而削弱文字的可读性。

　　在一个网站当中，处理字体统一的时候，最好在界面设置的时候统一设置。可以借助一些建站系统去设置，也可以通过写css样式去确定界面的字号，标题和正文的字体大小最好都统一一致，一定要避免首页正文是14px，进入到子页面的时候字体大小就变成16px，这样容易让观者产生一定的不舒服感。

　　除此，字体的选择上也要统一。现在字库上有很多字体，所以在选用字体的时候最好选用跟网页整体风格相符的字体。

　　4、区块统一

　　区块的统一主要体现在各个区块的高度大小、边框颜色、标题样式或者是区块的整体样式，当然并非所有统一起来就是好的，要具体情况具体分析。还是上面天猫产品界面，那么多区块，样式边框都做了统一，看起来整齐而有序。下图做了错误的示范，区块的边框做了不一样的颜色处理，这样的区块一起出现在界面当中时就会显得凌乱。

　　5、布局统一

　　布局的统一主要是说网页当中一些布局设置要统一，不要这个导航进去的侧边栏在左边，下一个导航进去侧边栏在右边，这样的界面会让人摸不着头脑，用户需要重新去适应新的界面布局。

　　6、视觉元素统一

　　这里的视觉元素包括网页当中各种元素的尺寸、大小和颜色。这些元素可以是按钮、图标、动画等，在网站设计时也要考虑不同页面之间的一致性，尽管功能不同，但是要大体上(可以略有变通)保持不同页面之间视觉风格的一致。

　　7、交互统一

　　交互上的统一也很重要，除了视觉外观上可以一样看到的，”交互”和”行为”上也要下一定的功夫。在各个页面当中的交互性也很重要，且最好保持大致的相同，以免太过凌乱。好比市面上的一些排插上的按钮设计，有些排插上的按钮按下去是开启，有些排插按下去是关闭，这样的交互设计不同一，会让使用者摸不着头脑，使用起来也及其不顺手。生活中都如此，在网页设计当中也是不能忽略交互上的统一，倘若同个界面的同个元素，用户触发这个元素的时候，这个元素给用户两种不同的显示效果，这样只会让用户对这个网站产生距离感。

　　在视觉、交互方式和操作结果上保持一致。减少用户使用成本，也能让用户感到亲切感，体会到产品设计上的严谨性。统一协调其实在网页当中也比较重要，它可以让对比强烈或是突兀的一个界面变得比较舒服和柔和，降低用户心里的不舒服感，拉近用户之间的距离感和亲切感。