四大UX设计原则,打造网站最佳浏览体验

翻译 2013年12月03日 11:59:13

Web设计者正在借助大量工具,以使自己设计的网站给用户带来最可能好的用户体验。最好的办法之一是在设计中充分利用现有的科研成果,以最大化用户的满意度。

眼动追踪研究为设计者提供了各种设计蓝图,以引导他们优先设计网站用户感兴趣的内容部分。该研究同样展示了访问者阅读网站的方式,可帮助Web设计者“裁剪”出适合普通大众的网站。当用户在你的网站中获得了良好的用户体验,他们会再回来,并有机会转变为网站的“常客”。

那该研究可以告诉我们关于普通访问者的哪些内容?设计者如何利用该研究来指导网站设计? Webdesigner Depot网站发表了一篇文章《 4 essential UX rules taught by eye-tracking research》,以眼动追踪研究为基础,深入探讨了网站设计中应遵循的四大UX设计原则。

用引人注意的标题文字来吸引用户,而非图片

根据研究,标题文字比炫丽的图片更容易引起网站用户的注意。该发现可用于首页布局,尤其适用于新闻网站。这也恰好解释了为什么很多新闻网站尽最大可能频繁使用煽情类标题来吸引用户注意力的原因。

几年前,有一个称为“Eyetrack III”的著名研究,发现网站的访问者特别喜欢盯着标题看。更进一步,这些标题在页面中的位置也将对用户访问网站的速度产生影响。将这些标题放在页面的左上部分,你将获得更多关注网站内容的用户。

如果你正在设计一个新闻类网站,请记住这一点:电脑屏幕上的文字比图片能更迅速地吸引用户的眼球。 Fox News作为全世界排名173,美国排名36的知名网站,很好地利用了这一发现。你可以仔细观察一下它首页中的头条标题。


采用F形状模式来设计网站

几年以前,Nielsen NormanGroup公布了一个非常重要的Web用户研究报告,其中指出每个用户通常按F形状模式来阅读网站内容。

网站访问者最开始会水平浏览网站的上部内容,这也就是F的顶部横杠。然后,访问者会从左侧向下浏览一些网站内容后,再开始水平浏览,这次浏览的长度要小于最开始水平浏览的长度,这算是F的第二个短横杠。最后,他们垂直浏览网站左侧内容,这就形成了F左侧的竖栏。

一些网站已经将该研究中很好地应用到实践中。如 Ghost Games,它的网站主页很完美地采用了F形状模型。这不仅提高了用户体验,而且使导航变得易于使用,尤其是F形状中的竖栏很好地展示了这个网站的信息。


不用把时间浪费在广告上

很多人发现网站上所展示的广告很烦人,这也说明了为什么很多网站访问者会忽略这些广告,而只去专注那些有用的网站内容。来自Nielsen Norman Group的另一研究显示,如果网站用户正专注于网站内容时,他们是不会注视任何广告的。

要明白,设计一个主要靠广告来盈利的网站,其实就是在浪费时间。根据该研究报告,你应该重新考虑网站的盈利方式。比如,去掉广告,转为基于订阅的模式,向网站的访问者收取一定的会员费。一些网站在意识到广告这一弊端后,已经开始转向该模式。

Club Penguin就是一个很好的例子。它是迪斯尼的一款大型多人在线游戏。该网站上的所有广告均免费,但访问者需要购买会员身份才能玩游戏。


避免花哨文字与样式

简约是未来趋势。如果你希望网站用户可以迅速发现所需内容,简约很重要。美国卫生与公众服务部的一篇关于“可用性”的 博文指出,网站中的文字与样式越花哨,网站给用户带来的困扰就越多,导航失败的概率就会越高。该博文引用了Nielsen数年前的一个研究,研究中请访问者寻找美国人口普查局网站中的基本信息,而很多人在该测试中都失败了。

参与者被要求在该网站中寻找美国当前的人口数。令人吃惊的是,即便该信息以大字号、红色字体标注在页面的右侧顶部,也仅有14%的参与者找到它。有人怀疑,导致如此低成功率的原因是信息被放在了页面的右边,违背了F形状模型。

而进一步的实验发现大部分参与者根本就没有在意这个被放大、标红的信息。原因在于,该消息花哨的样式使它看起来更像一个促销广告。很多用户根本不会注意广告,所以获得这样的测试结果也就不足为怪了。

现在来看一下改进后的 美国人口普查局网站。现在它已经发生了巨大的变化,人口数字不再像一个有花哨样式的广告,它被移动到页面左边的底部,以便吸引用户向下滚动页面去查看它。但这仍算不上好的替代方案。


理解眼动追踪,理解高效的网站设计

眼动追踪研究实际上基于用户的行为沟画了一幅用户浏览网站时的喜好蓝图。无视该研究的Web设计者将会令自己身陷困境。巧妙利用该研究,可给用户带来愉悦、简单的网站冲浪体验,从而吸引更多用户,获得更好的知名度。

请记住,在任何一个网站上,吸引用户注意力是的标题文字,不是图片。记住F形状模型,这对你设计出好的网站(至少是首页)布局有很大帮助。

最后,抛弃广告。它们不仅影响美观,很多网站用户也不会注意它们。探索网站其它盈利方式,可以通过收取会员费或其他方法。无论你怎样做,千万不要让有用的内容看起来像广告,这样用户会直接忽略掉它们。记住这些,你将设计出符合用户行为的网站。

原文链接:4 essential UX rules taught by eye-tracking research

CSDN链接:http://www.csdn.net/article/2013-11-21/2817574-4-essential-ux-rules-taught-by-eye-tracking-research

苹果iPad的UX设计18原则

今天要跟大家分享的是一篇关于苹果iPad的UX设计原则的课程,用户体验的设计在手机应用的开发中占的比重要比传统的互联网所占的比重更高,所以根据悟老师特意推出这个苹果iPad的UX18个设计原则跟各位学...

2017年不容错过的最佳UX设计工具及教程资源整理

作为设计达人的你,目前正在用哪些设计工具来工作呢?如果非要做选择的话,你认为它们中,哪些是最适用于做原型、线框图、信息架构、用户测试或者活动管理的呢?事实上,我们中大多数人,应该是倾向于选择便宜、又不...
  • jongde1
  • jongde1
  • 2016年11月17日 11:11
  • 501

设计师的日常--你要知道的25个UI/UX设计网站

如果你像我一样,总是花很多时间试图找到一个最好的模式,最好用的工具和最漂亮的颜色。当然,每位设计师的需求不同,所谓“完美”的标准也不一样。但是如果能有一份资源包含几乎所有你需要的设计资源,那再好不过了...
  • jongde1
  • jongde1
  • 2016年11月23日 15:36
  • 432

强势Mac机网站设计软件:10大最佳HTML编辑器

Mac机是Macintosh的俗称,中文名称麦金塔电脑,亦有人称作苹果机或麦金托什机,是苹果电脑其中一系列的个人电脑。今天,IDC评述网与大家分享10个Mac机最佳的HTML文本编辑器。1. Adob...
  • WhatRU
  • WhatRU
  • 2015年11月26日 10:38
  • 4100

UI应遵循的三大网站设计原则

转:http://www.csdn.net/article/2012-08-10/2808473 摘要:触摸优先设计、响应式设计、移动优先设计是UI设计师设计网站应遵循的三大原则,以使网站最大范...
  • jackljf
  • jackljf
  • 2012年09月25日 10:33
  • 414

用户设计VS用户体验(UI,UX干货)

网站是否优秀依赖于一个关键因素:用户体验。但我们常说的用户体验设计是什么意思? 真正的用户体验不是你的网站看起来如何,而是当用户使用并与你的网站互动时,明白用户的需求和理解他们的困境,这才是用户...

(翻译)如何避免对用户体验设计过程产生倦怠(How to Avoid UX Burnout)

当我看到这个应用在各类应用商店中上架后,我感到精疲力尽[2]。 应用上架前的开发过程十分紧张,其中包含多种涉众、几十类用户以及横跨多个设计团队的数不尽的迭代循环[3]。我们按时完成了项目,并且与所有人...
  • gc_2299
  • gc_2299
  • 2017年11月12日 20:03
  • 44

11大黄金法则:顶级移动UX设计心髓

摘要:与动画设计一样,UX设计也追求画面与动作的真实存在感,如果做得不够逼真,带给用户的体验就非常糟糕,怎样才能把UX设计做到好?请看下面移动UX设计的11大黄金法则。 移动时代的到来,触摸无处不在...

Go语言(golang)包设计哲学/原则与项目结构组织最佳实践

总结下Go的package设计哲学 明确目的 在准备设计一个包之前,我们需要明确它的目的。 包的命名就必须明确体现其目的,而不仅仅是为了存放代码。像标准库的io,http,fmt这些包名就很好,而像...

網站設計原則

  • 2006年02月23日 15:31
  • 383KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:四大UX设计原则,打造网站最佳浏览体验
举报原因:
原因补充:

(最多只允许输入30个字)