用眼球跟踪改善网页设计

你在看机器,机器也在看你。最近眼球跟踪技术诞生了不少的应用案例。比方说,Intel研发3D笔记本摄像头,可以追踪眼球读懂情绪;上海琢视的纯软件眼球追踪可支持用眼睛玩打飞机游戏等。现在EyeQuant则利用先进的神经技术研究用户眼球看网页时的运动,从而生成设计元素和网页区域的热点图(即用户的注意力集中的区域),再研究如何改进网页设计。以下就是他们的发现。

Web设计应该注意什么

眼球跟踪技术的第一个发现是,Web的F和E形模式布局设计(利用用户大都最喜欢观看左侧屏幕的特点进行布局)未必就是对的。只要内容吸引眼球,不在F或E形模式区的地方一样会受人关注。比方说,高对比度、中心布置及排列整齐的内容。实际上,Web设计时应该更关注3W:网页要说什么(What),用户为什么要关注(Why)以及接下来要去哪里(Where)。

某些Web设计的最佳实践受挑战

还有一些Web设计的最佳实践受到了眼球跟踪技术的挑战。比方说,传统观点认为人总是会注意脸部。EyeQuant在用眼球跟踪技术研究了数千个不同网站后发现,脸部和注意力的确存在关系,但是人却未必总是关注脸部。另一个Web设计的观点是要想让文字突出,就得把字体放大。但研究发现,尽管有些页面的字体很大却被用户无视。

关于图库的选择与使用

要想图片引人注目,最重要的是要有高反差—不仅图片本身要有高反差,而且相对于页面的其他内容也要形成强烈对比。这不光是颜色的对比,在亮度上也要有反差。图片需放在上半版面,位于中间或者坐上位置。而且不要放得太凌乱,应该给页面留点空白的空间。

像旋转横幅和幻灯片这样的重图像元素有效性如何?

运动的确可以在开始时吸引注意。换句话说,也可能造成干扰,而这些元素往往只跟一部分浏览网页的用户相关,所以对于商业网站来说,这些元素反而会对转化率产生负面影响。

像苹果用的那种日渐流行的大英雄区域是否有效?

所谓的大英雄区(Big hero area)是指大幅图像伴随少量文字的布局,苹果尤其擅长使用。如图像是相关的话,大英雄区极其有效,否则的话就会造成干扰。如果采用图库的图片的话,必须挑选可支持希望传递信息的图片,而且不要过多分散对页面其他关键内容的注意力。

长幅滚动页面还是让重要元素保持在上半版面?

部分长幅面的滚动页面的确非常成功,而且用户对此似乎也越来越习惯。但是数据表明一般用户仍把大部分时间花在上半版面。

链接按钮应该如何设计?

人是对比生物,所以按钮与背景色之间,按钮文字和按钮之间都必须形成鲜明对照。

用户会看哪里?

作为设计师应该有能力影响用户看什么地方,而不应该成为某个布局或模式的奴隶。元素在页面的布置只是影响用户关注的其中一个因素。只要理解了注意力的建构要素,你想让他们看哪里他们就会看哪里。哪些是影响注意力的要素呢?这四个:对比,位置,大小和空白区域。

[本文编译自:thenextweb.com]

时间: 2024-12-29 20:36:57

用眼球跟踪改善网页设计的相关文章

网页设计中手绘风格的运用 改善网站的用户体验

怎样在网页中应用手绘风格,改善网站的用户体验 本文中,我们将讨论怎样在网页中应用手绘风格,以改善网站的用户体验. 识别度与真实感 手绘风格非常有利于展示人性色彩,形成独特的识别度,为用户带来真实感.当你收到好友寄来的明信片时,你总是希望看到卡片是手写的,带着好友独特的笔迹,而不是用电脑打印出来的.一张手写的便笺也总是比电脑打出来的纸片更加随意和亲近. 在网页设计中,道理也是一样的:手绘和手写风格的应用可以让产品显得更加独特.更加真实.更加值得信赖.下面是手绘风格带来识别度和真实感的三个例证: 独

改善用户体验 网页设计中手绘风格的运用

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 [核心提示] 怎样在网页中应用手绘风格,改善网站的用户体验 本文中,我们将讨论怎样在网页中应用手绘风格,以改善网站的用户体验. 识别度与真实感 手绘风格非常有利于展示人性色彩,形成独特的识别度,为用户带来真实感.当你收到好友寄来的明信片时,你总是希望看到卡片是手写的,带着好友独特的笔迹,而不是用电脑打印出来的.一张手写的便笺也总是比电脑打出来

17个创业公司精雕细琢的优秀网页设计

  创业公司常常能给我们带来惊喜,不拘一格的工作方式,别开生面的商业模式,独树一帜的产品和服务,个性十足的工作控件,集设计.野心.创意于一体,它们就是这么令人着迷. 但是对于网页设计 师而言,最值得关心的还是他们呈现产品.表达自我.输出独有文化的官方网站.走在科技与时代前沿的创业公司们对于设计的重视程度向来是很高的,从工作环境到桌面布置,从产品设计到官网风格,都呈现出高度的个性化,每一个元素都一丝不苟. 虽然创业公司成千上万,但是最令人瞩目的依然是其中最顶尖的那一波.今天我们推荐的17个网站就是

网页设计中的图标的使用技巧与资源合集

  提到图标设计,似乎每个设计师都有话说,但是要做好图标设计真的那么容易么?今天这篇文章针对网页设计领域的图标设计进行了相对全面的梳理,从设计技巧到设计资源一应俱全,但愿能帮上你! 图标是每一个现代UI中不可或缺的组成部分,它们不仅能协助UI布局组织内容,而且轻量级的图标融入界面也不会喧宾夺主.不仅手机和平板的APP UI中会大量用到各种图标,而且iPod和智能手表的界面中也是如此,这正是因为图标具备快速直观传达信息的能力. 在网页设计刚刚兴起的时代,小图标就已经被早期的网页设计师和开发者投入使

网页设计技巧:正确处理网页图片

译者:nornor 俗话说,一图胜千言.无论这是真是假,图片都是网页中重要的组成部分.自从嵌入图片步骤变得简单,我们可以看到很多网站都内嵌了许多图片,其中一些 网站从不同角度展示了正确利用图片的好处,然而,大部分网站则不是如此.尽管这对于一款设计来说,并不是多大的影响,但是这些图片可能会减少你销售产品的 机会,除非你有一个很好的诱导用户的页面或者创造了很好的阅读流条件.图片是细节胜于原则的问题,处理图片应该是设计师们更加需要理解和掌握的能力. 网页可用性专家Jakob Niesen和他的公司NN

网页设计可用性指导-如何成功地使用图片

俗话说,一图胜千言.无论这是真是假,图片都是网页中重要的组成部分.自从嵌入图片步骤变得简单,我们可以看到很多网站都内嵌了许多图片,其中一些网站从不同角度展示了正确利用图片的好处,然而,大部分网站则不是如此.尽管这对于一款设计来说,并不是多大的影响,但是这些图片可能会减少你销售产品的机会,除非你有一个很好的诱导用户的页面或者创造了很好的阅读流条件.图片是细节胜于原则的问题,处理图片应该是设计师们更加需要理解和掌握的能力. 网页可用性专家Jakob Niesen和他的公司NN/g做了一项眼动研究,总

最近眼球跟踪技术诞生了不少的应用案例

你在看机器,机器也在看你.最近眼球跟踪技术诞生了不少的应用案例.比方说,Intel研发3D笔记本摄像头,可以追踪眼球读懂情绪:上海琢视的纯软件眼球追踪可支持用眼睛玩打飞机游戏等.现在EyeQuant则利用先进的神经技术研究用户眼球看网页时的运动,从而生成设计元素和网页区域的热点图(即用户的注意力集中的区域),再研究如何改进网页设计.以下就是他们的发现. Web设计应该注意什么 眼球跟踪技术的第一个发现是,Web的F和E形模式布局设计(利用用户大都最喜欢观看左侧屏幕的特点进行布局)未必就是对的.只

网页设计走“涂鸦”路线,手绘创意有个性

网页设计似乎走向了穷途末路,包括移动端网页的设计也是千篇一律.设计师何尝不想有创新,很简单一句话:不按常理出牌.没有两片叶子是一样的,也没有两个人的灵感的尽相同的.而涂鸦和手绘是非常能表现一个人的创造力与灵感的方式,所以若想要打造精致而又独一无二的网页,一起欣赏一下他人的创意. 涂鸦并不代表繁琐,小清新也有非凡的创造力.我们可以看出,旧风是整个网页的主体,而语言选择按钮选择了涂鸦Style,简单而又别具一格. 涂鸦中,气泡是常用的.而多姿多彩的气泡集合,也是别有新意. 这是一个以一盆盆栽为主体的

25个来自法国最优秀的网页设计

  法国是个时尚而浪漫的国度,文化和艺术的殿堂.在这样的沃土之上,现代文明和传统经典碰撞之下,法国的设计师对于艺术和设计有着独到的见解,多元的文化孕育出了参差多态的设计作品.毫无疑问,你可以这些无与伦比的法国设计师的网页中获取灵感,汲取养分. 法国设计师和艺术家的创意思维有着他们独特的文化根源.回溯法国的历史,从早期的凯尔特文化,到罗马帝国时代,从中世纪一路到现代,每一个阶段都有着璀璨的文化.中世纪有梅罗文加王朝的艺术,加洛林艺术,文艺复兴时期的也有巴洛克.洛可可.古典主义和新古典主义,近现代的