[年度翻译计划11]中国网页设计欣赏：从模仿到创新[66P]企业库|免费b2b网站

中国网页设计欣赏很难在smashingmagazine上能看见说咱们自己的设计作品的！当然得细细阅读！
翻译过程很伤，{zh1}的翻译文字有10000多字，三个晚上才算基本完成，过程很辛苦，结果却不是那么甜。。。11到50还很遥远。。。
很晚了也不想瞎掰了，有些地方翻译的不满意，高手们请绕道直接读原文吧，当然也欢迎拍砖，呵呵。
原文地址：
——————————————————————————————————————————
中国是一个有着五千年文明史的国家，她是东亚一个幅员辽阔的多民族国家。中国文化的影响甚至延伸到了整个欧洲大陆，并且中国传统文化和文字系统已被周边的国家包括日本、韩国、越南所广泛接受和应用。
中国在历史上经历了很多起伏和曲折，从富裕和繁荣（如公元618-907年的唐朝）到贫弱和被殖民（100年前的清朝时期）。现在的中国向世界敞开了她的大门，热情的拥抱着新趋势、新概念、新技术。互联网就是其中之一。
我们将采访的是在中国家喻户晓的6位设计师，他们每个人都非常的不同，过程中有一个被反复谈论到的主题：中国的网页设计行业的发展状态呈现出一个螺旋状：从模仿到创新以及以用户为中心的设计。

东湃设计

发展现状
——————————————————————————————————————————

我们所采访的设计师对中国网页设计的发展方向谈论较多，还有便是发展现状和发展趋势。这些设计师都是在中国的主要城市工作和生活，他们是：
:
百度的前任首席设计师，百度是中国{zd0}的搜索引擎。
现居住地：北京

白鸦：
UCDChina的联合创始人，支付宝产品设计师（支付宝是阿里巴巴的一个子公司）
现居住地：杭州

吴隽辰：
UCDChina的联合创始人，途牛旅游网的产品经理。
现居住地：南京

周陟：
视觉设计师，在长江电信任职UI设计师，并且著有UI进化论一书。
现居住地：深圳

：
谷歌中国用户体验设计团队的领导人物。
现居住地：北京

千鸟：
信息架构师，UCDChina的联合创始人。
现居住地：北京

采访是通过电话、Skype和谷歌talk进行的。在采访之前问题已经先告知了他们，但是事实上的采访都是半结构化（semi-structured）的。由于对他们的思考范围非常感兴趣，我们告诉他们不要限制他们的问题在“网页设计”上，设计师们被告知网页设计部仅仅是指视觉画面、css和前端，它也包括后台、基础设施、设计理念、文化因素、用户体验设计和研究等等。我们希望设计可以尽可能的自由开放和具有创造性的表达他们的想法和思考。

摩力游旗下一款游戏魔法之门的游戏官网。
——————————————————————————————————————————
问题：你对中国网页设计的现状怎么看？
:
大约70%以上的中国互联网使用者都是30岁以下的人，他们年轻、开放并且接受新事物的速度非常快，他们喜欢玩网络游戏并且热衷于在网上去发掘能够让他们开心的事物。因此，你可以在许多中国的网页上看见很吸引视觉的元素。它的目的就是为了照顾这样的用户群体。

白鸦：
大概在两年前，我们目睹了一个巨大的趋势，中国的设计师热衷模仿韩国网页中使用的flash效果。使用Flash和炫丽多彩的设计一度成为一种设计趋势。但是，通过web2.0的被广泛使用，中国的网页设计开始得到了改善，用户在搜索的是内容而不仅仅是视觉效果。视觉本身并不能满足中国的互联网用户了。他们开始寻找更加有用和有帮助的内容。而且他们也希望自己能对浏览的网站做点什么。

吴隽辰：
这个呈现出一种上升趋势，而且越来越好，但是就像一个螺旋状一样。在网页知识和网页技术方面，中国的设计师和西方国家的设计师是不分伯仲的，但是他们还没有达到能够充分使用这些知识结构的地步，有一个很好的例子，就像用户研究一样，许多设计师都知道它的概念，但是他们很少将其应用到他们的实际设计操作中，他们知道可用性测试，但是他们很少这样去做。

周陟：
嗯，有两点，{dy}：有限的预算在中国的网页设计市场上是非常常见的。这就导致一个结果，网页设计最终的目的变成了以压倒性的视觉效果去吸引注意力。它必须{dy}眼看起来非常的炫非常的漂亮！但是信息结构就可能没有很好的规划好，而且可用性也就非常不好。关于第二个方面，中国的网页设计往往是非常本土化的，它也应该是这样的。

产品网站。

例如：支付宝，曾经是淘宝的一个副产品，现在已经成为一个非常成功的独立产品，因为它充分的考虑了中国用户的购买行为和心理。中国是一个非常大的国家，有些网站之所以成功，就在于它满足了特定的地理位置的人群需求。另一方面就是中国的网页设计还不够国际化。中国本身就是一个非常大的市场，这个市场本身就可以供养它，因此就不需要去考虑面向国际化市场。就拿UCDChina来讲，它和许多中国网页一样都没有英文版，甚至在导航条上也没有英文导航指示。

：
中国其实还没有形成自己独立的网页设计风格，因为我们国家非常大，而且中国的用户在很多方面结构非常复杂，在外国人眼中我们中国的网页设计可能让人感觉非常眼花缭乱和炫丽，但是我把这看成一种实践练习。当flash设计成为潮流，许多设计师（或者他们的老板）就想用flash去让他们的网页看起来更具有吸引力。当SNS社交网站在美国蓬勃发展，SNS也就迅速的被引进中国，连同Facebook和twitter的设计风格。当它被证实具有可操作性和可用的，许多中国人就会借鉴这种概念并发展它。百度、QQ和淘宝都是通过这样的方式在商业上获得了尊重和成功。

千鸟：
中国人口众多，而且有句俗语“多多益善”也被用于网页设计上，你可以看见一些网页页面充斥着内容而且杂乱无章，设计师或者那些话事人都想把所有的内容放上去。另一件事情是这样的，目前，中国的用户适用网络的主要动因是娱乐，因此，中国的网页设计师们趋向于将网页设计的非常娱乐化，更像社交网站和更具有视觉吸引力，就像我们看见的在2004年的设计流行趋势就是模仿韩国的flash网站一样。

鞋柜

中国网页设计的总览
——————————————————————————————————————————
那么，你现在对中国的网页设计行业现在有个大体的了解了吗？虽然我们的受访者往往没能减少在中国设计网页的一定的模式（Although our interviewees tended not to reduce Web design in China to certain patterns），我们总结了几条在我们采访中经常被提到的观点。

?
1.flash技术的过度使用：产生于模仿
Flash设计许多年来一直是备受争议，事实上对于搜索引擎来讲分析flash对象是非常困难的，这也就成为了对一些设计师的主要关卡。
但是flash一样备受拥戴，而且flash是在我们的采访中被频繁提到的一个词汇。回到2004年，当韩国网页使用很多flash{tx}的时候，中国的设计师和企业主觉得flash是非常炫的事物，Rex Song千鸟提到这种设计趋势在几年前是非常流行的事情，你甚至可以在网上花非常少的钱买到韩国风格的模板，这样你就可以花费很少的精力快速完成任务。
谷歌在其关注简便性上享有非常好的名声，但是让我们看看谷歌中国和谷歌美国在细微上的一些差别：

谷歌中国的设计相比谷歌美国的设计要生动活泼很多，在谷歌中国的界面中添加了动态展示以暗示谷歌搜索的多样性。附带说一下，这种做法首先是在韩国和日本的谷歌页面中实施的，虽然这两个国家的谷歌首页现在已经回到了比较安静的面貌上来。
虽然中国的flash设计是起步于模仿，但是现在设计工作室和自由职业者的组合发展成为这一行业的特征（it is now increasingly featured in the portfolios of design studios and freelancers），利用flash网页推出新产品和让产品更切合年轻一代的喜好。

上海双妹是一家很老的化妆品公司，他们正尝试革新旧的品牌并吸引xx消费者，其品牌网站使用全flash制作，描绘了一个优雅和高阶层的生活方式。

酷熊HI，作为长城汽车的一个产品，使用的是一个全flash站点来发布新产品。

为了满足网速较低的用户群浏览，酷熊HI做了一个非常棒的loading呈现方式。

在酷熊HI这个网站上，车子下方的文字会随着flash文件的载入而变化，使用活泼的文字来减轻用户等待内容载入时的无聊，网站看上去并不那么枯燥乏味。上面是我们截取的一部分loading过场画面，下面我们我们列出不同的载入点展现的文字：
4%: “选择酷熊“HI”客，分享你的快乐.”
22%: “每天展露开心的笑脸，向每个人HI.”
41%: “酷熊很不耐烦“为什么还没有儿女把我赢回家！”
70%: “预约试驾，有礼有积分.”

三全面点坊，一家速食早餐食品公司，同样使用全flash网站作为公司网站，动画将馒头和包子做了拟人化处理，让他们做晨练和其他动态动作，这都是在向消费者暗示公司提供的是非常健康的早餐食品。

让我们看看面点坊的网站的loading动画的呈现方式：

载入动画模仿酵母的发酵过程，面粉越发越大直到你看见全部网站内容。

鞋柜，中国的一家面向年轻消费群的鞋类品牌，使用全flash网站来传递品牌对流行的理解，此外，在主页上手绘画面和古老的黄褐色报纸颜色做背景传达出了鞋柜的品牌内涵：品味是一种生活态度；从简单出发；流行是一种运动，从showbox开始。

联想手机MIRO手机网站充分利用了个性人物并在动画中嵌入他们的故事来展现产品样式、功能以及非常有用的产品特性。

，一家创意设计工作室，同样使了flash网站，特别是它的导航按钮，随着按钮的触动会出现语言切换，设计室并不想用flash来展现他们所有的设计案例，但是在一些特别重要的地方以便向客户展现他们的技术的时候使用的是flash来呈现。

?清美设计，一个设计工作室使用了非常活跃的flash画面。

2.为娱乐而设计
——————————————————————————————————————————
我们非常喜欢我们的一对一的采访模式，因为不仅仅我们希望听到每个人的不同的故事，而且我们同样可以从采访者那里听到某些其他事情。Whitecrow Zhu白鸦、Lytous Zhou周陟、Yu Guo和Rex Song千鸟都同时谈到了中国网页设计的“娱乐化”特点。“让一个社交网站传入中国，它就必然演变成为一个游戏网站” Whitecrow Zhu白鸦说。
We really liked our one-on-one interviews because not only did we hear different stories from different people, but we also heard certain other stories from everyone. For example, Whitecrow, Lytous, Yu, and Rex all talked about the “entertainmentalization” of Chinese Web design. “When a social networking website comes to China, it must become a game website,” said Whitecrow.
一个典型的例子就是开心网，最近开心网在中国掀起了一场社会现象“偷菜”。开心网几乎是xx照搬Facebook的导航和用户交互模式，但是你在开心网上能做的事情又是非常不同于Facebook的：建立你的“开心农场”，修建你的房屋，种菜和在你朋友准备收获的时候偷你朋友的蔬菜。有些沉迷其中的玩家甚至使用excel表格来跟踪他们朋友的收获季节以方便偷窃他们的蔬菜。这就像其他电子游戏一样但是嵌入了社交网站的内容，这样就使玩家的结构群更为多样化。“偷菜”如此受欢迎甚至引起了中国文化部的注意。在文化部的压力下，现在这个游戏叫做“摘菜”说法变得更委婉，少了一些对主流文化的背离。但是玩家们更喜欢那种更为准确的名称。

阳光牧场

开心果园

这个功能现在也在Facebook上增加了，但是现在还只是提供给中文用户使用。

立顿奶茶有一个“立顿连连抱”的游戏，你只需要在网页上就能玩，通过像你在人人网上的发起拥抱来获取游戏积分。人人网是中国另一个社交类网站。

当你积攒了足够多的拥抱积分，你就可以在在线商城购买物品和换取礼品，这样可以激励用户保持参与游戏的热情。

像立顿奶茶一样，M&M糖果在中国的网站同样使用了一种在线接力游戏去鼓励用户访问网站。

是中国移动用来推广它的G3网络和G3手机的网站，以动画的形式向用户列出了一系列的问卷调查，让用户围绕这些问题去观看网站。

当你回答了一系列的问题后，如“你在火车上如何打发时间?”“你如何穿越海洋？”然后后台系统会分析你的特点并像你推荐适合你的G3手机。

3.为了赚取点击率而设计
——————————————————————————————————————————
不像拉丁语系和日耳曼语言，中文是一种象形文字，在一个以字母为基础的键盘上输入中文是非常慢的，特别是中年和老年人更是如此，因此你就会看见一些网站呈现出的样子，它们非常的拥挤：文字和图形链接到处都是。“多多益善”就像Rex Song千鸟提到的一样。这些网站是专为点击而设计的，xx不同于搜索内容（虽然关键词搜索是任何一个富信息类网站非常重要的组成部分。）

有货,一个面向年轻人的在线购物平台，充分的利用了页面上的每一个碎片去推介它的产品。是的，有一个搜索框在页面的右上方方便你进行搜索查询，但是在这些图形和链接前面，它没有什么吸引力，不断诱人的只是点击，不断的点击！

同样的情况可以在视觉中国上看见，一个视觉设计资源网站，网站的首页用文字和图像链接呈现出了网站所有的内容部分，你可以对网站内容有一个快速的浏览。

?网易（又名163.com），中国{zd0}的新闻门户网站之一，充分的利用了中国用户的阅读模式：点击。

上面的是网页的首页截屏。在我们写这篇文章的时候中国的农历新年就要到了，你会发现这个网站使用了红色，一种象征节日的颜色，作为背景。页面上充满了新闻标题、精选文章和商业广告。你可以在页面顶部点击搜索进行内容搜索，但是浏览整个网页，你就可以知道今天发生了些什么。如果你对某些新闻感兴趣，只需点击进入即可，这非常容易。
综上所述，许多网站正在努力的整理和改善他们的用户界面，增加字体大小和行距，提高可读性。“新浪网，如果你一直关注着这个网站的改版的话，从90年代末到现在，网站在设计上越变越好并且在信息规划上也比以前好很多。” John Woo如是说，他领导着谷歌中国的UX团队。

4.设计中的文化性
——————————————————————————————————————————

当被问及“我们可以从中国的网页设计中学习和借鉴什么的时候？” Lytous Zhou周陟毫不犹豫的回答：文化，我们中国人讲“道”而且我们有我们自己的价值和道德观念，网页如果针对中国市场就应该遵循中国用户的使用习惯和美学观念。例如，文化符号、书法艺术和庆祝活动：所有的这些如果适用都可以被纳入网页设计中。一个湖可能只是一个湖，但是将湖与一个美丽的神话故事结合在一起可以让这个湖变得更加美丽！”

事实也是这样，如果你将一个神话故事和一个湖结合并赋予它更多的人情味，用户的观感就xx不同了。

中国必胜客，这是一个我非常喜欢说的例子，它可以很好的解释不同文化在网页设计上的不同变化，中国必胜客的网站上充满了中国元素：配色方案、家庭主题，温暖的红色、黄色是中国的传统节日用色，而且在中国人的观念里家庭聚餐是非常重要的！

作为对比，美国必胜客在页面上非常突出快速食品和在线预订。红色也是其主题色调，但是相比中国亮丽的大红色更为硬、暗、冷。

?同样的中国麦当劳的网站，有一个主要的按钮专门是“开心家庭派对”。

Tong2工作室的网站有一种独特的外观和感觉，它的背景使用的是传统的中国花纹图案。

六芸在首页flash里呈现了一种中国水墨画感觉，为用户展现了其创造性和创新精神所在。

东派设计,一个互动设计工作室，有一个非常有趣的小网站，主题借用了三国故事来传达他们的设计理念和价值观。

John Woo指出融合民族和文化元素的设计不仅仅局限在网页上，他承认中国网页设计的实用性很强：设计师会借用任何他们认为有用或者对用户有吸引力的设计元素。

想要更多的案例展示？
还不够视觉冲击是吧？以下列出了一大堆的网页截图让你可以对中国的设计有个更深入的了解。
一个设计工作室。

一个个人网站，记录了设计师和他女朋友12年的爱情故事和他自己这些年的专业成长之路。

?优冠饼干
同样是使用flash动画在线宣传他们的产品。

新鸿儒
一个交互设计机构，结合使用了中国元素和flash动画展示他们的设计案例。

thinkpad便携式电脑的一款新产品。

摩力游
一个网络游戏网站，为了点击设计的例子。

361运动品牌
在首页上借用了2010广州亚运会的主题进行宣传。

德芙巧克力
网站使用了中国农历新年的元素来装饰他们的首页。

棒棒娃
一家零食生产商，网站上使用了很多小游戏和flash效果。

一个个人作品网站。

?
苹果树下
一个展示会员创作案例的平台。

一个服装品牌。

一个互动咨询机构。

一个卡通风格的个人网站。

一个作品展示网站。

这个房地产网站使用了全flash动态展示。

一个设计机构。

一个小型的游戏网站，在这里你可以自己制作圣诞树并将它电邮给你的朋友。

一个设计机构。

一个优雅的网站，在这里你可以DIY你的家庭小饰品。

一个非常漂亮的flash网站。

一个中国国内葡萄酒品牌。

在这个flash网站设计中结合使用了温馨的家庭主题。

一家童装公司，使用了flash卡通动画来展示公司的文化。

一个非常优雅的个人作品网站。

一个创意案例展示网站。

这个同样是结合使用了游戏和falsh元素。

玉玲珑
一家餐馆。

金玲珑
是玉玲珑的姐妹店。

一个非常简单的但是非常有创意的个人网站。

上海一家房地产开发商的网站。

挑战、机遇、趋势
——————————————————————————————————————————
挑战
当我们谈到互联网产业面对的挑战的时候，Whitecrow Zhu白鸦、Rex Song千鸟都提到了政府的审查措施，YouTube, Twitter, Facebook, 和Flickr在中国都被迫关闭了，因为这些网站的部分内容被认为不合时宜。为了遵守这些规定，Whitecrow Zhu白鸦说到了新浪微博有一个专门的团队专门负责审查内容，另外还有机器过滤。

针对互联网的免费和开放程度的辩论一直持续不断（看Nussbaum, 2010），而且现在也没有普遍的“政策互联网”。但是没有一个开放的环境，中国就无从学习也就没有办法赶上其他国家的发展脚步。

尽管如此，事情都是两面性的。“它限制了你的自由，” Whitecrow Zhu白鸦说到，“但是同时，它对UI设计和信息内容也有正面的作用。没有了耍鳌头的空间，它强迫你去考虑内容的可用性和设计内容的展示方式。”

Junchen Wu吴隽辰和Rex Song千鸟提到了另一个挑战:教育的滞后。职业学校会教你如何使用photoshop和Dreamweaver，会教你写html、css和JavaScript代码，但是他们不会教授设计的思考方法和设计背后的逻辑。互联网还是很年轻，在高等教育体系里我们还没有看见任何信息架构学或者用户体验设计相关的学位建立。

我们的采访中指出中国的设计师还没有充分利用严谨的研究方法。用Junchen Wu吴隽辰关于中国网页设计现状的话来讲：“许多设计师知道那些概念，但是他们很难将这些概念使用到实际的设计工作中。他们知道可用性测试，但是很少实际去做。”

在回答“你如何让客户知道你的设计是正确的？”的时候，Rex Song千鸟提出了一个概念“关系”和信任，他认为A/B的概念和多元测试太过西方化，这往往会导致“低xxxx率”。

这一方面也是可以理解的，因为中国的解释性推理方式有着很长的历史，无论是儒家还是道家。另一方面，中国的设计师要想用硬数据来支撑他们的设计选择的话，还有很长的一段路要走。

一些人也许会说设计师的工作就只是设计而已，但是事实上时你需要理由去支撑你的设计决定，比如排版方式、配色方案、元素的位置、用户交互等等这些都需要理由。“设计师们依靠他们个人观点做出的选择只有25%的是正确的”这是Neilsen Norman Group2009年的一份研究报告得出的结论。

机遇和趋势
——————————————————————————————————————————
在采访到这6位设计师关于中国网页设计所面对的机遇和趋势的时候，让我们倍受启发。

问题：你预测中国网页设计的趋势会是什么样的？

Yu Guo:电子商务，我会说，你知道淘宝吗？在还没有听说过淘宝的时候我的那些女同事们就已经在淘宝上买酱油和小吃了。他们非常喜欢，这是中国的一个很大的市场，有需求，我想每个公司都应该充分的利用好这一点。

[作者提示：淘宝是中国{zd0}的网上购物平台，通过“宝贝”将卖家和买家联系起来。出于好奇心，我们在淘宝上搜索巧克力，发现了那些美国好事多只在感恩节和圣诞节出售的季节性巧克力。]

Whitecrow Zhu白鸦：我想中国的网页设计将会越来越走向集成化和用户自主生成内容。豆瓣Douban，一个在线的图书和****俱乐部就是一个非常好的例子。像YouTube，他的主要的内容也是用户生成的，而且已经非常的成功了。顺便说说豆瓣比YouTube出现的早。

几年后的今天，电子商务在中国将会更为发展的更好。电子商务相比其他简单的商业它更少被审查，而且这会成为人们的一种生活需要。
(Several years down the line, e-commerce in China will be in full bloom. E-commerce is not tied to any ideology other than simple economics and consumer interest. It has less of a chance of being censored, and people demand it.)

Junchen Wu吴隽辰：为用户创造更多的价值，听其所讲，看其所做，做其所做，想其所想。我认为中国的网页设计会越来越好，会呈现一种螺旋上升的态势。

Lytous Zhou周陟：关注你的用户和你的服务。我想我们还是会看见那些设计上的浪费，就像拥挤的画面和过度的视觉效果。不过我相信画面和功能，设计标准和满足用户需求会成为一种趋势，这些都是必须要考虑的内容。

John Woo：功能性、可用性、易用性。把网站做的过于绚丽，使用非常多的红色和绿色，其实是没有必要的。努力关注用户的核心需求。天语手机现在在中国非常的受欢迎，虽然这不是一个网站，我为我的家人买了6部：4部有非常大的字体和手写功能，这可以给我父母用，一部有3倍光学变焦和800万像素的摄像头，一部看上去就像女士的化妆盒（见下图）。天语是部山寨手机生产商，但是现在它在中国手机市场上的占有率是比较高的。为什么？我想是他关注了用户的核心需求及基本需要。网页设计也是一样的。

[作者提示：“山寨”的字面意思是“筑有栅栏等防守工事的村庄”，由于山寨手机的良好销业绩山寨现在开始变得非常流行。虽然山寨公司不用做一个有市场战略的品牌，众所周知，山寨厂商可以非常灵活的满足特定的市场需求。山寨手机相比正规厂商的手机也要低廉很多。]

Rex Song千鸟：就趋势而言，我们将站在我们文化为背景的基础上逐渐形成有我们自己独特风格的网页设计。在格式上，我们将符合世界主流趋势，去创造更多的以用户为中心并提供更好的使用体验的设计作品。

结束语
网络在中国还很年轻，中国的设计师也正在追赶，虽然有挑战存在，但是我们看到的是更多的机遇：智慧的设计师、拥有很大的市场、不断增加的需求，灵活性和创新精神以及以用户为中心的设计思想。

在许多中国的网页上面，我们已经看见“从模仿到创新和站在用户角度去设计的螺旋上升态势”。创新在中国是一个持续的发展目标。这已经出现在了中国国家主席******关于国家发展的讲话中。值得赞赏的是，中国已经将设计作为国家发展优先考虑的事情，并且为设计教育投入了上亿元的资金促进其发展。

通过我们的采访，我们也为读者们收集了一些我们设计师想与Smashing Magazine的读者们一起分享的资源。

——————————————————————————————————————————

太累下面的就不翻了，大家自己点开看吧，都是些很不错的网站！

Events

These monthly meet-ups occur on the third Sunday of every month in China’s eight major cities: Beijing, Shanghai, Nanjing, Shenzhen, Guangzhou, Hangzhou, Xiamen and Chengdu. They set a topic for each month, and club members can borrow the books from UCDChina library and return them at the next meet-up.

The first conference was held in Guangzhou in 2009. It’s free to attend.

The UPA China Chapter conference, different from UPA International. The conference is usually held on “Usability Day” every year.

A biannual forum for designers and front-end developers in China.

Books, Blogs and Online Resources

About HCI design on mobile devices, written by local designer Lytous Zhou.

A classic must-read about design and emotion.

A book about design patterns for building Web interfaces with rich interaction.

This website was credited by our interviewees as “one of Yahoo’s most important contributions to the design industry.”

An online book and movie club, mostly user-generated comments and criticism.

Phoenix News Media, a new portal.

About design and beautiful things in the world.

About reading, including “design reading.”