信息建筑学 ——网站蓝图设计

网站设计的方法学


前言

在新旧世纪交错的这一两年中，我有幸能参与多个互联网站点的设计，并在其中担当主要角色（这些站点有的是大到每日更新数百条信息的新闻站点，也有包容几万种货品目录的商务类站点，也包括一些成本投入很低的非盈利性站点）。我总是试图在努力工作的同时，对着手的项目进行冷静的观察和分析，从中获得不少有益的经验与启示，撰写本文的目的就是为了和国内的网站设计者来共同分享有关的成果，以促进中文站点质量的提高。
在两年前迈出了跨越个人主页制作者到专业站点设计人员的第一步后，我首先感到的就是网站设计理论与设计方法的严重匮乏。比较国内外站点的质量，那种天壤之别的感觉使我常常陷于痛苦。然而，在纯粹技术应用方面两者似乎并无太大的差距，诸如在HTML，javascript, Java Applet, CGI, ASP, PHP等程序语言上，我们的程序员一般也能够全面掌握，而且相关的参考和代码样例也容易通过各种媒介获得。况且，相当多的优秀的国外站点在技术上并没有采用什么顶尖手法，但究竟为什么国外优秀的站点能够带给浏览者带来十分愉快的体验并吸引他们成为长期而固定的用户呢。我们首先会意识到，丰富而独特信息是致胜的关键。的确，对比国内外站点，在提供信息与服务的深度和广度以及手段上，国内显然还处于相对幼稚的阶段。不过，近两年来，随着互联网产业在国内的兴起，就网上提供信息的数量而言，我们已经度过97年以前网上中文信息极度匮乏的阶段，但从提供信息服务的质量而言，似乎依旧乏善可陈。信息原材料的准备与挖掘是文化教育机构乃至全社会的责任，而对业已获得的信息原材料提供一个恰当而有效的网络表现形式与方法，才是站点设计师的责任，同时也是本文探讨的重要主题。因为给予信息恰当的表现形式会直接影响到利用信息的有效性，表现形式或处理手段在某种程度上决定了信息的质量。本文一方面探讨评判这种信息表现形式优劣的标准，另一方面给出最终实现优秀的信息表现形式的方法。
信息建筑学，Information Architecture。看似一个艰深的专业术语，其实表达了一个十分清晰而简单的概念。即，我们在设计信息系统时也应从某种建筑设计方法的角度，以系统的用户为中心，考虑他们的实际情况，考虑他们使用这个信息系统目的和习惯，满足他们“使用”的需求，并在此基础上进行美学意义上的改善，把系统营造成用户从中获取信息，处理信息的舒适而优雅的桌面环境。
WEB就是一种面向广泛用户的信息系统，借鉴建筑设计的思想方法，的确有助于改善和提高我们的设计水平。在美国，Information Architecture的提出已经有了相当长的历史，以往它较多地被应用于大型资料系统，电子图书等领域，而近几年该方法在互联网站点设计方面获得成功使用后被变得更加热门起来。Yahoo, Google等搜索引擎上都有其相应的目录，可以查找到丰富的参考资料。这也是我得以完成此项工作的重要信息来源，不过，本文将更多地从中文用户和中文环境的角度出发来阐述国外的经验，并更多地结合国内站点的实例来探讨问题。

本文以三大部分来向大家介绍相关的设计理论、方法及实践经验。第一部分：设计哲学与理念。本章着重探讨基本的设计理念，强调用户导向型设计的重要性以及因特网站点传播特点和确立恰当的设计目标，在开展工作前首先树立最基本的设计的评判准则。第二部分：全面理解信息建筑学。本章着重探讨适应于不同用户的对信息进行恰当的分类组织，标题索引，检索机制等的理论和方法，以及如何恰当区分不同媒体类型的信息，有效地将多种形式信息整合为一体，并阐述将信息建筑设计反映到可见到页面布局的方法。第三部分：团队合作与管理。本章着重探讨设计者与设计者之间的合作（这里的设计者指包括商业模式设计的策划人，项目管理人，设计师，平面设计师，软件系统设计师，程序员，等所有参与站点建设的人）。虽然同信息建筑学没有直接的联系，但如果要实际进行设计与开发，团队管理又是必不可少的成功要素。所以在此部分中介绍利用软件工程思想的阶段式项目开发与管理的方法学，并提供了部分文档模板的样例。
虽然，本文探讨的问题几乎涉及站点建设的方方面面，但为了突出设计方法学这一重点，同时也为了避免混淆本文的初衷，列举不在文章讨论范围之内的问题如下：

站点的市场定位与经营目标
站点商业价值的实现
网站获得各种信息的途径和手段

有关图片处理的技巧
有关HTML的技巧
DHTML的动态效果的设计
ASP,PHP,JSP等动态网页语言的编程和功能实现

1 设计哲学与理念

“Hakuna Matata”， 一个新东方红宝书都不会收录的古怪单词。
它来自电影《狮子王》的小插曲，还记得这第一部引进的动画大片吗？“Hakuna Matata”——古老非洲的神秘咒语，是小猫鼬丁满和野猪彭彭帮助小狮子辛巴在非洲丛林长大的无忧哲学：“It means no worries, For the rest of your days, It\\'s our problem-free philosophy。”
哲学（Philosophy）就是如此神奇。说不明，道不白，但它的确深深贯穿着我们整个学习、工作与生活，提供了评判对错的基本准则和处世行为的根本态度。当然，站点设计——一种非常复杂的团体式创造就更需要相互间有共通的价值理念来统一各自基于不同专业领域的创新。网站建设是一项系统性工程，从构思到设计再到实施，我们要把持的宗旨是什么，何以评判成功或失败，站点设计师的工作重点该放在哪里，他们的工作对站点的商业计划影响有多大？这些问题在很大程度上决定了设计是否能成功。
所以，我们要首先明确这些最基本的设计出发点和考量因素，树立起站点设计的根本价值观——设计思想，同时这些观念将渗透在具体设计方法的讲解中。
但愿，这里的抽象说教也能如“Hakuna Matata”一样，给跨入专业站点设计领域并正准备大展拳脚的辛巴们带走所有的困扰，Problem-Free。


1.1 “你喜欢麦当劳的什么？”——形式决定内容


[一长麦当劳小丑形象的图片] 左边这张图使你联想到什么，麦香鱼汉堡，还是冰激凌奶昔?麦当劳快餐一定给你留下过深刻印象吧。
自从麦当劳1992年进入中国以来，随着McDonald’s分店在北京，上海，广州街头的一个个开张，小丑Ronald变得人见人爱起来。曾几何时，面包夹牛肉的洋汉堡居然也变成了国人的流行美味。
然而，当我们问起在麦当劳尽情享受的食客们“你喜欢麦当劳的什么？”会得到那些答案呢？小学生说的是香脆薯条，女孩子的回答是爽滑的甜筒，而她的男友则对麦辣鸡翅情有独钟……
糟糕，我可不是要作美食调研，本来想问的是：麦当劳究竟提供了什么，使得你们愿意经常光顾，并以高于街角其他小吃店数倍的价格水准在这里消费，却还乐此不疲？
原来是起初的提问不明确。调整问法，终于得到了“满意”的答案。促使他们选择麦当劳的决不仅仅是吃到嘴里汉堡，而附加在食品上一起出售的服务才是致胜关键：橱窗式的通透外墙，店堂里的轻松乐曲，服务员小姐的热情微笑，格调明快的室内设计，色彩统一的可口可乐纸杯，甚至是带给我“更多选择，更多欢笑”的电视广告。甚至不要孤立地看待它们，每一项体贴入微的服务都不是拍脑袋的发明，背后有着大量的调研和数据作支持，并被市场营销专家精心地结合成统一整体。正是这些形而上的东西才是麦当劳快餐革命的实质。
麦当劳的综合服务在我看来就是一种形式，它不会影响到食品的营养价值，但这种服务手段，服务形式的系统性创新在影响人们作出价值判断时发挥了关键作用，使得食物本身已经变得不那么重要了。
那个引起混淆的问题其实另有企图：请对自以为驾轻就熟的语言多留一分小心。语义的细微差别会严重影响思维，简单的问题是很容易引起误导，即便是自问自答。当我们在考察站点优劣的时候常常会问自己：“这个站点好在什么地方，人们喜欢它的什么？”顺其自然地跟随这样的思维过程，我们的答案就是：新闻条目很多，内容很详尽；商品目录齐全；有不少精致的图片；活动按钮很有意思；字体色彩的搭配巧妙……
天哪，我们忽略了隐藏在所见页面背后的东西！就像是在麦当劳快餐店里仅仅评判吃到嘴里的美味一样。
“看不见”的问题实际上更需要被关注：用户能在第一次浏览中就体会到站点的特色吗？他能很快掌握检索功能的使用吗？栏目与板块之间是否有重合与混淆？获得用户所关心的资料花费了他多少时间和精力？改进的功能在满足新用户的同时是否足够尊重老用户的习惯？浏览者在点击一个链接前能猜出所得到的反馈吗？……一句话，用户在你的站点上冲浪是否会有舒适感？
1998年，《哈佛商业评论》上发表的《体验式经济时代的来临》阐述了这种网络经济的特殊道理：不是在获得的最终信息或物品本身，而是整个对互动过程的体验起主导作用。
形式上的东西正日益成为决定性因素。
对形式的决定论不已为然？你会反驳道：互联网本身已经是信息传播方式的根本革命，建立在这一重大形式突破上的小打小闹（形式上的形式改良）不会大有作为。真的是这样吗？听起来好像很有道理。不过，我要说，“形式的形式”同样重要。
报纸的出现，是信息传播方式的重大变革。但如果报纸在版面形式不突破书本的限制，恐怕今天到你手里的只是一天一份的新闻小册子，这还称其为报纸吗？在报社中，排版一直是编辑相当重头的工作，《文汇报》的版面布局就曾经是为人称道的一大特色。
电视的出现，也是信息传播方式的革命。但你能想象将1935年BBC首次进行电视试播时的现场“直播”方式延续到今天吗？片断剪辑与后期制作在现代电视工业中直接影响着节目的生存空间。美国广播公司（ABC）的纪录片通常保证每5秒就有一次镜头切换以提高观众对节目的注意力。
事物的发展就是这样，逐渐附加上去的形式与其本身逐渐在历史性演化过程中融为一体，并会彻底改变人们心目中最初对它的认识。
之所以我要强调这种形式的重要性，是为了告诉网站的设计师和经营者，站点设计的贡献将随着时间的推移变得越来越巨大。尤其对于尚处于幼稚阶段的国内网站，在形式上的突破和创新还有很大空间。然而在现实中，设计师的作用常常被低估，在前些时候那种仅仅依靠一个概念就可以获得国外风险投资并指望着在一年里就能到NASDAQ套回现金的浮躁氛围里，要扎扎实实地从用户的角度进行细致分析与设计显然要占用“不必要”的时间资源而错失大好商业时机。不过，网络狂潮的回头对我们这类人倒是一个福音。因为只有当CEO们将战略调整为稳扎稳打以后，大家才得以喘息之机来重新衡量站点设计的价值。


【关于麦当劳】
1948年McDonald兄弟在加利福尼亚州San Bernardino的餐厅里重塑了麦当劳，创造了现代快餐工业的原型。 1992年麦当劳在北京开张的第一天就吸引了4万名消费者，刷新了两年前在莫斯科创下的记录。现今，在118个国家的2500多家麦当劳餐馆每天要为4300万人提供服务。

1.2 “我被困在这张网中央……”——把握网络媒体特性

记得在1997年，我初次接触互联网时，第一个进入的国外站点就在麻省理工学院（MIT）。MIT是我当时唯一知道的美国高校英语缩写，出于对发达国家高等教育的向往，于是在地址栏里漫无目的地输入了www.mit.edu，但仅仅几次点击之后，我就被所看到的东西惊呆了。

在这个校内学术机构的索引页上，几乎所有的信息都是各部门的连接。进入某个学院（School）的主页后，还是一长串链接。原来下面还有系科（Department），再进入又可以见到一组实验室。继续……，居然还能发现了某教授的个人web服务器！我仿佛一下子被抛入了浩瀚无边的链接的海洋，虽能任意遨游，无拘无束，但事实上却深深地被困在这张巨大而无形网络中了。每一个页面，每一组目录都是那么个性鲜明，形式特异。我不知道刚才从哪里进入，也不清楚可以继续探索的方向，常常为新的站点所吸引，却又忘记了搜寻信息的初衷。不过当时的我并没有清楚地意识到这些，更多地只是感慨世界一流学府信息化程度的登峰造极。
作为互联网的新手时常会有这样的困惑。面对前所未有的海量信息，一定既新奇又兴奋。一开始，总是相信自己借助如此强大的工具，一夜之间就能找到所有感兴趣的资料；但随后的挫折又常常将他们带到另一个极端，他们会发现很难掌控查询信息的进程，以往在辞典，报纸，书籍中习得的传统经验似乎都在面临挑战，即便求助于最智能化的搜索引擎，想要获得正确的结果还得依靠上帝的慈悲。
有研究表明，用户在最初接触互联网的一段时间内，会毫无规律地访问各种各样的网站，而在4到7周之后，经常访问站点就固定在有限的几个网址上了，一般不超过5个。这表明用户期待的是获得所需信息的可能性和有效性，当某些站点使他感知到这种可能性和有效性为最大时，他就停留在这些站点上，尽管互联网可以随时提供几乎无限多的选择。

我们有必要将讨论深入下去，来观察互联网传播的根本特点，这有助于使设计师清楚所面临的困境。当然以下的分析归纳仅局限于对信息产生、积累、获得的传播过程，撇开了互联网在技术革命或经济革命层面上深远意义的探讨。

1．分散的联系性信息产生
2000年6月，美国商务部经济统计局发布的《2000年数字经济报告》（http://www.esa.doc.gov/de2000.pdf）中指出，现在全球共有10亿网页，而且每天都会增加300万个新网页。可以想见，富有活力的因特网每时每刻都在发生巨大的改变，并且这些改变分散在全球范围内，它们也许发生在纽约证券交易大楼某台超级数据处理机上，也许在北京大学的某个生命科学实验室里，也有可能在环绕地球的某颗正在发送云图的气象卫星中。新信息的产生出自不同的目的，并将通过不同方式被利用。这是一种非常难以预测的混沌状态。但有一点可以肯定，这种改变将持续下去，而且在规模，容量，速度上不断提升。
在互联网内容的创造上，联系性已经成为其区别其他媒体的突出特点。HTML语言解决的根本问题有两个，其一是保证互联网页面的表现与设备无关，使尽可能多的各式计算机能够对它进行正确解释；其二就是通过超级链接实现全网络范围内所有资源的方便的定位和关联。新创造的页面常常不是孤立的，引文、实例、图片都有可能直接来自网络上的另一个角落，我们会相当乐意地用超链将这些出处提供给读者。就像本书一样，如果您正阅读在线版本，就可以随即访问我所提到的站点，来进一步获取更深入的信息。这正符合了超文本语言的初衷，尽管不恰当的超链也会时常给我们制造麻烦。

2．不断积累的海量变化信息
网上有这样一句话，“The biggest disk in the world is simply all disks wired together. ”（世界上最大的磁盘就是将所有的磁盘都连起来）互联网就是这个最大的超级磁盘。随着越来越多的新系统被连接进来，以及老系统的持续升级，这个超级磁盘的容量正趋向无限。网站上发布的信息正在以指数级增长，而信息技术的进步更使我们积累数据的方式可以轻松跨越原有的障碍。近来，硬盘容量几乎以每年60%的速度在递增，而其价格却在以40% 左右的速度下跌。
1995年8月，全球的WEB服务器大约有1.9万个，而到了1997年10月，这个数字增加到150万，2000年7月又飙升至1800万（数据来自Netcraft）。在中国，据CNNIC统计，1997年10月共有WEB站点1500个左右，2000年7月则为27289个。WEB服务器数量的爆炸性增长加上每台服务器上不断添加的新数据，全球网络中容纳的信息简直难以估量。
互联网上信息积累的速度很快，变化的速度也不慢。相信大家都有这样的经验，在点击搜索引擎上查获有关网址后会发现该网站或网页已经更换了新的地址，其中的内容也被重新整合，搜索引擎的数据早已成了昨日黄花。
所有的站点在自身信息不断积累过程中都身处一个数据膨胀的网络环境。

3．即时性的用户驱动获得
互联网是互动的媒体。从技术角度来剖析，用户每一次点击超链，浏览器都会以HTTP协议通过网络发出的一个的请求信号，然后等待对方WEB服务器响应，最后才得到相应的页面数据。用户具有同其他媒体相比的最大的选择性。这种随时由用户驱动获得信息的方式全然不同于传统媒介。
书本、电视、音乐的读者或观众往往要按照制作者决定的顺序来阅读或欣赏作品。但互联网有着本质的不同，用户拥有“过分的自由”。他们的行为常常超出站点制作者的设想，并且这些行为是多样化的：有的最先点击头条，有的则对图片感兴趣，还有的可能直接进行检索，有的甚至等不急下载完第一页就不耐烦地离开了你的网站。要尽可能满足不同用户的浏览体验，并使对站点他们产生相对统一的认识，这给设计师提出了巨大的挑战。
用户在等待新页面出现的短短几秒钟内，他们正处于猜测，期许的状态中，并多少伴随着些焦虑和不安（这种心理状态正被越来越多的网虫综合症所证实）。用户究竟能够忍受多少次令他们失望的点击呢？即时性的用户驱动可以帮助我们构造层层深入的复杂站点，但同时也会轻易掩盖掉相当多的设计缺陷，而这些危险的“地雷”却正时刻等待着你宝贵的用户去挖掘……

设计师必须以智慧来张扬网络传播的优势，并减轻可能给用户造成的压力。信息产生的联系性要求我们考虑站点内容在内部和外部的关系，提供当前主题以适当的信息外伸；海量信息的增长又要求我们考虑站点的构架必须适应在容量和结构上不断扩充的需求，同时保持体制和形式上的井井有条；用户驱动的特点则要求我们在设计页面过程时考虑如何帮助用户在交互动作中一步一步地获取需要的信息，而减少不必要的干扰。
以上概念性的描述旨在加深对网络信息传播特点的理解，至于如何实现这些具体的目标，本书的第二部分将予以重点讨论。


【关于 www.mit.edu 的小插曲】www.mit.edu 这个域名长期为麻省理工学院的一个学生组织——学生信息处理委员会Student Information Processing Board (SIPB)所管理，而学院的官方网址为web.mit.edu。为了避免期望访问MIT官方主页的局外人混淆，1999年8月后，www.mit.edu 的主页才与web.mit.edu保持一致。想看一看以前的 www.mit.edu 吗？请访问http://www.mit.edu/sipb/sipb.html