设计一个好版式的诀窍

为什么书和杂志通常会统一版式？即便是视觉设计调整替换，在版式布局上也追求一致和谐，视觉舒适，不然读者会感到混乱，直接不看了或者跳到下一页。在出版物，网页设计，插画以及其他跟这些有联系的元素中，成功的设计取决于画面的绘制以及视觉引导。

也许有些人觉得这不是什么大问题！因为我们是学习文化课程长大，从小看设计相对较少，否则就能了解它到底有什么规律。在大多数文化环境下，我们习惯从左到右阅读。所以貌似视觉引导听起来不难。只需要在从左边开始并且让视线落在那个地方即可。其实在视觉设计中最大的挑战是引导读者按正确顺序阅读，至少要是你希望他们看到的顺序，这是版式设计最具有挑战性的地方。

规则

我基本上没有按规则走，但是吧，老师和牛逼的艺术家们说的这几句让人印象深刻。

在你打破常规之前，你必须先知道规则

你必须了解现实的世界后才能创造属于你的世界。

如果你去研究那些规则突破者，会发现他们都是从现实的，基础的学起并在这些基础上演变发展。规则是对版式，类型，颜色，插画以及摄影的基本理解，以及涉及到眼睛如何注意他们，当他们放在一起的时候大脑会怎么解读它们。

被很多大师应用在设计布局中的是“z”模式。它是（西方文化）重要信息阅读的战略布局：从左上角开始，向右然后向下，最后再回到左边。从上到下布局。标准而又简单。

当我在网上发现1950年的版式设计规则时忍不住笑了。这些规则是合理的，而且依旧是在讲设计基础。

• 当你想要设置框架或者是提请注意信息时，可以使用边框把它们框起来（例如
  目录，日历，特殊说明）
• 文本列和插图可以创建模糊的边框效果
• 通过边框加阴影来让人注意到边框或图像
• 通过比例（尺寸），颜色，画面位置的对比引导读者注意到一些重要的元素。确保这些东西对内容呈现的辅助作用
• 通过加大，加粗或者图形元素来创建画面焦点。使用具有视觉重感，视觉强度或有颜色的元素进行对焦
• 通过网格去组织画面元素。确保网格的灵活度,但是网格节不能过小。为了获得最大的灵活度，将画面划分为四到五列最佳。
• 多列组织文本，在视觉上切分成更小的信息块更易于阅读
• 在一个标准的页面上将文本划分成均等的两到三列，阅读体验最佳
• 引用或者是编辑其他类型的支持内容，可以使用单个较宽行高短的列来排版

所以说，这些简单的规则依旧沿用到今天甚至还会继续沿用到未来。 但伴随着消费者文化的发展以及这些年在设计上很多牛逼的规则突破者的创新，规则在不断的演进发展。设计的一个演变是网格系统。据维基百科显示

第二次世界大战后，一些平面设计师，包括ax Bill，Emil Ruder等，受到了an Tschichold的现代主义思想的影响，开始质疑传统页面的相关性布局。他们开始设计一个灵活的系统，能够帮助设计师在组织页面时实现一致性。也因此现代排版网格与印刷开始关联起来

最酷的秘诀

之前，插画老师给我们看了一个方便识别画面焦点的工具。首先，从左上角到右下角画出一条对角线，页面可以是水平或者是垂直的。他对任何方向都是合适的。

接下来，从其他两个角各画一条直线垂直连接刚画好的水平线。线连接的点就是注意力的焦点即最大注意区域。可以做个试验。找一副著名的画作，然后在上面画上这些线（当然不是在博物馆里，否则你会被抓起来啊哈哈哈。）你会看到画家们是如何用这种布局创作了伟大的艺术

现在，你可以拿一本杂志或者一个网页做相同的尝试。首先。想想这个页面是怎么设计的。它看起来舒不舒服。当你盯着页面看的时候，你的眼睛的注意力先后顺序。你会因为看到这个页面而感到焦躁或者兴奋么？好了，现在你可以画一条线然后看看页面是怎么布局的。

如果没有任何重要的元素落在线相交的区域，你会感到焦虑，因为你的眼睛努力的看画面但是你的脑子里却一片混乱，因为版式的布局是逆向的，违背一般视觉规则。如果布局得好，你会感到兴奋，因为你的注意力被引导到所要表达展示的页面元素上。

当涉及到处理客户调整设计方案的需求时，使用这种布局方式去做示范。当你使用这种布局，他们更容易理解元素的放置。量化他们不想破坏的规则，使他们关注最终产品，让团队对他们的想法感到兴奋。因此把这个秘籍融入到设计中，你会发现在应对客户设计需求时，你有更多的余地。

所以说，有时候可以这样玩，坚持别人的规则，允许你打破他们不知道或者看不到的规则。

编译原文：http://www.webdesignerdepot.com/2013/06/the-trick-to-designing-a-great-layout/