RELATEED CONSULTING
相关咨询
选择下列产品马上在线沟通
服务时间:9:30-18:00
你可能遇到了下面的问题
关闭右侧工具栏
使用Javascript的考虑
  • 作者:admin
  • 发表时间:18-06-21
  • 查看:

Javascript非常重要,其本意是增强客户端的用户体验,但如果使用不当,反倒会适得其反。比如以下几种情况:

滥用Ajax

最典型的,就是Chinaren的校友录。校友录目前的设计很奇怪:先载入HTML后,再使用Javascript把同学们的留言载入并填充到HTML里。我不清楚其用意何在,但每次打开留言页面都绝对不是一次愉快的体验,一是有时候因为网速的原因,等半天只能看到页面布局而不见留言内容,哪怕我这次来只想看看最新的两条留言也不行;二是如此大范围的DOM修改,再加上页面上原有的乱七八糟的元素,经常搞得Firefox响应变慢。

其实像这种页面完全没必要使用Ajax来载入并填充数据,传统的设计不是挺好?我记得2000年前后Chinaren的设计非常清爽,大面积的色块、线条,整个页面的布局显得井然有序,当时还是我学习和临摹的对象之一。现在的Chinaren臃肿不堪,甚至多次直接导致Firefox崩溃。这还是我启用了Flashblock扩展的情况下,现在我要考虑是不是用Greasemonkey重新设计这个页面了。指望用NoScript访问Chinaren?想都别想。

上图是2001年时Chinaren首页的截图,是从我的光盘备份中翻出来的,你注意到那些不同层次的灰色背景和黑色线条了吗?我当时觉得这样的视觉设计非常棒-现在看起来也仍然不错。

链接到网页还是脚本?

先说校内。

在校内上处理好友申请时,我喜欢批量操作。所以按照习惯,按住CTRL(Mac上按Command)然后在一个个"接受"按钮上点过去,以便分别打开新的页面处理每一个申请。可打开了一大堆页面后发现,这个"接受"按钮分明是链接到Javascript脚本的,这个脚本的作用就是在原有页面上展开一个对话框,来让我填写详细的好友信息。于是我现在所面对的情况就是:数个Firefox标签页,每页中不同好友的详细信息对话框,我在第一个标签页中接受好友申请,第二个标签页中此申请还在,而我则一边操作一遍抱怨为何早不告诉我可以在同一个页面上操作。

今天校内发布了新的设计-他们也意识到这个问题并改掉了。目前的设计很棒,"接受"不再是一个链接,而是一个真正的按钮(input标签),上述问题也就不存在了。

当然这个问题相当普遍,如果要对那些有问题的设计做出改进的话,校内的做法值得借鉴。



这个网站本身如何我就不评论了,反正我是被它的垃圾邮件烦得不行,索性注册并试用了一下。登录进去的10秒之内我就感觉非常不爽,因为它的导航链接完全使用了Javascript。我不能打开多个标签页同时查看它导航里的各个内容,通过滥用Javascript,开心网完全剥夺了我的这一权利。我仍旧无法理解把好端端的、标准的、简单的HTML链接替换为Javascript的意义何在。

可访问性(accessibility)一塌糊涂

Web Accessibility Initiative(WAI)对可访问性的定义是"残疾人也应能够使用网站(Web accessibility means that people with disabilities can use the Web)",其实这个定义本身是不够全面的,因为WAI自己也说可访问性也应包含对非残疾人的考虑,比如支持键盘操作以提升专家用户的使用效率等。

但目前的网站太过于依赖Javascript了,把Javascript一关,很多网站直接瘫痪。好的设计应该具有比较强的包容性,这有点类似于程序中的容错能力,无论CSS/Javascript是否开启,网站应至少提供最基本的功能,而不是直接使用户无法访问。