网页设计中的三分法则 - 黑马程序员技术交流社区

在没有注意到三分法则之前，你可能永远也发现不了这些实例，它是那么和谐的存在着，好像很久之前就的嵌入了我们的生活中，永恒的散发着规则之美。

一，二，三。好的，现在停止数数，思考一下如何将各种元素划分成三个部分来为你的项目服务。三分法则，这是一个很有趣的说法，同时也是一个跨学科的概念。

一般来说，将一个事情划分成三点来完成，可以使结果呈现显得更加的精雕细琢。比如在摄影和艺术创作中，三分法则可以帮助你，在面对不同尺寸的画布完成想象构图。即使是美国的独立宣言，也将权利划分成了三份：生命，自由和追求幸福的权利。你对这个神奇数字3有什么更多的想法吗？这个神奇的三分法则又该如何应用在项目上呢？我们有些建议给你。

3X3的网格把一帧图片划分成了九个相同的矩形格子。每个矩形相应的比例是1：1，这些假想格可用于处理每一帧，视频和图像的处理。网格已经变成了“更加主流的”照片处理工具，以iphone为例，拍摄的时候，屏幕就可以叠加网格，帮助用户更好的确定如何捕捉图像。

三分法则是一个简化的概念，它基于其他多种理论和实例的验证，并且赢得了令人难以置信的用户好感。

我们都知道，列表可以创建引人入胜，便于用户消化的内容。但你可能不知道的是，有三个点的列表是最理想的，只有两个分组的列表其实很少，而且不够。三个分组既增加了内容的重量，但又不会让用户有眼花缭乱的感觉。相较于其他规模的列表，包含三个分组的模式更令人难忘，且易于快速阅读。

一些举世闻名的演讲者和主持人在写演讲稿和手卡的时候，也经常使用三分法则的方式，来完成演讲重点的指引列表。顺着列表的提示，就能想出一种和谐的说服方式。

每个分组都应该是在相同长度和类似的范围之内的。指引列表可能包含的是几个同属性的词汇，也可能是同等级的句子。一致性的结构有助于推动三要素以和谐的方式连接。

“我想我们都到了一个非常特别的境界，无论是精神，物质还是语言” - 杰克·斯派洛《加勒比海盗》

“对此我说，'好吧，好吧，好吧。” - 马修·麦康纳，2014年奥斯卡颁奖典礼

从图像的编辑到导航的元素运用，三分法则可以提高网页在视觉上的吸引力，建立组织，提升整体用户流量。（看，我在这里做了什么）

同样这个概念也可以延伸上文提到的网格，比如水平的三个元素或者垂直的三张图片。下面的三个网站虽然在视觉呈现上各有不同，但是效果都很不错。

该网站屏幕的顶部被分成三个不同部分，但是图像的尺寸都是平等的。这些图像看起来很有趣，视觉上可以进行信息传达，同时，也作为导航元素来为用户服务。

本设计在几个地方运用了三分法则。顶部圆形边框下面的元素以三个为主。其次，主脚注部分具有三个信息列，下拉菜单包括三个主要部分，上部主图上的元件排布也明显的呈现三个部分，与下方三个信息列相对。

Coleman Smith采用了完全不同的手法表现了三分法则。你看到了吗？三分法则在三角形中的应用被嵌入到了设计中，这样你就可以快速的抓住三个焦点中的文字，这个形状的三个点同时也创造了设计中的一个焦点区域，突出了强调的重点，这个形状上的这些点使用户更直接的将注意力放到了图片的主要区域。

就像一出戏有三幕，将你的项目或内容分为三个部分。这样会使你的项目，尤其是那些有大量的内容的项目更容易被浏览和理解。

虽然有多种模式可供选择，但是如果仔细想一下，任何项目几乎都以同样的方式开始。凡事总有一个开头，中间和结尾，对不对？以这种流程建立项目，能使你的故事变得更有条理，并且使用户更易接受，成为你项目的一部分，从开始坚持到结束。

你可能还记得iPad 2发布时那句“更薄，更轻，更快”的广告词。这种三个词不仅简洁明了的向用户描述了产品特征，并且易记易传。许多电子产品的营销同样流行采用这种模式的文案。

在工作中同样可以使用这种方法。想想你的网站或移动应用，甚至你的职业生涯。该如何用三个词描述，从现在开始，当你谈论互联网应用或者你的事业的时候，你都可以只用三个词描述。

你也可以尽可能使用简洁明了的词汇，更自然的向你的客户描述你的品牌或者产品。三个词是刚好易记且概括全面。当然，如果你是语言高手的话，你还可以尝试更加吸引人的组合，使描述变得令人难忘。

现在，你对于三分法则大概有了一定的了解吧，准备好开始了吗？回头看看你的周围，你是否惊讶的发现身边的许多实例都围绕着这个准则呢。