网页设计那些事儿
上QQ阅读APP看书,第一时间看更新

第2章 网络改变了设计

我家的第一台电脑是在1997年7月6日购买的。那是拨号上网的年代:听着我家那只33.6kbit/s的“猫”(调制解调器)发出一长串尖锐刺耳的噪声后,我打开浏览器输入网址,等待了几分钟后,终于跳出了上海热线的网页——这就是我第一次触网的经历。那时,我并未想到互联网会渗透到我们生活的方方面面,更不会想到我自己将来会成为一名依附于网络的从业者。

随着技术的发展,宽带的普及,网络的即时性、交互性、便捷性逐渐赢得了人们的认可——网络成了生活工作中不可缺少的一部分。网络推广与销售的低成本高性价比也使得不少企业厂商开始将眼光逐步投向网络平台——在这样的大背景下,网页设计获得了快速发展的最佳时机。

作为UI设计中应用最广泛的设计种类,网页设计在近十年间高速发展,从业队伍迅速扩张,成为了设计行业的新贵。作为一个新兴的设计门类,网页设计有着与很多传统设计不同的地方,设计师也面临着新的挑战。在本章,我们就来讨论网络对设计的改变,以及设计师该如何应对这样的变化。

2.1 阅读感:网页设计的源点

引子

网页,几乎是伴随着互联网发展一路走来的。二十多年来,网页设计经历了从稚嫩单一到如今丰富多彩的发展过程。

二十几年过去了,网页设计发生了翻天覆地的变化,很多规则建立了起来,很多规则又被打破了。互联网发展速度飞快,一不注意我们就会跟不上节奏。面对那些我们看不清的变化该怎么办?回到源点,寻找答案。

源点是什么?是事物最初的模样。也许随着发展,很多东西不再是最初的模样。但是你会发现,抛去那些不好的、丑陋的、不合理的东西,最初的源点最核心的东西依然会在发展中以各种方式留存下来,成为事物发展的基本原则。

正文

网页设计发展二十多年,很多东西已经变得面目全非,但总有些东西,无论怎样始终不会改变——这些东西是网页设计最本源的东西,也是作为一个网页设计师必须为之坚持的东西。

网页设计最初脱胎于平面设计,尤其是传统平面设计中的的排版设计。

最初的网页,对于设计的要求并不高,人们更关注于网站的排版。那个阶段,受技术和带宽限制,网页最大的需求是对于文字和图片的信息传达,这与平面设计中的排版是相通的。那个时代,往往被人们称呼为Web1.0。

因为刚刚起步,所以网页设计应用范围的还非常小,所以那时的网页,基本上强调阅读而轻美术,有一股浓浓的代码味。

渐渐地,随着技术的发展、宽带的普及,网站需要传达的内容越来越多:文字、图片、动画、视频……单一的豆腐块排版布局已经无法满足这些信息的有效传递了。再加上竞争逐步加剧,没有好的美术、好的设计,就无法从众多千篇一律的网站中脱颖而出。于是,需求方对专业的网页设计开始产生了需求。

这个阶段的网站,对于网站的体验开始提出要求,并且有了“设计一个和别人不一样的网站”的需求。但是无论怎么变化,网页设计首先要遵循的原则始终是网页的阅读感。

阅读感,就是信息有层次有目的地传达,使人产生愉悦的阅读体验,这是网页设计需要实现的最基本的目标,也是所有用户体验的基础。网页,归根到底是信息和功能的载体。当一个用户第一眼看到网页的时候,势必会习惯性地去寻找自己感兴趣的信息;如果这个信息很“恰当”的放在他习惯看到的位置,那就会让用户觉得这个网站“很友好”。当然,很多用户不会知道,这样的布局,都是设计师有意识布局下的产物。

最初的时候,看到“门户网站”几个字的时候,我总是会想到“门字型布局”,这种布局最早脱胎于新浪、搜狐之类的门户网站。中国最早一批网民浏览网页的习惯,至今仍带有新浪、搜狐调教出来的影子。所以最初的用户体验,就是这些网站制定出来的规则。这些规则虽然很多东西后来都被打破了,但还是影响到了之后网站页面布局的大方向——虽然很多地方并不合理,不一定符合逻辑,但要改变用户习惯的成本往往是非常之高的。

在这个大方向下,就是设计师可以施展的空间了。当面对Layout的大体布局规划的时候,首先要考虑的问题是:哪些信息是需要强调的,是需要平衡的,是需要削弱其存在的。于是,第一个问题来了:阅读感是我们需要遵守的原则,但到底是要从用户体验入手,还是从需求方的需求入手呢?

用户阅读习惯在设计师手中是可以使用的规则,设计师可以利用规则让某些东西强化,而让某些东西弱化。用户的感受,自然是需要考虑到的,但是设计是“使用方法解决需求方在视觉方面的问题”;从这一点来看,设计师就不可能不顾及需求方对于视觉传达方面的需求。

下图是我们公司游戏网站的一个前置首页,这个前置到达页的功能定位是引导用户从注册到下载到进入游戏的过程,并且在一定程度上起到广告到达页的作用。从页面上来看,页面的主体非常清晰,4个步骤的转化引导,游戏特色、游戏视频一个都不少,但是设计师在设计的时候有一些疑问:为什么将“进入官网”这么一个非常重要的按钮做的如此之小?

从用户阅读习惯来看这不科学,但从作为需求方的我们的角度而言,自然是有这样的需求的。

前置首页的定位是完成“引导新用户完成注册到进入游戏的整个过程”,并且有一定的广告到达页的作用。游戏用户大部分都是“偶然性用户”——在一个偶然的情况下进入网站,也许是点了广告,也许只是在百度里随便搜索了个游戏。如果这个游戏是他喜欢的类型,这时候他才会产生对于游戏的“忠诚度”,在此之前,用户随时都有可能流失。用户注册账号到进入游戏,每一个过程都是会产生流失率的,并且点开一个页面,访问的层深越深,进入游戏的“冲动”就越小——这和游戏本身品质无关,只是用户心理使然。

所以在前置首页,我们需要做的是尽量降低用户进入其他页面的可能性,在这一页完成所有的步骤,这样对于我们而言,转化率能够得到最大程度的保障。在这种思想的指导下,虽然用户有强烈阅读的需求,但“进入官网”依然必须是一个需要弱化的元素。

作为一个成熟的网页设计师,你需要了解用户的真实体验,也许要摸透需求方通过页面需要达成的目标。在设计之前,设计师必须与用户沟通,哪些东西对他而言是非常重要的东西,而哪些东西又是他不太愿意主动传达给用户的——毕竟,使用方法解决需求方的问题才是设计最本来的用处。

当然,我们在实际工作中会遇到大量传递信息的情况,再加上需要解决“设计一个和别人不一样的网站”这样的问题。这种情况下,很容易顾此失彼,无法平衡网站的阅读感。经常发生的问题是:页面布局杂乱,细节太多太碎,影响阅读的流畅。

这种问题,往往是对于网页设计的阅读感没有一个整体认识所导致的。成功学有一个很出名的理论—— “细节决定成败”。这句话在设计角度应该理解为“在不影响整体的前提下,恰当的使用细节,决定了设计的成败”。

设计是一个整体,所以设计细节需要依附于整体的需求。网页的情绪传达需要有气氛带入,气氛需要细节去堆砌营造。但是无论如何,再漂亮的细节,如果整体上影响到了网页的阅读感,那就必须毫不犹豫地舍弃或者削弱——在这点上,设计与绘画有很多共通点。

无脑流一块一块的去“拼凑”页面,很多设计师有这样的习惯,尤其是不少门户网站的设计师,但这并不是一个特别好的习惯。我们往往拼着拼着就会发现:整个网站要么就是东一块西一块的,感觉乱七八糟;要么就是阅读层次趋于扁平,没有阅读层次的引导。这种情况下,我们即使想修改,往往也抓不住修改的主要方向,最终越改越乱,最后只能重做。

如果一开始就有明确的方向:用配色确定整体基调(情绪传达),确定设计风格(代入感),进而明确如何在这些基调风格的基础上,使用怎样的方法,使得页面有良好的阅读感,用整体思考页面的方法去设计往往会省去很多后期反复调整的时间。就和素描一样,大形和比例准确了,就会节省很多因调整形体而浪费的时间。

说到素描,就不得不说一个画素描时通常会犯的问题——迷恋“抠细节”,这个问题在网页设计上也同样存在。不少设计师都有美术基础,都会对于自己花费心思而做出的“漂亮”细节非常迷恋,但如果这种迷恋不加收敛,就会成为设计师的“心病”。当这样的细节影响到整体的时候,往往会舍不得舍弃掉——毕竟花费了这么多心思,谁都不愿意就这么放弃了。但不放弃,只会让设计举步维艰。

避免这种问题,就必须随时从整体的角度来审视自己的设计,避免对于无效细节的深入刻画。在绘画的时候,很多人有这样的习惯,画一段时间,站起身离开远一点看自己的画或者眯起眼睛看自己的画,使用这样的方法,我们很容易看出整体的效果——哪些“跳” 出来了,需要无情削弱;哪些东西本该出来而没有出来,需要着力强调。

眯起眼睛看,这种方法在网页设计中是可以借鉴的。在设计过程中,我们需要不断地眯起眼睛,在模糊的世界里看一下,那些在自己设计意图里需要强调的东西是否获得了足够的强调,是否有其他因素干扰了这些需要强调的元素。

眯起眼看设计并不是网页设计必须去做的一道工序,但的确是网页设计师在设计过程中的一个好习惯。反复这样去调整细节与整体的关系,才能保证你的设计细节恰当到位,且在整体可控的范围之内。模糊的环境下,更容易看清整体的感觉。所以,网页设计师不仅需要“像素眼”,更需要有“模糊眼”。

对于设计师而言,整体而完善的阅读感,自然是非常重要的,但是这个“整体”并不仅仅是设计的整体性。网页设计最终还是要制作成网页让用户浏览的,所以在设计过程中,我们不得不考虑用户的实际阅读感受。网页设计与传统平面设计最主要的差异在于载体的差异,显示器和浏览器的局限使得在浏览网页时会呈现出一种“截取”的状态,这就对网页设计师提出了比平面排版设计更高的要求。显示器、鼠标这些电脑设备,对于用户浏览网页的习惯起着非常微妙却至关重要的影响,在下一小节里,我们就来探讨一下,这些电脑设备,是怎样影响网页设计的。