反可用性的UX趋势

原文：http://halls-of-valhalla.org/beta/articles/modern-trends-in-ux-that-ruin-usability,50/

用户体验（UX），是一个广泛的概念，包含了用户对一件可交互物（本文特指“网页”）的表现、态度、情感。它越发受到关注。你的公司甚至可能有专门的UX部门。这已经是个热门话题，因为它确实能显著提升网页浏览的舒适感和效率。

正因为这个话题炒得很热，所以有时人们会做过头，或者简单来说，就是做错了。此处我们将列举一些信众广泛（但其实是错的）的交互设计规则，如果你的网页中了，请不要悲伤；因为他们一开始确实看起来很美。而有些只要场合适当或数量适当，其实是还是不错的。很多点子都是人云亦云，不一定对。现在知错能改就好。

文章分页

这很烦人的。通常他们还搞个倒计时来翻页。很多正经的网站都中了，例如ITNEW.COM

为什么要这样呢，你可知网页跟杂志是不一样的？虽然有些是无意的，但有些却是故意用于增加广告流量的。真是聪明反被聪明误，这种忽略的用户体验的做法反而流失用户。

据研究，第一页的流量远高于往后的页面。证明很多用户其实没有读完。另外，很多用户也疑惑为什么文章没有结论呢？（结论还在下几页啊）。这还迫使用户费时去获取一个全新的完整页面（尤其是移动设备的破网络）。

增加流量还应通过提升内容质量，用户体验。

无限滚动

意思是使用javascript，当用户拖到页脚时，自动在页脚加载下页内容。我承认这很cool。尤其是只想滚动而不想点击的无聊时刻。但如果你是想看页脚的内容呢，那你就要在页脚点得超级快，或者禁止js运行。

DAILYMOTION.COM就在首页搞了个无限滚动，使得曾经无法点击页脚的FAQ。后来他们做了个弹出式页脚才解决了这个问题。而另外一个问题就是，现在只提供无限滚动，而不提供分页，所以如果我只想将第三页的链接发给朋友呢，我要告诉他“你就在当前页面滚三次”？

再试想你用着移动设备（网络烂），你只想看完第一页，但当你拖到底时，它自动加载第二页了！你无法阻止它连接！

无限滚动多是跟风。它真的优越于传统分页吗？顺道，你的广告收入不能通过翻页来增加，除非你的广告合约是按时的。

幻灯片

幻灯片是有可能变得烦人的，但你把它用于正文而非侧栏。通常它们还会做成定时换片。

为什么我要谴责它？很多时候你只想从一堆照片中找出某一张，但幻灯片的显示方式迫使你不断手动换片，他不能一次过全部显示！最后你点了好久，都找不到，只好放弃了。

另外，他们通常基于flash或js实现，没有这种环境的话，完全动不了。

TV GUIDE的做法要好一些，它以列表显示了前后几张幻灯片的缩略图，大概能帮助你找某张特定的幻灯片。

为广告而设计，而非为用户

我们都遇到过这样的经理和销售，他们希望我们能引导用户点击广告，弹出一堆用户不需要的东西。这是他们的职业，没问题，但我们则应该为用户着想。不幸的是，很多设计师忘记了使命。

那是广告还是正文？下载按钮就经常被这样搞，除此之外，很多网站广告设计得很像google的AdSense广告。最终导致用户屏蔽广告，甚至不在上你的站。这其实是违反AdSense原则的——不应将广告与正文混淆，否则你的AdSense账号将被收回。

欺骗用户或许能赚点小钱，但无疑不能再AdSense了。

广告包围正文——我们都见过这种在顶部和左右都包围正文的广告。很恼火的一点就是，你想点击空白处让浏览器回到前台，却点中了广告！据热图统计，很多人为了避开周边的广告，只好点击页面中间。

最终，这将导致越来越多的用户使用AdBlock，并殃及了那些遵守广告规则的网站。不幸的是，管理部的人多是短视的，只想赚快钱。

所有东西都用javascript

js是很cool，很多js做出来的东西对UX都有积极影响。但最近却有很多网站将基本功能也拿js来做，但这是错误的。回想无限滚动，它不仅对UX有反面作用，还是SEO失效（无法抓取js后来加载的内容）。

用户可能因为性能、安全性、可用性（为了无限滚动时能触到页脚）而禁止js，使得页面无法正常加载。js的出错也会导致页面失败。细节就不说了，详见这里：js被禁止了，我需要在意吗？

正文变窄

网页上的留白好比地产，你应有效利用这种珍贵资源。但很多网站都没做到。用小屏幕（如1280*800），看下CNN或者BBC，好像没啥问题，只有很少的留白在两旁。但实际上它的宽度是固定的，如果在高清屏（1920*1080）上看，就有大量留白了。

例如，HEISE.DE，一个著名的德国新闻站。按照它固定的宽度，若你用1920*1080的显示器去看，将有左右合共占50%的留白，那太浪费空间了。

我强烈支持响应式设计和流式布局，让大屏用户有效利用整个屏幕，让小屏用户无需上下左右滚动。

只有移动布局需要考虑点击物的尺寸

这不算是一种趋势，而是一种心智模式。google的page speed tester就建议移动布局需要考虑点击物的尺寸。详情：按钮、链接或表单的尺寸不要太小或者靠太近，不然触屏用户很难点中。

但实际上，现在不止手持设备有触屏，就连笔记本、PC也越来越有了。所以点击物的尺寸，应考虑所有尺寸的设备。

过度使用延迟加载

这是一种设计模式，目标在被需要的时候，才加载进来。对于图片的懒加载，能大大提升性能。但延迟加载CSS，则不一定是好事。

回想刚才提到的TV GUIDE。如果你禁止了js，那么接下来需要用js延迟加载的CSS就不能出现了，所以你会看见一个没有修饰的画面。又或者js的运行出错，也会导致这种结果。

正如上述，延迟加载仅适用于非即时需要的目标，但明显当页面被加载时，我们需要CSS马上去修饰它。至少，我们要同时加载处理浮动元素的CSS（即不跟随滚动的元素）。

结论

实现以上“特性”的网站不一定是差的网站，实际上本文用来举例的网站总体上都是好的网站。但我们应追求最好的用户体验与高质量的网站内容。