浅谈页面设计中布局的视觉焦点 - 黑马程序员技术交流社区

为什么杂志和书籍的布局惊人地相似？即便设计的内容有所不同，各个设计的布局都是和谐有序的，否则阅读者的脑袋会陷入崩溃……要么他们就会不得不放弃当前的阅读，转向别的书页。无论在出版，广告，插画还是其他形式的平面设计中，吸引读者的目光，在页面中引导读者的视线都是成功设计的关键。

一些设计师认为布局无关紧要，因为当他们设计页面时自然知道去遵循从幼年就已熟悉的文化惯例。但很少人能理解这些惯例之后的意义。在多数文化中，人们都习惯从左向右阅读。听起来很简单对吧？如果从左至右阅读又会发生什么？基本上设计师面临的挑战是如何让读者以正确的顺序去浏览设计中的内容，或至少，如何让读者以设计师安排的顺序去浏览内容。

接下来，从页面的其他角画一条线，这些线会与之前所画的斜线相交。相交的那一点就是页面中最重要的视觉焦点。现在你可以做个实验，请找一张著名的绘画作品，按这个方法在上面画出线条。你会看到著名的艺术作品是如何利用这种布局技术的。

现在拿出一份杂志，做同样的实验。首先请考虑杂志页面的布局是如何设计的。这种布局方式是否合理？当你浏览页面的时候，视线是如何移动的？当你打量页面的时候，感到的是焦虑还是兴奋？现在再按上面的方式画出线条，看看视觉焦点落在何处？

如果最重要的内容没有出现在最明显的视觉焦点上，你很可能会感到焦虑。因为你的视线想尽力集中于页面上，但你的头脑已经感到混乱并想尽快离开页面。如果整个页面的布局很合理的话，当你的眼睛浏览页面时，你的头脑也会感到愉悦。

我的老师曾向我强调Z型布局的重要性。这是根据阅读者的阅读习惯来安排重要信息的一种布局策略。它假定读者的视线先从最左侧向最右侧移动，然后又回到最左侧。如此往复，直到页面底部。这是一个标准而简洁的布局模式。

20世纪50年代，栅格设计系统终于在前西德与瑞士得到完善。通过瑞士平面设计杂志的宣传，将瑞士苏黎士和巴塞尔两个城市的设计家从20世纪40年代探索的成果全面展示，并影响世界各国，因此也被称为“瑞士平面设计风格”（Swiss Design）。由于这种风格简单明确，传达功能准确，因而很快得到世界范围内的普遍认可，成为战后影响最大的一种平面设计风格，也是国际最流行的风格，因此又被称为“国际主义平面设计风格”（International Typographic Style）。

1965年，在美国的芝加哥成立了一家新的平面设计公司——尤尼马克设计公司（Unimark），主要设计人员包括有拉尔夫·依克斯特朗姆（Ralph Eckerstrom）、詹姆斯·佛格曼（James Fogleman）、马西莫·维格涅里（Massimo Vignelli，1934-）等。尤尼马克设计公司的设计思想基本是国际主义的：强调平面设计上的标准化，采用方格网络为设计依据，目的是良好的视觉传达功能。这家公司发展很快，不久就成为一家拥有402名工作人员、在全世界设有48个设计事务所的大型国际设计公司。国际主义平面设计在这家公司的业务中得到很大的成功，而企业的规模又使得这个风格在世界各地得到进一步推广。

如果你没有听说过 Josef Müller-Brockmann，现在你应该去了解一下他了。他对现在被称为瑞士设计学派，结构主义，绝对主义等设计为当代设计打开新天地的设计理念都做出了贡献。在与他同时代的设计师中，他或许是最容易被辨认出的一个。

栅格是处理字体和图像元素时首选的组织方式，栅格系统对色彩的意义也做出了限定。它的组织方式基本是由左至右，由上至下的。正如维基百科所说：“栅格的目的在于为设计师提供一个合理，便捷的方式来安排设计元素。”

Müller-Brockmann以及他同时代的人试图以设计夸张而简洁的海报来吸引顾客，促进销售。他们为音乐会及美术展览所设计海报最为人熟知。这些海报中普遍使用了抽象的几何图形。这些简洁，清晰而优雅的海报所传达出的信息很容易被使用不同语言的众所理解。

Ed Fella是另一个勇于在设计和布局方面打破规则的人，但他也十分注重研究眼睛，大脑与页面的互动关系。第一看看到他的作品，也许用户会把他当成一个疯子。他强调对比，但同样尊重栅格。他懂得如何利用栅格引导用户的实现，以创造出令人愉悦的，具有很高可读性的设计。他的设计中混乱与有序并存，就像一对连体人一样。

Fella称自己的作品为风格独特的“摆烂” 。他的作品粗粝而迷人，拥有力量和原创性。凭借他对布局，字体，设计和理论的深刻了解，他创造了非常，非常杰出的设计作品。他下面的这段话值得每个设计师读一读。他说：

“我对平面艺术非常感兴趣。这种艺术的特点是富于实践性，我们将图表，插图，文本以及其他东西加以组合，得到了了一种属于20世纪的艺术形式。我是一个插画家，而你可以从我创建的这个世界中看到无限种风格。过去三十年我一直在绘画，绘画已经成为我生活的一部分。这不仅是我的专长，是的生活职责所在。过去，我不顾一切地投入其中，但现在我却觉得很难突破自己。我只是在凭借以往的经验和技术在做东西而已。犹如一台低效运转的机器。但我依然热爱所有这一切，如此美丽，如此细腻的一切。”

通常客户们都知道自己想要什么东西——当然，在他们见到这样东西的情况下。在做自由设计师的时候，向客户展示你要想要创造的东西是个很好的策略。许多我认识的设计师将这成为“红苹果综合征”。意思是当客户需要一幅红苹果的图画时，他们会从数以千计的红苹果图案中寻找，直至找到他们最需要的那一副，然后才会雇用这幅画的作者。你画的是一幅黄苹果或绿苹果的画？太糟了！我需要的是一张红苹果的图画。
这听起来很愚蠢，但很多有创意的人士都知道这是真的。“你能设计一个金融站点吗？你给我看的只是非金融站点的示例！”虽然这么说，但普通人并不理解设计的艺术，因此你同样可以将自己设想的设计展示给他们。
Paul Rand是一个著名的设计师。在他年轻的时候，他从一家规模很小但十分知名的出版社那里接到了一个设计任务。虽然“绝不做免费的工作”对设计师而言通常是最佳建议，但有时也会有例外。Paul Rand的接受了这个任务，但条件是给他完全的创作自由。当有人想让你义务为他们工作时，他们并没有太多选择余地，对吧？

事实证明Rand押对了赌注。他为Direction做的设计方案成功地抓住了目标人群的目光。一个成功会引向另一个成功。这之后他为Apparel Arts杂志的周年纪念特刊设计了版式，后来他又接受了担任Esquire-Coronet杂志艺术总监的邀请。最开始他对这一邀请是拒绝的，他声称自己还不够资历担当这一重任。但一年之后，他还是决定接受这一职位，以二十三岁的年纪承担起了为Esquire杂志的时尚页面设计版式的责任。

不幸的是，设计师的主管们常常是一些不懂设计沿革，随意打破规则，没有餐桌礼仪，只是打扮得衣冠楚楚的人士。面对“集体设计”的作品或一个偏爱1885年的杂志的老板，设计师的处境是十分尴尬的。

我曾以艺术总监的身份为一家知名杂志工作，我的顶头上司是一个爱把自己幻想成设计师的男人。他认为杂志的设计有必要调整。他是严格的网格系统的坚定倡导者，根据他定下的新规矩，版面中只能使用正方形和长方形（他曾亲口说“正方形和长方形美味可口，而圆形和椭圆形则令人倒尽胃口”）。他还坚持让我们使用一种“具有现代感的字体”，比如Helvetica——只是Helvetica——并将这种字体应用于所有的标题和正文中。为了让我们更明白他是老板，而我们只是随时可以被炒鱿鱼的打工仔，他每周都要召开“设计会议” ，还坚持让我们拿出我们所认为的“新潮，优秀的”设计案例。

很自然地，作为职业设计师的我们搜罗了所有能找到的嘻哈杂志的页面，因为这些是他最不愿看到的东西。他冲我们叫嚷训斥的样子真是值得一看。他始终认为我们虽然“看起来像电视明星”，但想象力还停在1943年的《周六晚报》的水平。这种情况持续了三个月后，他终于不再坚持了。而是转而把精力放在“提高”编辑们的写作水准上。这样，我们总算避免了一场自杀式的灾难。

但在多数情况下，事情都不会这么顺利。对设计师们而言，在设计上走的太远，以及设计方案被拒绝的恐惧是检验经验丰富的设计师与一般的设计师的分水岭。我们无需为自己无力创新设计而感到特别羞愧——外部因素给我们的压力已经够大了！

一个富有智慧的设计师有一次对我说，在他和我所在的公司中，永不可能产生较大的设计创新。他认为在这种情况下，设计上的创新只能以日常工作为基础，每天向前推进一点。我想他是对的。通过自己的设计方案中小小的创新，你周围的人也会受到鼓舞，他们会感到自己也是这种创新的一部分。

当然，这需要你做些研究——例如向人们展示一些具有说服力的细节，使用本文开头部分提到的广受欢迎的方法。使用更具体的方式向人们展示时，人们对你安排内容的理念也会更为理解。展现出你对最终产品的关心，鼓励团队成员自由表达他们的观点，并思考如何将这些创意融入设计中。这样一来，你将获得更多说服决策者和客户的依据。有时候，透彻地理解别人的规则，恰恰有助于你超越这些规则。