设计模式-自动完成(2)
作者:Hong 来源:腾讯CDC 发布时间:2010-11-30 21:44:00
自动完成这个设计模式除了在简单的文本输入框中有应用还可以使用在其他环境中。图5说明了利用自动完成去指定对应的属性。一旦从列表中选择了属性,相对应的值也同时会被设定。这里将属性与值配对在大型软件开发的协同工作中有特别的意义,保证了输出质量的统一和规范。设计和开发只需要去调用就可以,大大减少了沟通成本。
图5 IBM Fringe
图6自动完成与标签组合,很显然只会匹配那些以标签名开头的项。在一些企业内部的SNS应用,自动搜索这一个模式可以与很多Web 2.0的元素组合,提高设计体验。
图6 Lotus Connections
选择
在邮箱的自动匹配环境中,按Tab就可以把匹配的联系人输入到文本框中。因为邮箱中的TAB键支持选定和改变焦点的作用。在普通的即时通讯软件中一般使用按Enter进行选中并直接打开对话框。如果是企业级的即时通讯软件建议支持Tab进行多人选择。
什么时候不用
1. 一些涉及到安全的应用最好不要使用“自动完成”,例如在输入用户名、密码或者其他敏感信息的时候;
2. 当存在大量的匹配的内容,但没有合理的依据去归类;
3. 系统不能基于用户的输入即时更新匹配的内容;
4. 自动选择不能用于有固定匹配项的场景,例如最好使用下拉列表而不是自动完成让用户选择洲名。
无障碍设计
1. 当页面进行刷新的时候,屏幕阅读器会重复阅读。所以在更新匹配项的时候页面不能进行刷新。
2. 屏幕阅读器是按照从上到下的顺序阅读已载入的页面。因此在页面载入完成后,出现的匹配项需要通知屏幕阅读器,并且在页面的这一部分要给一个快速入口。
参考文献
1. http://www.useit.com/papers/heuristic/heuristic_list.html
2. Bill Scott , Tberesa Neil 李松峰译.Web界面设计[M].北京:电子工业出版社,2009:253-254.
3. Robert Hoekman, Jr 向怡宁译.瞬间之美[M].人民邮电出版社,2009:72.
猜你喜欢
- 各位大哥: 在javascript中如何取整?比如: var
- 如果你是个赛车手,并且按一下按钮就能够立即更换引擎而不需要把车开到车库里去换,那会是什么感觉呢?MySQL数据库为开发人员所做的就好像是按按
- 作者的blog :http://www.planabc.net/老甘的《完全用CSS实现的中英文双语导航菜单》一文中使用“position:
- 使用ENUM代替字符串类型有时候, 可以通过使用ENUM来代理常规的字符串类型。一个ENUM列能够存储65535个不同的字符串值,MySQL
- 这几天一直在看《Pro JavaScript Techniques》,书中有不少优美、健壮代码,让我不得不惊叹老外对语言这东西的研究程度之深
- 前面已经了解了关于PL/SQL编程的基础,本文将结合一个案例来加深对这些知识点的理解。一. 案例介绍 某数据库有两张表,是关于某公司员工资料
- 版本 0.9来自 http://onewww.net说明:当焦点不在表格内的input时,回车键复制最后一行,delete删除键最后一行选择
- System.Data.OleDb.OleDbDataAdapter与System.Data.OleDb.OleDbDataReader的区
- 除了在 Error 对象和 Errors 集合中说明的提供者错误之外,ADO 本身也将错误返回到运行时环境的异常处理机制之中。使用
- 1.怎么样查看数据库字符集 [A]数据库服务器字符集select * from nls_database_parameters,其来源于pr
- 如何用ADO批量更新记录?是的,ADO有这项功能,不过好像用的人不太多(不了解还是不会用呢?):<HTML> &nbs
- 代码如下:<% Response.Buffer = True '一般情况下,当用户请求
- 去年曾总结了《IE对CSS样式表的限制和解决方案》中限制的第4条写道“一个CSS文件的不能超过288kb?”,这是一个疑问句,当时没有重现出
- What's more important to your web site: pictures or text? If you h
- 原文地址:30 Days of Mootools 1.2 Tutorials - Day 9 - Input Filterin
- 经常开发asp但对于细致的说法,真实不太清楚,这里简单的介绍下。一般情况下读取数据都是用rs.open sql,conn,1,1修改数据:r
- 1.JOIN和UNION区别 join 是两张表做交连后里面条件相同的部分记录产生一个记录集, union是产生的两个记录集(字段要一样的)
- 如果没有了解栅格系统是什么,建议看完这篇文章以后再回来。其实有很种 CSS 写法实现栅格系统,很多 CSS 库也都会提供类似的栅格系统实现(
- 你一定想下载一下感兴趣的网页,以便慢慢欣赏吧!利用FrontPage能够轻松做到这一点,甚至可以下载整个站点,当然这里只能下载静态的页面。启
- 设计师在抱怨开发人员不尊重Web标准,后台开发人员在抱怨为什么不可以增加一个空格。PM在抱怨为什么项目总是因为那些看似简单的问题而延期……如