为了更方便阅读网页(“Improves readability”),有人专门针对Lifehacker.com(我每天必看的网站)页面写了个Greasemonkey用户脚本,把多余的页面元素删除掉(“Removes various elements from the Lifehacker site”)。

猜猜看Lifehacker的反应是什么?

It removes too many elements of the site’s design, but this custom Lifehacker user style is still a compliment. You like us enough to mod us!

稍微有点不满意(删除掉太多页面设计元素了),但这对Lifehacker.com还是一个认可,因为用户喜欢Lifehacker到了改装页面(mod的感觉没翻译出来)的地步。

所以:

  • 如果有用户用user script改装你的页面,那这是一件好事情(你提供了他们不愿意放弃的内容),同时也是一件需要考虑的事情(页面设计也许太花哨或者色彩搭配不够好);
  • 页面的mark up不能太复杂,否则user script不好写 ;)
  • 页面的mark up不能经常变动,否则user script会失效;

这就让我想起几天前看到的一句话:

Your Markup is an API. With all the hype about APIs and mash-ups, it’s easy to forget that your HTML is also an API, and your users are experimenting with it right now.

Matthew Magain

但页面设计和编写的重要性绝对不仅仅在为了考虑用户使用Greasemonkey user script(毕竟这样用户比例特别小),在结构化的数据的发布和读取上,尤其是microformats的推广更是证明了“页面是API”。下一个版本的Firefox,Firefox3.0,已经在考虑集成对microformats的支持,这里有一些Firefox3在支持microformats的用户界面设计模拟图,已经包括hCard, hCalendar等格式。

话说回来,无聊一下,如果写Greasemonkey user script来改装网页,你会改装国内的哪个网站?怎么改?

Web2.0, WebDev @ 21 November 2006, “10 Comments”

我一直认为网页标准的普及和支持是Web2.0发展中的非常重要的推动力量之一,一是CSS让网页设计和维护更容易,二是Javascript让用户互动更友好,这使得更简洁更友好的web 2.0界面更流行更受欢迎。

同时,越来越多的控制转移到了用户手中,比如Firefox的NoScript扩展让用户可以关闭或者开启所有或者某些网页上的Javascript。这就使得一些网站的页面在Javascript被关闭的时候,不能或者部分不能使用。例子:在豆瓣上对东西评价打分的界面在关闭Javascript后就失效了,似乎也没有其它手段可以做评价和打分。

这是不是有点吹毛求疵呢?那再看看Amazon上类似页面的处理,用户可以对一件商品做评价,和标记自己是否拥有,界面如下所示:

amazon page with javascript enabled

也是使用了Ajax,不需要重新载入页面;把Javascript关掉,刷新页面,由于Javascript被关闭,页面此处则显示一个“Rate this item”的链接,链接到的页面出现以下这个界面,一个简单的“web 1.0”的表单:

amazon page with javascript disabled

这就是“可降解的”(Degradable)Javascript的应用的例子,在浏览器不支持或者不完全支持Javascript的时候,仍然能够正常展现和提供页面所有功能。虽然用户体验不如Javascript开启的时候好,但用户仍然能够完成他想要做的事情。

需要关闭Javascript么?有些情况下,是的,比如出于速度和安全的考虑,比如使用不支持或者完全支持Javascript的浏览器(不,不只是Lynx,还有移动终端上)。更重要的是,不能因为用户选择关闭Javascript,就不让他们使用到某些功能。尊重用户的选择,这应该更是web2.0的精神和力量的所在吧。

那么,既要支持javascript被关闭的情况,又要有Ajax,会不会增加开发的难度呢?Jeremy Keith, DOM Scripting的作者,不这么认为,在他的书里也提到Progressive enhancement(渐进增强)的开发过程和Hijax的手段,简单地说,就是

  1. 首先以传统的或者说web1.0的方式设计和实现网页;
  2. 在1的基础上,添加Javascript实现Ajax,优化用户互动;

因为即使使用Ajax,所有处理还是在服务器端完成的。更多关于progressive enhancement和Degradable Javascript可参考: