菜单:单级 or 多级?级联的菜单Web上很常见,但我想它的最初来源应该是桌面系统的windows菜单。到底这种级联式的菜单导航好不好呢?我的答案是很不好。当展现一个页面给用户时,我觉得应该把当前页面的可用功能以及通过当前页面可访问的资源尽可能直接的展现在用户的可视面积里,级联菜单恰恰违背了这一点。级联菜单的一个特点就是在提供导航功能的同时,也将同一模块的功能(页面)组织在了一起,形成了一个主子关系;但是它的最大弊端就在于用户要hover一下才能访问到子资源,如果是多级级联的,那会更痛苦,且不说有的初级用户可能根本就不知道该去hover。所以我觉得可以通过在页面里显性的放置子链接导航来代替级联的菜单。

Button & Link:从技术层面上讲两者是可以通用的,Button可以用来导航到其他资源,Link也可以用来触发一个click的操作。但是从UI设计上来讲,如果是button的功能,就要用button的样式,即使你用的是link也应该用css来控制成button的样式。大体上来讲,执行submit功能的按钮应该尽量用button样式,而起导航作用的按钮应该用link。所以ASP.NET里的Button,LinkButon,HyperLink不要乱用。

导航 从哪来回哪去:HTTP的一大特点就是可以通过一个URL导航到WEB上的任意资源,所以也要组织好自己的web程序的导航,否则会给用户混乱的感觉。如何组织,我想基本的原则就是从哪来回哪去。例如对于两个功能模块,客户(Customer)和联系人(Contact),对应两个列表页面,cusoter list和contact list,每个页面又有对应的增改子页面,这些子页面在增改完成后默认的应该跳回到主页面,这是显然的。但是当你查看customer详细时很可能会在下方列出对应的contact,并且会有一个新建contact按钮,点击这个按钮进入新建contact页面,添好信息保存后该回到哪呢?显然更合理的是回到之前的customer详细页里,而不是回到contact list页面里。所以页面的导航不能hardcode到代码里,要大体上遵循哪来哪去的原则。

列表的行操作按钮位置:DataGrid,GridView默认都把命令按钮(Delete、Edit Button)放到列表的左侧,以前感觉很别扭,还会特意把它挪到最右侧,后来看到很多系统也是这么做的,包括Salesforce。仔细想来,这么做还是很有其道理的。我们使用鼠标时,向左移动光标要比向右容易(当然是针对右手使用鼠标的人来说),而且大多数情况下,我们鼠标的放置位置都是在屏幕的左半区,所以放到左侧,用户操作起来会更方便。

界面设计是很琐碎的细微的工作,但也是很关键和重要的,简单方便符合大多数用户习惯的UI是一个好的应用的前提。由于Web客户端受限于浏览器,所以Web的UI设计就显得更为重要了。

To be continued......

相关文章: