一行代码给你的Blog添加下雪效果

前段时间冷空气突袭的时候,据说郊区密云的雪积得挺厚,但北京城内除了飘了一点小雪粒,毫无动静。应该是气温过高所致,我在慈云寺桥附近拍下的照片可以很好的解释这一点。

不过最近WordPress.com倒是提供了一种让你在Blog下雪的方法(原作者是Scott Schiller),只需要将这行代码加在你Blog的任何位置即可,不需要额外的负担:不用自己维护图片和JavaScript文件(WP.com会帮你出带宽费用,哈哈~)

注意:如果你的Blog不支持JavaScript,则无法使用这一效果,抱歉。

引用代码如下:

http://s1.wordpress.com/wp-content/plugins/snow/snowstorm.js

如果希望拥有像我的Blog这样的效果,即让雪停留在某一固定高度,例如我现在将雪停留在导航栏上,只需要引用我修改后的js即可。为了不影响加载速度,放到</body>前面即可。

所有TES主题用户都可以直接使用这个代码:

var aw_snow_jssrc = '%3Cscript type="text/javascript"';
aw_snow_jssrc += 'src="http://vosforever.app';
aw_snow_jssrc += 'spot.com/static/snow.js"%3E%3C/script%3E';
document.write(unescape(aw_snow_jssrc));

其它主题用户,如果希望改变雪落下的位置,可以使用这个代码:

var customizedHeight = 0;
var aw_snow_jssrc = '%3Cscript type="text/javascript"';
aw_snow_jssrc += 'src="http://vosforever.app';
aw_snow_jssrc += 'spot.com/static/snow.js"%3E%3C/script%3E';
document.write(unescape(aw_snow_jssrc));

同时,你可以根据你的页面导航情况自己定义customizedHeight的值,单位为像素,代表雪停留的位置与页面头部的距离。如果设为0,则落下的雪花会停留在页面最底部。

给页面加上Loading效果最简单实用的办法

虽然现在的GMail已经看不到这个效果,但之前那个可爱的深红色Loading仍然让许多人喜爱。我也将这款效果融入了我自己的WordPress主题TES中:

其实我的方法非常简单,也可以说没什么技术含量,甚至还不支持IE6,但据我长期的观察,确实非常实用的。Analytics的统计数据表明,加入了这一效果之后,用户的“平均停留时间”的确有所提高。可见,一个“正在加载”让许多用户都有更多的耐心等待,而不会因为屏幕空白太久而不耐烦地离开。

最近,又有不少朋友留言询问这个Loading的实现原理。这里我就分享一下:

首先,在页面的最上部输出一个Loading文字,比如“正在加载”,用div标签包含,并给它一个id,比如loading:

<body>
  
正在加载

你可以直接放到页面的<body>标签后面,亦可以用script.write输出(如果你有SEO洁癖的话)

然后,在你的样式表中,对这个loading设定一个简单的样式:

#loading{z-index:1;padding:5px 0 5px 9px;
background:#c44;left:0;top:0;width:90px;
color:#fff;position:fixed}

接下来,在你<body>标签闭合之前,将这个loading隐藏掉就可以了。最简单的方法是输出一段<style>标记:

  document.write('#loading{display:none}');
</body>

如果你有jQuery之类的JavaScript库,就更方便了,例如jQuery可以使用:

  $('#loading').hide()
</body>

这样,当页面完全加载完毕之后,loading就隐掉了。

对于WordPress博客,如果你对页面代码没有太苛刻的洁癖,我个人建议把一些重量的JavaScript库都放到这段loading之后引入。这样在浏览器端,你的“Loading”会飞快地出现,用户会觉得你的服务器响应非常迅速。然而,如果你从各种不同的域名下先加载几百kb的JavaScript库,估计用户在你的“Loading”出现之前就已经关闭页面了。

最后,希望这个老土的技巧能帮到你:)

我最期待Google Analytics(谷歌分析)的两大功能

Google Analytics是我最喜爱的流量统计系统。尤其是它多样化、多渠道的统计报告以及多维度对比功能几乎找不出竞争对手。网络上,大多数人也是对Analytics好评如潮。不过,正因为我对它太喜爱,以至于也让我因它始终未能实现期待的两大功能而感到深深地遗憾:

第一,不支持基于img标签的统计

现在Google Analytics的统计模式是基于JavaScript技术的。而这项技术很多人/场合是无法使用的。这就需要基于img标签的统计作为补偿。

img的统计支持一旦开放,我认为Analytics这一产品将不再是个人站长的专利。那些经常在SNS社区内活跃的用户也能通过嵌入一张图片来获知他们的资料页面究竟被多少人访问;而我也能利用这一点更加清晰地洞悉自己博客RSS的阅读情况。目前,我已经使用了GetClicky来做到这一点,但遗憾地是,GetClicky的统计报告还是比不上Analytics的优雅。

第二,无API供调用

对于中小型原创内容网站来说,流量分析并不仅仅是管理员自娱自乐的“后花园”。作为这类网站的管理者,我们更加希望这些经过系统分析之后的宝贵数据能再次直接反馈于用户

例如,如果要统计awflasher.com这个博客里的“每周最多评论文章”、“每月最多浏览文章”,在Analytics的后台得到这些数据易如反掌。然而,这些数据只能在静静地躺在后台里被查看,无法为我博客的读者所知晓。如果换用其他的本地统计插件(例如基于服务器端技术的统计),又恐怕系统负载太大。

当然,这只是一个简单的例子。对于一个能请得起10-20人撰稿人团队的网站来说,真要获取“每周最多评论”之类的数据,即使人肉复制Analytics的结果,也可维护。但如果要结合更多的智能统计反馈动态地改善网站的用户体验,那就只能依靠Analytics的API了。我一直期待能有这样的场景:

例如,我可能需要获知,“通过Google搜索某特定关键词而来到我博客的Firefox的用户他们最喜欢点击侧边栏的什么链接”、“通过豆瓣九点访问过来的IE用户他们是否会点击导航条上的某一个链接”这些复杂的信息来进一步完善用户体验:我可以对那些使用Firefox的老手们隐去“什么是RSS订阅”;也可以让那些对“Firefox”不感兴趣的IE用户完全不被导航上“Firefox”这个分类所打扰。

然而遗憾地是,这些想法,都依赖于Analytics的API来实现。虽然曾有一位英国的工程师通过Analytics自身的邮件报告发给Google Groups再以Yahoo Pipes去抓内容实现了类似的需求,但这弯子实在是绕得大了点。而且经过Pipes那么一绕,GFW的阴影仍然笼罩在我的心中。

总之,默默地期望着Analytics能补充这两项功能,为众人所用。

WordCamp中国:WordPress用户体验改善与SEO的演讲文档

很有幸作为WordCamp Beijing的演讲嘉宾,与大家一同分享我在WordPress用户体验方面所积累的经验。遗憾的是,现场的网络接入非常不好,导致我无法演示在awflasher.com上的实例。我只能尽力“望梅”,但似乎很难“止渴”。这里再次致以最真诚的歉意。另外,据说还有部分Blogger认为我讲的内容不够复杂、高级,这里也感到非常抱歉,因为到场的高手也许不多。更欢迎留言一同切磋复杂和高级的问题。

好在接下来在咖啡厅的闲聊,与很多WordPress用户一对一地分享了彼此的经验,也得知大家对我的优化比较感兴趣,这里就来分享一下我的Presentation:

(由于在Slideshare上传的版本出了故障,大家请看Google和Authorstream的两个版本)

在Google的版本暂时去掉了(因为有用户反应在Reader中会导致页面自动跳转,这种体验太糟糕了)

在AuthorStream的版本:

http://www.authorstream.com/player.swf?p=awflasher-89082-wordcamp-china-presentation-wordpress-ppt-science-technology-powerpoint

你的“密码提示、安全提问”怎么用?

大辉提出过一个关于密码提示的“愚蠢设计”的问题。其实,我也非常有同感。而且大辉提到的关于“正确答案其实就是暴露安全隐患”,我很早就认同:想当年QQ刚出“密码保护”功能的时候,为了保护自己的“安全”,我基本上都喜欢在“正确答案”上面做点手脚。然而,最终真的忘记密码了,还真是狼狈,完全记不住。

后来许多审核机制都需要设置一个“安全提问”,对此我起初觉得非常的不自然。一来,填写正确的答案人家迟早会猜到。尤其是那些“大学在哪读的”之类,人家一看我的简历岂不是瞬间就知道了;另一方面,过于复杂的答案,尤其是与问题毫不相关的答案只会给自己造成麻烦。我现在就忘记了自己QQ号码的安全问题:想了将近一年了,也想不起来。QQ丢了还有Facebook和校内、海内,我并不担心。但是,淘宝、支付宝这些关键账号怎么办呢?

后来我想了一个办法:

不论是什么网站,随便选择一个安全问题,但所有的答案保持一致,或者以某种“算法”来转译这个安全提问应用的上下文(Context)。

例如:在taobao.com和alipay.com都注册了账号。安全提问分别是“你的父亲的生日是什么”和“你最喜欢的演员”(这都是随便选的)。然后回答分别是taobaondfqdsrssm和alipaynzxhdyy。这样的规则一方面有很好的保密性,另一方面也不容易忘记。

这只是我的个人经验,你的“密码提示、安全提问”怎么用的呢?

“邪恶”的获益方式 – 培养用户习惯

抛开产品体验不谈,培养用户习惯是一种(某种意义上)“邪恶”的获益方式。这里我们不讨论复杂的理论,举几个简单的例子大家就明白了。

先看看热恋中的情侣:情人之间都已经习惯了对方的各种特性、行为,从说话的方式、两人之间的暗语到作息时间、情绪的发泄,甚至到牙膏和避孕套的品牌!很多时候,我们经常看到,一些热恋中的人分手之后很快就复合了。原因就是他们已经无法适应没有彼此的生活。

交互产品设计也是一样:让你的用户习惯你的产品交互方式,能在相当一段时间内,对竞争对手和后来者确立一种致命的优势。

用户操作基本模式无非是“单击”、“双击”、“拖拽”、“按键”等等。而许多Web(B/S)产品,包括C/S产品甚至普通的软件、操作系统在对这方面都确立了自己的“门派”:

Digg.com引入了“单击Digg”模式。当越来越多的人开始关注Digg的时候,全美国的人似乎在自己的Blog上放了一个“Digg Me”的图标。恨不得连08年的总统大选,也要走Digg模式。而Digg则更将这种模式应用到新闻评论中(Digg for comments)。这些Digg用户在看其他新闻网站评论的时候,如果找不到Digg图标,他甚至会把这篇文章Digg到Digg.com再来Digg:)

回到十多年前,如果不是Windows 3.0中那个Mouse Tutorial(当时只有640×480的分辨率,256种颜色,而我却为这个简单的动画教程彻底折服),我想,“双击”这个词根本就不会被人们所知晓,也不会有DoubleClick这个公司。越来越多的人无法适应没有双击的操作系统,哪怕是Windows本身在98(似乎是这个版本)加入了“Web式单击执行模式”,仍然有很多人觉得这种改变是荒谬的:当需要执行某一个应用程序的时候,他们的手甚至已经不能进行“单击”这个动作了。

当然,有些时候,这些用户的行为也许会衍变为“强迫症”。但作为运营者来说,他们肯定会不遗余力地让你继续强迫下去(Kevin Rose要偷笑了)。

题外话:

如同粉丝的用户体验一样,用户习惯是一把双刃剑。有一些更邪恶的“习惯培养”:如远古就存在的“赌博系统”,同样是引导用户,进入某一种习惯的轮回。(关于“系统”两个字我为什么要加粗,好好看看这里,建议打印出来看!)

总之,作为一个优秀的、有良知的产品设计师,唯一能做好的,是培养自己手中产品的良性的用户习惯。最近接二连三发生的一些事情告诉我,由商业或者其他不可抗力所造成的,对于另类、邪恶的用户习惯(习惯性欺诈)的培养、引导,不是一个产品设计者所力所能及的:用你的良知和“强大”叫板,最终只能被干掉。

粉丝的用户体验 – 彪悍而悲壮

在这个世界上,没什么比粉丝(Fans,有人又叫它“烦死”)更狂热的了。

粉丝往往有两种:

  1. 生理上的G点被激活而不可自拔
    多见于对帅哥靓女的崇拜。新浪博客首页有不少。忍不住说一下,这方面李宇春和郭敬明特别牛逼。为了不被口水淹死,我就不列举更多的了。
  2. 精神上的G点被激活而不可自拔
    高级一点如罗永浩、王小峰以及他们周围的那帮文艺青年;中级一点的如广大文艺Blogger们,比如来自牛博网的一些牛人们;而再低级一点的如本人的某些娱乐化文章。

粉丝们的用户体验,可以用两个词来形容:

  1. 彪悍
    粉丝们都会誓死捍卫自己的偶像。而且,依照不同的偶像,fans也有不同表现。老罗的fans和郭敬明的fans那绝对是各有千秋的,唯一的共同点可能就是“人挡杀人,佛挡杀佛”。一切顺从的意见都是好的、可取的;一切反对的意见都是错误的谬论。所以基本上没人敢说韩寒的blog用户体验不好,也没人敢说曹颖的Blog用Firefox上不去。
  2. 悲壮
    很悲壮:尤其是非自建站的Blog,劣质的模板,愚钝的留言体验以及铺天盖地的广告……更惨的,就如QQzone了,必须上IE才行。总之有时候我挺想去别人的QQZone留言的,但换到IE,再登录,真的好麻烦……上次看到某Blog的留言需要输入很难辨认的验证码(i、I、L、o、0这些都没去掉),而且还经常弹乱码,速度又巨慢无比,结果几百条留言就那么堆出来了…那几百条留言下,得有多少用户体验失败的骸骨啊。

珍爱生命,远离粉丝。