现在公司正在做企业在线软件,我也参与了其中的用户体验的工作。在这个软件中大量用了层的表达效果。包括新增、编辑、导入、审批等操作都用到了层,几乎所有需要弹出的页面都是层,所有的操作也几乎是在层中完成的,更复杂的是,在层中还可以进行相关操作,再弹出二级层,二级层里还会弹出3级层。。。由于每一层都有独立的外貌(前期没有规划好),而且在线软件的权限和操作步骤都极其复杂(可能是需求搞复杂的),技术们的技术也实在有限,所有层的效果是用frame做的,这就导致了后面的一些问题。
下面我还是说一下不选用打开新页面的形式,而是选用弹出层的初衷吧:
- 层的好处在于让用户感觉自己没有离开当前页面。在操作过程中用户不用跳转页面,在当前页面下就可以看到需要看到的结果(虽然也需要刷新页面,但是给用户的感觉是我没有离开当前的页面)
- 使用层更加迅速。刷新层的方式比刷新页面的方式更快。
- 这种方式不会被浏览器拦截(打开新页面的话有可能被拦截)
- 拒绝n多标签。打开新页面的方式会导致浏览器中满满的页面标签,不知道该关闭哪个,查看哪个(淘宝就是这样的)
虽然有上面的许多好处,但是层也有很多后遗症,在后期很难弥补,有些甚至是致命伤:
- 层的速度并不快。由于是利用 frame制作的层,所以层的载入效果并不是很快。
- 三级以上的层操作让人迷路。在新页面中继续的操作是很正常的事情,虽然会有很多的页面,但是用户不会迷路,因为会有各种导航告诉用户在什么位置,而在层中,由于受到空间的影响,并不能很清楚的告诉用户位置。(前面的层会压住后面的层)
- 层的空间太小。层的空间相比于新页面来说实在是太小了,我们的软件有很多需要填写大量的表单,有时层中会出现滚动条,甚至是横向滚动条。这就让用户阅读起来很费劲,而且给人一种压迫和不稳定的感觉。
- 层中的滚动条与页面的滚动条冲突。由于页面在1024下并不能全部显示,层中又可能出现滚动条,所以当滚动层中滚动条的时候,整个页面的滚动条有可能会动。
- 刷新页面,层就会消失。由于使用 frame做的层,刷新页面时,前面的层就会消失。
- 不能做到,层保持显示,后面页面数据刷新。这个问题解决起来有些复杂。就是说当我新建1条数据时,点击“保存并新建”,这是将显示一个新的新增页面,但这时我不想再填写数据了,点击了“取消”(取消定义为关闭层,不刷新页面),这时关闭了层,此时看到的效果是页面中并没显示刚新增的第1条数据,因为取消并没有定义为刷新页面,而在我填写第1条数据,点击“保存并新增”时也不能做到同时刷新后面的页面(只要刷新后面的页面,前面的层就会消失),所有页面在整个过程中没有被刷新过,所以前台页面也不能看到这条数据,只有用户手动刷新一下页面才会出现。解决这个的问题的方法是将取消定义为“关闭并刷新页面”,这样会导致服务器负担和用户的等待时间;再有就是利用阿贾克斯技术,由于阿贾克斯不稳定,我们软件的操作较为复杂,所以这种方式也不好。
- 层中若有滚动条的话,层下面的数据有可能被用户忽略。
总结。下面就总结一下我对于层应用的理解和建议:
- 层中不宜有大量的数据填写功能,更不宜有过多级的层操作,最好是保持在两级层以内。
- 层中的操作尽量简单,如可以在层中查看、登录。
- 层中应尽量避免用滚动条,如果不可避免的话,就要考虑层中滚动条与页面滚动条的关系,最好两个之中只有一个有滚动条。
- 层中若有滚动条的话,应尽量让用户得知层中还用隐藏的信息,滚动条应做的明显,或是将保存、取消按钮放到内容下面,拉动滚动条到最下面才能完成操作,或是在层的内容区域留有半截的数据在边缘显示,告诉用户下面还用内容。但这几种方式都不是很好。
- 新闻类的查看,大篇幅的文字图片查看不应放到层之中,会让人阅读起来觉得很压抑。
- 最好能做到层中数据保存,不关闭层,后面页面的数据可以更新。但是据技术说很难做到。我曾经看到过这种操作的,但是还是很慢。
- 在决定用层时,需要规划好层的布局,避免太多的样式。
以上就是我对于层的一些总结,希望对于其他人有帮助。不对的地方欢迎大家指出。
写于2008-12-03