网页设计中多元素是如何做到统一一致

时间: 2017-03-29
来源: 网络
作者: 未知
浏览:
手机浏览

扫一扫手机浏览

推荐在WIFI环境下使用

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

在视觉上的统一可以体现在?#21644;计?#33394;彩;区块;布局;字体，视觉元素。此外，还有一个交互上的统一。

1、?#35745;?#32479;一

?#35745;?#32479;一体现在?#35745;?#22823;小尺寸上的统一，颜色色系上的统一和?#35745;?#39118;格的统一。

不管是京东还是天猫淘宝，这些商城在网站上的?#35745;?#22788;理就用了这样的统一原则。不一样的场景下对?#35745;?#30340;要求也都不一样。比如京东商城的首页，每一个区块起到一定的导航性作用，在这样的场景下，需要的?#35745;?#37117;是比较简洁而不是背景复杂的。下面我做了一个错误的示例给大家演示：

网页设计中多元素是如何做到统一一致

左图是官网的?#35745;?#21491;图是一个错误示范。显而易见，左图的展示性和可读性都比较强，视觉效果也比较好。右图之所以觉得不?#27599;?#26159;因为?#35745;?#22823;小不一致，?#35745;?#30340;背景颜色也不一致，所以看起来特别不协调。

好了，现在应该有人会想问，那京东或是天猫淘宝通过搜索后进去的页面里面的产品配图不是五颜六色的吗，那怎么看起来也没有觉得不协调。

这些界面的统一一致性体现在产品区块的大小尺寸上和整体的样式上，除了产品图不一样，其他的布局样式、区块大小都是一样的，这恰恰跟首页相反，首页各个区块大小不一致，所以采用?#35745;?#19968;致来协同，内页则是区块样式一致，?#35745;?#19981;一致。但不管哪一?#20013;?#35843;方法，界面?#35745;?#21040;了很好的协调性。

?#35745;?#39118;格上的统一主要体现在网页当中的?#35745;?#36873;择上，在写实风格的网页中就不适合卡通的?#35745;?#22312;清爽的界面当中，就不适合劲酷的?#35745;?/p>

2、色彩统一

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