摧毁用户体验(2)_网页设计教程

推荐：我们还需要“面包屑”吗？
前几天看了Angela写的论“面包屑”的倒掉，感觉她的分析很多地方我还是比较赞成的，谈到了“面包屑”的一些缺点和弊病，但因此就说“面包屑”应该倒掉，我

　　在泼水之前想一想
　　
　　作为网页设计师，我们已经塑造了自己的形象，我们面对用户的需求时简直就是瞎子。我们所能做好的事情就是去猜测他们可能的需求，并满足每一层次的需求，尽可能给他们最好的用户体验。这就是Progressive enhancement起作用的地方——我们需要考虑每一个层次的需求并考虑如何满足他们。

　　第一层：不要多余的装饰

　　有一些用户只想阅读内容。他们可能在使用移动设备，想要打印一些信息，或用一些附注设备浏览web——他们甚至有可能关闭了图像功能。让你的标签清楚、良构和有语义对这些用户来说是十分要害的。他们想要的是轻量的，快速下载的、不分散注重力的页面。

　　第二层：漂亮

　　有一些用户想要有一点窗花或者是一片柠檬。为这些用户，你可以提供一个设计美观，布局良好的网站。你甚至可以添加一些花朵或者是一点Flash特效来取悦用户。只要你的设计没有打乱页面内容的优先级，在浏览器测试中留心一些，再提供其他设备的CSS，你就应该赢得金牌。

　　第三层：尽情发挥(Make it sing)

　　有一些用户可能希望全部功能，对于这些用户，你可以全力以赴地构造一个“Web2.0，哦我的天啊”体验的站点(Web 2.Oh-my experience),黄的褪色、滑动widget、还有Ajax，能用的全都用上。

　　不过别忘了，层次划分的并不那么清楚。你可能要支持一个介于一、二层之间的中间层，给Netscape4.0和IE5/Mac提供一些基本的打印样式和颜色。或者你可能考虑给支持JS的浏览器添加一些JS改进，在二层和三层之间加点奶油果仁。

　　默默地行动

　　一旦你确定了粗略的层次，你就可以开始构建你的网站了。

　　从内容开始。有时设计师和开发人员忘记了这才是人们访问站点的原因。把它雕琢地可读，并且在呈现给用户的时候，要尽量减少分散注重力的事物，就像摆放地很好的一道菜；别像自助餐一样把东西简单地堆积到一起。你在内容上下了大工夫……突出这一点。

　　调整完内容之后，你就可以开始确立网站的外观和感受了。使用你把握的各种技巧，定义站点样式以满足每一层的用户；对老版本的浏览器隐藏一些CSS文件，给需要非凡照顾的浏览器一些专有的处理。条件注释在这一领域内已经十分流行，但是看看老的@import和特定的媒质组合，它答应你有选择性地给老式的浏览器提供一些非凡照顾。

　　一定要考虑内容在打印设备和移动设备上的呈现方式。你给他们提供了专用布局或是基本印刷排版和色彩调整吗？你如何处理图像？表格？试着猜测以下一个手机用户会想要哪些功能，然后再删除冗余以简化体验。假如你设置:hover的样式属性，被忘了给:focus定义同等的考虑，键盘和手机用户会为此感谢你的。

　　一旦设计综合起来，添加一点聪明的JS。你已经知道利用对象和方法侦测的方法来确定一个脚本是否可以在用户的浏览器中运行了。但是考虑以下你的脚本如何与收藏夹和后退按钮等常见的浏览器接口相交互。而且不要忘记了脚本间的依靠性。假如一个脚本工作而另一个不工作，你的网站会不会不可用了呢？

　　假如你在制作一个widget或其他的界面控件，添加一些额外的标签，只要你希望widget运行的时候，其他的情况能保持一切正常。假如你把 widget相关的CSS从JS中分离出来以标准化时，确定CSS在脚本只是widget可运行以前是未被激活的。一个好的办法就是使用类名替换(见表 1)。

　　最后，假如你计划使用Ajax，一定要谨慎。用Ajax读取页面的所有内容是完全不必要的；他会成为用户和你的内容之间的一块挡路石。而且，它还会增加服务器开支，让你的内容不能被搜索引擎收录，使你的网站对那些使用屏幕阅读器和大多数的手机用户不可用。

　　别误会我，Ajax有用武之地，但是重要的是一定要了解Ajax应该用在何处，更重要的是知道哪里不能用。

　　总结为一条

　　仔细地猜测用户的需求并，且尽可能不引起注重地解决这些需求是最可能留下良好印象的。就似乎水杯一样，你的用户永远都不应该需要招呼服务员来倒水。

分享：[总结]2007年网站设计的风格
06年网页设计在web2.0的影响下呈现出一些特点，渐变使用，希奇的名字（del.icio.us），对角背景的运用（stumbleupon）,大字体和像素字体的使用，logo倒影。在过