金牌译作 栅格(2):一以贯之

723个读者 翻译: snlchina  07/21/2008 原文 引用 双语对照及眉批

简介

用栅格来统一一系列的独立文档.

用栅格将页面元素统一成一个整体

by: Jacci Howard Bear
from: http://desktoppub.about.com/od/grids/l/aa_gridsunity.htm

人往往喜欢有条理的视觉信息

简报、杂志、宣传册、年报、以及书籍等通常包含诸多视觉元素:分栏文本、大标题、照片、插图、引文等等。栅格会帮助设计师在文档中建立页面之间的一致性。
读者会期待页码出现在每一页上的相同位置。一篇文章中的全部文字,即便它覆盖于多个页面,也一样有一致的外观,例如说相同的栏宽,这样可以提升可读性。同样的,读者还往往会期待边栏,说明性的文字,以及其他重复出现的元素出现在页面上的相同位置。

在一个多页文档的全部页面中使用一致的栅格,让设计师更易于提供读者们通常会期待的一致性外观。一个精心设置的栅格系统同样可以引入变化,而不会牺牲可读性和一致性。它同样会加快排版的进程,因为在放置各页面元素的时候,你不必再小心翼翼的“试探”以及“回头看看前面是怎样做的”。

下面的页面范例,显示了如何在一个7列的垂直栅格中进行一份新闻简报的图文混排。注意图一和图二有着一致的版式(但是左右反转了)。文本栏占两个单元格宽度。一个单元格有更多的栏空,用于把正文和边栏分隔开来。页3(图二中的右页)的版式和前面两页好像没多少共同点,但假如你看看隐藏在页面背后的栅格系统(图三),你会看到这三页采用的都是同一个栅格系统。

single page of a 7-unit grid 
图 1: 左边是7单元栅格的简报

2 page spread of a 7-unit grid
图二:7单元栅格的对开页简报

spread showing 7-unit grid
图三: 隐藏于这两个对开页简报之下的7单元栅格

用栅格来统一一系列的独立文档
我们可以有多种方法来为一系列相关文档建立统一的视觉形象。你可能会在全部营销资料上都打上你的标志,或是采用不同颜色的宣传册来标明不同的业务方向。同样的,你也可以使用栅格来统一你的宣传册、销售表格、展示广告、规格表、以及你“营销军火库”中的其他各种元素。

就像我在 本系列文章的第一节 中说过的,“在一系列独立而有关联的印刷品(如系列海报,或是为某个广告活动或某产品线设计的一系列传单)中,一个共同的栅格有助于统一这一系列独立印刷品的整体形象。”栅格会帮助你在不同印刷品的相同位置放置重复的元素,同时有助于为图文混排提供一个统一一致的向导。

在图4中,各宣传页中的标题都使用相同的样式,但图片的数量和尺寸却各不相同。图5所示的3单元的栅格帮助统一了这几个单页。这是一个简单明了的范例。

3 info sheets with a common grid 
图 4: 3个宣传册页使用一个共同的3单元的栅格

3 unit grid 
图 5: 一个3单元的栅格帮助统一了这一系列包含不同元素的宣传页

一个网格,多种设计
人们常常指责栅格是那些乏味、僵硬的设计的罪魁祸首。其实这并非栅格的错。正确的使用栅格,将会为设计带来创造性的变化。图6显示了同样四幅图片和不同数量的文字在同样一个4x4 的栅格系统中形成的4种截然不同的版式效果。

a variety of layouts with a 4x4 grid 
图 6: 同一个“乏味的”栅格创造出来的几个不同版式

 

前一篇 栅格(1):从混乱到秩序, part 1 of 3 

下一篇 栅格(3): 灵活应变, part 3 of 3

继续阅读
  • 被否决的Google Logo

    优胜劣汰,Google Logo也不例外。幸福的Logo是一样的,不幸的Logo各有各的不幸······

  • 13个在线web2.0风格生成器

    貌似这篇post根本就不值得翻译,却耗了我很长时间 作为第一篇,这就当是我的hello world了 感谢译言,让我找到了学习e文的动力之所在 现在,只要看一些web2.0应用的目录,你就会发现,无论...

  • 如何提高页面响应速度

            访问速度缓慢的互联网已经成为过去,但页面能瞬时呈现也只是未来才会发生的事情. Christianheilmann的一些技巧,现在就可以令你的网站访问起来更为流畅。         页...

  • 标海观潮(完整)--2007标志设计趋势

         在LogoLounge.com这个近水楼台,自然有机会领略标海里的各种潮流涌动,弄潮儿挥舞着唯美、概念、文化的旗帜立于潮头。而作为互联网上最大的标志库(超过5万的标志),我们也总是会注意到...

  • 美国设计师:关于中国设计的10大荒诞说法和事实

    一个在美国12年的中国设计师眼中的今日中国设计业.

  • 十大网站设计错误

      自1996年以来,我曾经指出了很多网站中的设计错误,参见底部我的系列文章列表,本文将重点介绍的是,这些问题当中十个最为严重的网站设计错误。   1、搜索引擎不友好   搜索引擎对于难以处理和识别...

  • 字体圆滑术、锯齿消除术与亚像素显示技术

    苹果和微软就如何在电脑屏幕上显示字体的问题一直意见相左。今时今日,两家公司都通过使用亚像素显示技术令字体在日常的低分辨率屏幕上显得更清晰。它们的区别则是理念上的。 -苹果基本上认为,算法应该尽量保留...

  • 14个超酷的名片设计

    看腻了千篇一律的名片设计?文中这些名片也许会让你眼前一亮。

相关小组

标签:

内容有问题?请与我们联络。

译作评分

  • Currently 0.00/5
  • 1
  • 2
  • 3
  • 4
  • 5
 0.0  |  0 个评分

0条评论    0眉批

添加评论

欢迎访问译言网。在这里,您可以。。。

阅读
发现
翻译