BT

如何利用碎片时间提升技术认知与能力? 点击获取答案

微软与苹果网站可用性大比拼

| 作者 Abel Avram 关注 7 他的粉丝 ,译者 张龙 关注 12 他的粉丝 发布于 2009年9月12日. 估计阅读时间: 9 分钟 | Google、Facebook、Pinterest、阿里、腾讯 等顶尖技术团队的上百个可供参考的架构实例!

Pixelshell的联合创建者Dmitry Fadeyev在其名为“Apple vs. Microsoft – A Website Usability Study”的文章中从可用性角度对苹果与微软的网站进行了评测,结论是苹果获胜。微软的产品经理Scott Barnes对此结论也表示认同并提到问题的根源在于各种子域的管理方式都不尽相同。

Fadeyev通过7项标准对软件业的两位老大:苹果与微软的网站进行了评测:

  1. 主页

    Fadeyev说到长久以来苹果网站的访问方式都没有太大的变化,而苹果还把其主页当成一个“广告板”。“页面上方是个巨大的广告”,而其它地方只是几个链接而已,用户无法从中了解到“接下来应该点哪里”之类的信息。

    接下来Fadeyev又谈到了微软的网站,它上面也有3个广告,但在同一时刻只呈现出其中一个而将另外两个隐藏起来,至少在Fadeyev调研时是这样的。这有助于集中访问者的注意力,而另外两个广告需要用户的点击才能呈现出来。此外,他认为广告下面的文字“实在是太讨厌了,非逼你去看,巴掌大的地方放了这么一大堆信息,叫我怎么读”:

    虽然列出的只是一些要点,但字体实在是太小了,而且几乎没什么图片来区别这些条目。就我而言,我实在是没兴趣阅读这些内容,因为,它们太招人烦了。
  2. 页面流

    Fadeyev再一次流露出了对苹果网站的赞美之情:

    在读完大字标题后,用户还愿意继续浏览下面的广告,这样就会在不知不觉中点击免费试用的按钮。如果对试用不感兴趣,你会发现下面还有不少特性条目呢,每一个特性最后都是“了解更多”这样的链接,指向的页面对该特性进行了详细的介绍。这么做会引导用户持续不断的点击浏览

    Fadeyev仔细研究了SharePoint的站点,发现页面上方区域最能引起用户的注意,然而他却认为页面上承载了太多的内容,这是一个缺点。

  3. 导航

    Apple通过一个导航栏贯穿了所有的子站点,而且该导航栏上还刻有苹果的logo(以此增强品牌的认知度)以及一个搜索框。

    微软网站上也有一个导航栏,然而对于不同的子站点来说该导航栏的内容并不一样。Fadeyev说到,“事实上,无论形式还是内容,所有的子站点使用的都是自己的导航栏,这样主页导航栏就扮演着站点地图的角色了”。微软还使用了超大的下拉菜单,可用性专家Jakob Nielsen对此给予了正面的评价。Fadeyev虽然也觉得下拉菜单挺不错,但如果不小心被鼠标碰到了,菜单就会将下面的内容遮起来,用户还得将鼠标移开才能关闭菜单。除此之外,还有一个老问题,那就是内容太多了,而且有时还会有重复内容。

  4. 可读性

    Fadeyev认为苹果网站的可读性非常棒,标题使用了更大的字体而且还用空白将内容分隔开。只是有些页面的字体太小了。

    微软网站也采取了同样的方式,然而:

    页面上过多的内容显得非常凌乱,每一种不同的颜色或是粗体条目信息都在吸引你的眼球。在我看来,页面真的需要瘦身了,只有这样才能让用户更加舒服。
  5. 搜索

    苹果的搜索使用了Ajax以便在用户输入查询信息时就能即时显示查询结果。用户可以选择某个查询结果,也可以在新的页面上浏览所有结果(按类别分组)并作出进一步的选择。

    微软的搜索则不然,它总是在新的页面上显示众多的查询结果,Fadeyev认为这么做比较适合微软的网站。他认为微软的搜索是“一种功能,然而其感官却与其他页面大相径庭,这样用户会觉得自己好像在浏览另一个站点而不是微软网站一样”。

  6. 美观

    关于苹果网站的美观度,Fadeyev认为:

    苹果网站的美学设计完全反映出了其产品设计。导航栏也折射出了其铝工艺技术,有一定的倾斜度并且还有锯齿状的文本。

    还有不少设计元素也都能反映出这一点。苹果整个产品线上的所有产品都具有一致的界面,从硬件到软件都是这样的,当然其网站也不例外。

    Fadeyev认为微软的网站“也很不错,但仅仅不错还是远远不够的。其网站上面还充斥了大量不一致的内容,也缺少精心的打磨,因此在这一点上苹果胜出”。

  7. 一致性

    整个苹果网站的感官都是一样的,页面上方的全局导航栏也总是在那儿,无论哪个页面都是如此。这样用户的整个体验都是非常统一连贯的——无论点到了哪儿你都知道还是在苹果的网站里呢。

    对于微软,Fadeyev拿Azure站点作为一个示例:

    如果拿走页面上的logo你能想象出这是微软的站点么?整个页面上的图片、风格以及颜色都与微软网站大相径庭...

    位于同一个域下的站点应该是一个统一的生态系统,然而微软的做法却事与愿违,比苹果差远了。商标图片也被弄的四分五裂,我们很难为微软网站到底是什么样子下一个明确的定义。

在这场比拼中,Fadeyev认为苹果最终获胜,而微软失败的重要原因在于一致性的缺乏。

微软Rich Client Platform团队的产品经理Scott Barnes也认同Fadeyev的观点,“对于网站的设计者来说,他们也会感觉到这种不一致性”。最近他接管了Silverlight的站点,准备一雪前耻。

我们团队对当前的网站并不满意。我们可以做的更好,也应该做的更好,Fadeyev的文章对我们很有帮助:应该重点关注用户体验与信息体系...

保持简单将成为网站下一版本的主旨。

Barnes认为微软的子站点之所以缺乏一致性的根本原因在于它们是由不同的团队管理的:

最好还是采取中央集权的方式来设计这些公开站点,这样如果哪些团队有问题就有章可循了,我们还能够对最终用户的行为进行更加统一的质量分析。

然而由于公司的政治因素,还没有哪个部门可以操控整个网站,坦白地说,我还没有看到改革的迹象。

Tim Anderson也对Fadeyev的调研发表了自己的看法并就微软网站进行了一些分析:

  • 很难从网站上那么多的废话当中寻觅到有价值的信息
  • 过多的链接,菜单页上的链接更多,有时看起来像是一个无尽的循环
  • 我发现有很多信息在大谈特谈未来如何如何,在上线之前这些信息还是经过充分准备的,然而一旦上线之后就没有再进行过更新
  • 地域性信息太差了。有时打开了微软英国站点,但最后的价格,是否有货等信息却只是针对美国的
  • 有个Technet站点,同时还有个介绍一般信息的站点,但两者之间的差别不那么明朗。我认为那个介绍一般信息的站点主要是面向商业/市场方面的,而事实却是两者之间存在大量重复的地方
  • 页面上充斥了太多的信息,导致用户的选择过多
  • 有些东西天生就使人困惑,比如CAL策略。有4种不同的CAL(user、device与standard、premium的组合),它们可以混合使用:如果所用的CAL不具备“Premium特性”的话你可以联合使用Standard CAL与SBS Premium,但结果却是没人能在哪怕一个很小的业务中成功使用这种方式

苹果网站是个好榜样,而微软网站则还需进一步改进。或许最好的办法就是采取中央集权的方式,有专门的一个部门负责为所有的子站点设计一致的界面感官;退一步来讲,即便这么做有困难,至少也要将这些子站点放在不同的域名上,就像Silverlight那样。

在这篇文章中,作者从主页、页面流、导航、可读性、搜索、美观与一致性这7个方面比较了苹果与微软网站的可用性,结论是苹果胜出。那么作为读者的您有何不同看法呢?请大家在浏览苹果与微软网站后参加InfoQ的小调查。

查看英文原文Comparing Microsoft and Apple Websites’ Usability

评价本文

专业度
风格

您好,朋友!

您需要 注册一个InfoQ账号 或者 才能进行评论。在您完成注册后还需要进行一些设置。

获得来自InfoQ的更多体验。

告诉我们您的想法

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

翻译问题 by chu venj

译者对原文的理解有问题。

“Fadeyev说到长久以来苹果网站的访问方式都没有太大的变化,而苹果还把其主页当成一个“广告板”。“页面上方是个巨大的广告”,而其它地方只是几个链接而已,用户无法从中了解到“接下来应该点哪里”之类的信息。”

原文都有了加粗的“making the decision of where to go next easier.”,译稿里居然翻译成“用户无法从中了解到“接下来应该点哪里”之类的信息。”意思完全反了。

Re: 翻译问题 by 龙 张

楼上的朋友好,我叫张龙,这篇新闻是我翻译的。针对您提出的翻译问题我解释如下:

原文都有了加粗的“making the decision of where to go next easier.”,译稿里居然翻译成“用户无法从中了解到“接下来应该点哪里”之类的信息。”意思完全反了

整句的英文如下:
The “main ad at the top is huge” while the rest of the page has just a few items and lacks any content “making the decision of where to go next easier”.

注意到,在引号前还有几个单词:lacks any content


意思是,缺少“指示用户接下来点哪里的”内容。意即:用户无法从中了解到“接下来应该点哪里”之类的信息。”因为网页上缺少这样的信息。所以我认为此处的翻译并没有问题,而您的理解则完全颠覆了原文的意思。

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

2 讨论

登陆InfoQ,与你最关心的话题互动。


找回密码....

Follow

关注你最喜爱的话题和作者

快速浏览网站内你所感兴趣话题的精选内容。

Like

内容自由定制

选择想要阅读的主题和喜爱的作者定制自己的新闻源。

Notifications

获取更新

设置通知机制以获取内容更新对您而言是否重要

BT