交互设计实用指南系列(5) – 突出重点,一目了然
作者:宗羲 来源:taobaoUED 发布时间:2010-01-11 21:05:00
看到这张照片,我们一眼能够看到天宏(图中这位UED俊男)的眼睛。我们能从他的表情里读出一些他的性格。一张好的摄影作品,最重要的一点,就是这个照片是否有焦点,照片的主题是否一目了然。而摄影作品的用光、构图、景深等等手法,其实就是在让一个照片能够有其焦点,并且利用这些艺术手法来烘托气氛,提升主题。 一个优秀的页面亦如此:应当突出重点,一目了然。相信大家也知道,一个用户在浏览网页的过程中,只是扫描页面,而不会像是在看书似的阅读每一处地方,每一行文字。一个网页呈现在用户面前的时候,应该在5秒之内,就能理解:这个页面是干什么的?我大致能通过这个页面做些什么?接下来我该去哪里? 我们网站上的每个页面都可以是任务流上的一个点。这个点上包含着用户需要的信息,也许是继续找到任务流的下一个点的信息(例如导航),也许是用户想找到的最终内容。而一个页面上存在着上百甚至上千个链接(淘宝的宝贝详情页面通常有700多个链接),要在这样茫茫大海中找到用户需要的链接,可见,“突出重点,一目了然”是多么重要。
测试您的页面
测试您的页面是否达到“突出重点,一目了然”,能够让用户在短时间内找到他们所需要的信息,其实可以是个低成本的小型测试。fivesecondtest.com 这个有趣网站是一个专门做5秒测试的站点。测试者上传一张站点的截图,然后被试观看截图5秒,然后说出刚才看到了哪些东西。另外一种方式是被试看到截图,在5秒的时间中,点击他所关注到的所有焦点,最后给出每个焦点他认为的描述。
下图是本文开篇的时候,8个用户的测试结果:
这种测试比起眼动议来说,测试的成本要低得多,而且能够明确得测试出你的页面的浏览者是否能在第一时间发现他们所需要的内容,并且可以比较出,这是否符合你的设计的初衷。
猜你喜欢
- 1、Mysql errono 1005 : 主外键不是完全一致 , 请检查如下几点: a、字段是否存在 b、类型是否一致(注意unsigne
- 实现一个简单地httpServer上一篇文章对http库的基本使用做了说明,下面来实现一个简单地httpServerpackage main
- 基于python+OpenCV的车牌号码识别,供大家参考,具体内容如下车牌识别行业已具备一定的市场规模,在电子警察、公路卡口、停车场、商业管
- 判断文件是否存在os.IsExists()函数和os.IsNotExists(),他们的函数的原形是func IsExist(err err
- 一.Jupyter介绍Jupyter Notebook是一个交互式笔记本,支持运行40多种编程语言。Jupyter Notebook 的本质
- 但是,当一本书学过之后,对一般的技术和函数都有了印象,突然想要查找某个函数的实例代码时,却感到很困难,因为一本书的源代码目录很长,往往有几十
- 之前一直使用QtCreator,在设计界面时非常方便,python早就集成了Qt模块,在python中以pyQt的包存在,目前常用的是pyQ
- 1. 获取时间1.1 当前时间获取package mainimport ( "
- 遇到一个写文件的小程序,需要把print输出改成输出到文件,遇到这个问题的思路是把需要的字符串拼接到一个字符串中,然后在写到文件中,这样做觉
- <input type=button value=刷新 onclick="hist
- Python的matplotlib模块绘制图形功能很强大,今天就用pyplot绘制一个简单的图形,图形中包括曲线、曲线上的点、注释和指向点的
- PyTorch之TensorDatasetTensorDataset 可以用来对 tensor 进行打包,就好像 pyt
- SQL 事件探查器数据列 SQL &
- 什么是循环呢?简单理解,循环就是反复的去做某一件事情。生活中的例子:比如我们听歌的时候,在歌曲的页面就会出现单曲循环、列表循环、随机播放以及
- python jenkins 打包构建代码# pip install python-jenkinsimport jenkinsimport
- 关于导航栏的设计有很多特效,但你浏览过这样一种导航栏特效吗?当鼠标移到导航栏目上时,导航栏目会被一层“
- 利用python爬取豆瓣电影Top250的相关信息,包括电影详情链接,图片链接,影片中文名,影片外国名,评分,评价数,概况,导演,主演,年份
- 本文实例为大家分享了Bootstrap组合上下拉框的具体代码,供大家参考,具体内容如下<html><head><
- 卷积和膨胀卷积在深度学习中,我们会碰到卷积的概念,我们知道卷积简单来理解就是累乘和累加,普通的卷积我们在此不做赘述,大家可以翻看相关书籍很好
- 一:js支持 Unicode 字符集,所以可以用中文命名函数。 二:js 在Var中没有初始化的变量,默认为undefined 三:对于未声