History of the design grid II-设计
在「设计网格的历史」中,我们概括了文艺复兴起源及20世纪设计网格的发展,探索有700年历史的和谐比例原则是如何继续指导印刷设计的。在这篇文章最后,我们也会看到它们对网页的影响。
现在,让我们考察近代设计网格,并完善主题:20世纪艺术与设计对网格的公开提倡、随后而来的短暂抵制、以及现代最终在网页设计上微妙而不可动摇的地位。请阅读并思考我们立足于何处,寻找资源发挥网格的最大潜能。
20世纪的艺术与设计
当瑞士排版师在建立印刷设计中网格的中心地位时,世界纯艺术领域也发起了类似运动。
网格在荷兰风格派运动中最为明显,这个运动由艺术家凡·杜斯堡(Theo van Doesburg)和蒙德里安(Piet Mondrian)于1917年发起。基于对模块设计广泛理想化的潜力和对绝对简洁的信仰,他们在画布上只使用纵横交错的线条和未经调和的颜色。
一本风格派运动出版物(左)以及蒙德里安使用网格的画作2年后,在1919年,德国的包豪斯成立,他们崇尚形式追随功能,舍弃一切「不必要」及装饰的成分。这个哲学引导他们使用网格,正如著名的包豪斯国际象棋。这副棋的棋子均为圆和方,能紧密放置保证便携保存。
包豪斯出版物(左)以及包豪斯国际象棋同时,网格在平面设计中的地位越来越牢固。翻看Josef Muller Brockmann, Richard P. Lohse, Armin Hofmann 和Alberto Longhi等大师的著名招贴作品,你能看到它们都严格遵循网格(有时网格是倾斜的,这被唯一许可)
这些是 Armin Hofmann和Alberto Longhi做的海报1972年,Massimo Vignelli重设计的纽约地铁地图改变了站点的地理位置,基于网格制作了一张更易读的地图。
Massimo Vignelli重设计的纽约地铁地图为获得易读性改变了站点的绝对地理位置而到1960年代的波普艺术时代,网格地位大致到达顶峰。Andy Warhol、 Roy Lichtenstein、Chuck Close 和Gerhard Richter等艺术家把这个机械大生产的「粗俗」语言提升到艺术高度,网格成为核心。
Andy Warhol的Campbell汤罐头正以网格形式排布。 Chuck Close使用网格的肖像(左);Gerhard Richter 的色彩网格很快人们厌倦了网格,在1970到80年代左右,许多设计师尝试减少甚至完全放弃使用设计网格。但网页时代改变了这一切。
当代网页设计
数字技术曾有一个时期被认为能超越设计网格,但这没有持续很久。设计师逐渐发现网格是组织网页结构、在多设备间实现响应式的理想工具。
由于一格能重复使用,清晰的网格能组织良好的网页结构,易于浏览也为设计师规避麻烦。由于网页打开了印刷不能实现的新美学领域——比如可视颜色、材质和字体的多样性——相同的网格可以做出完全不同的视觉风格。
一般来说,互联网网格使用9、12或16栏,但正如下面的案例,当代设计师有时也会只用3栏。如果3栏足够,就无需多用。
Khoi Vinh设计的著名网页遵循了14栏网格;他在文章中记录了这一过程 times的网站又是一个著名的网格案例,它由一个细左边栏和5栏内容组成。 在Smashing Magazine的这篇文章中,Chris Brauckmuller 描述了他怎样使用三栏网格制作FloridaFlourish.com浏览网页,使用特例网格的网站也越来越多。查看这些精妙例子,你会发现有些网页使用了垂直网格,也有一些使用了更模块化的方案。
Pixelot.de完全使用网格,并使横纵线均可见 42Angels.com 基于5栏网格,但也使用一些不明显的马赛克背景完善视觉页面 TDHCreative.com,简单且美。 AraWines.com使用更复杂、更模块化的网格一些能帮你着手使用的资源:
Ultimate Guide To Grid-Based Web Design: Techniques and Tools
Grid-Based Web Design, Simplified