给页面加上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”出现之前就已经关闭页面了。

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

WordPress2.7的XMLRPC Comments API会颠覆一些SNS领域的规则么?

在“关于WordPress 2.7你最喜爱的新功能官方投票”里,WordPress2.7的新功能“XMLRPC Comments API”仅获得了1%的支持。不过,这个API的意义还是非常重大的。

光是与IntenseDebate的集成我们已经可以预料到未来的评论系统有多强大了。如果说WordPress颠覆了传统网络媒体和人们表达声音的模式,那么XMLRPC Comments API很可能会颠覆SNS的游戏规则!

细节方面,我认为可能集成一些身份整合服务,openID或者其他Passport,例如强大的Google ID,而评论系统本身的交互性、立体感也会更好:Rating、Digg等可能的设计都会集成过来(例如我就比较喜欢牛博网的“支持”和“反对”);数据统一化之后,IntenseDebate更能帮助管理员统一地分析、处理这些评论,将Spam的几率降低到极限。进而让Blog的信息质量和交互效率提高相当的程度。

反观SNS,流量最高的仍然是日志照片Profile页面,交互性最强的仍然是好友之间的留言。而Social App,说的好听点,任重而道远,你认为一个人会在好友买卖上连续玩3个月么?我也认识一些朋友通过抄袭Flash和他人创意挂广告赚了不少钱,但他们都知道这不是长久之计。信息的原始产生者会牢牢把握住内容的,抄袭者迟早要缴枪, 

说一个题外话,XMLRPC Comments API对于管理体验来说,也是有潜力可期待:Adobe在刚成立(感谢老友7yue提醒)的AIR官方Blog中就提到一位叫做Daniel Dura的平台evangelist(布道者)制作的AIR产品“Moderator”。遗憾的是在2.6由于没有XMLRPC Comments API支持,安装起来不够完美(需要独立安装一个plugin)。但有了XMLRPC Comments API之后,安装插件、管理评论会变得非常轻松:)

当然,这一切都还需要时间,但我相信会有一天,这篇文章中所陈述的一些观点会得到证明:)

PS:虽然我和Automattic有项目合作,但那也是基于单个项目的,我介绍的Automattic和WordPress的内容纯属爱好。我不怕被人说我在为谁打广告,我只是在按照我的真情实感陈述一些事实而已。如果你不喜欢(例如很多人认为我对MSN的批评过了)你可以建立一个Blog来发出你的声音,然后往各大媒体投稿淹死我:)

为WordPress博客集成IntenseDebate服务

IntenseDebate是一款由Automattic刚刚收购的服务,可以有效地提升Blog评论系统体验、质量以及提高站长的管理效率。

在管理页面找到这个链接:

目前集成IntenseDebate需要邀请码(今天有幸收到)。如图:

然后就会看到安装向导:

安装完毕之后去setting即可。我的blog目前正在调试。

十分抱歉,目前评论的数据库同步遇到了一些问题,这篇文章暂时无法评论,不过也发现了一个很不错的的答疑系统……

WordPress 2.7集成开源项目SWFObject、SWFUpload及其他

刚刚从SVN更新了最新的WordPress2.7,看到这么几条:

我顿时反应过来,这就是著名的开源项目SWFObjectSWFUpload,分别是SWF嵌入脚本(将Flash嵌入网页)和SWF上传脚本(利用FlashPlayer API上传文件,可支持批量上传并跟踪进度)。其灵活性、可维护性、稳定性都非常优秀。目前,这两个项目均是Google Code托管。

了解Flash技术的朋友应该对SWFObject不陌生了,这是一个历史悠久的开源项目了,在微软对SWF嵌入进行了很无奈的“单击激活”检测之后,顿时流行起来。我也有幸参与了SWFObject 1.5简体中文版的文档翻译工作(目前已经升级到2.0并由Google Code托管,地址见上文)。

而SWFUpload,则是我去年秋天关注的一个新兴项目。它的前身似乎是叫做“mmSWFUpload”。众所周知,Flash8之后提供了基于文件的API,而在Flash9(ActionScript3)之后,这款API得到了极大的完善和规范。同时,2005年发布的Flash8本身又提供了一个ExternalInterface的接口,这样我们很容易地能够让JavaScript(其实就是DOM,通俗地“HTML”)和ActionScript互动。进而,就有了mmSWFUpload这样一个项目:让上传的界面完全用HTML呈现,用户在页面中的体验更加统一化。

说到这里,还有一个小故事:2007年秋天,这个项目还只有ActionScript 2.0的版本,我当时曾看过其源代码,并不是特别满意,而且官方也一直没有更新。正当我刚刚自己动手写完ActionScript3(当时也正在建立as3blog.com)的脚本时,官方突然放出了ActionScript 3的API,令我颇为郁闷。

WordPress自从1.5版之后,在插件和内核方面都有长足的进步,尤其是Automattic开放性和兼容并包、兼听则明的特点,我认为很可能会是互联网寒冬中活的最好的一个企业:看看TechCrunch和Facebook正为新闻稿和融资(传言)忙的不可开交,而Matt Mullenweg同学却悠闲地从北京到上海,从柏林到夏威夷,进行着他作为WordPress evangelist的环球旅行呢。没错,WordPress的理念并不是“一家独大”,而是“百花齐放、百家争鸣”:这一点,我想TinyMCE项目的负责人应该更清楚:)

将你的WordPress博客与LinkedIn进行同步

最近,WordPress官方提供了一款在LinkedIn(扫盲:什么是LinkedIn)的应用能够同步你的WordPress博客到LinkedIn的Profile页面。

具体步骤非常简单:

一、在LinkedIn的Application目录中找到WordPress的应用(Application目录地址

二、添加这款应用,点“Add application”

三、输入你的WordPressBlog地址:

这里推荐使用第二种方式“Show only recent posts tagged LinkedIn” ,以尽量避免干扰视听的私人日志和不相干的文章对访问者造成干扰。

四、应用会自动进入预览状态:

五、在Profile页面就可以看到内容了:

不过,由于目前这款应用还是刚刚发布,因此问题很多,例如中文字体以及布局方式不可控(也许是LinkedIn为了保证consistency吧)等等,因此我暂时去掉了在Profile页面的展示。看看日后这个应用有没有什么改进:)

官方发布的WordPress用户体验调查报告(PDF)

也许有很多人为WordPress在2.3之后的管理界面跳跃赶到奇怪。的确,从2.5引进了全新的配色设计之后,在2.7又把“上-下”导航换为了“左-右”模式,这让我在使用2.7(SVN版)的初期也感到非常不适应。

不过,今天看到WordPress官方公布了其原因:这次的修改的依据是一次非常专业的用户体验跟踪测试,而且Automattic的用户体验团队为了避免收集到的部分意见可能给整个社区的需求造成“失衡”,聘请了Ball State大学CMD(媒体设计中心)的专家一起进行了两轮(5月和7月)用户体验跟踪测试。

这里可以看到一份非常详细的调查报告。(PDF下载地址,请自行穿墙)

我最近太忙,扫了一眼,截几张有趣的图如下。

Dashboard(管理中心)的用户注意力分析:

发文的用户注意力分析:

注意看到,这位测试志愿者在发文时遗忘了填入Meta Data,转而重新编辑了这篇日志。

据说新的管理界面在新老用户中均赢得了喝彩,而就我目前参与的一个WordPress企业级项目中,已经尝到了2.7版新导航的甜头:更便捷、准确的导航菜单和文章管理系统比横向导航更快。

关于Automattic的一些八卦

今天和Barry闲聊,我问了一些关于Automattic的问题。得到一些有趣的信息。想到我这里也有很多WordPress的爱好者会光顾,就分享一下吧:

  1. Automattic旗下一共有900个服务器,服务于WP.com, WP.org, Akismet, Pingomatic, gravatar20台), polldaddy, intense debate这些项目;其中,有90%的服务器服务于WP.com(Automattic的一个BSP项目)
  2. wp-super-cahce的作者Donncha O Caoimh是最早一批的Automattic员工,在2005年加入
  3. Automattic中负责在支持社区(Support forum)回答问题的工程师叫做“Happy Engineer”,他们会全职负责问题解答和故障排除
  4. 在美国,WordPress.com仍然与Blogger.com的博客服务数量有着差距。但在活跃度和成长趋势上,与Blogger.com基本持平
  5. 在美国和在中国一样,大多数人还是懒得去开一个“专业的博客”。不过,WordPress.com也获得了越来越多的用户
  6. 工程师在Automattic的工作流和Google很像:每一个人负责一个项目。(在微软则是PM严格把关,Engineer仅负责执行)

大家还有什么关于Automattic的问题可以留言在此,我闲暇的时候也可以拿去骚扰Barry同学:)

WordPress 2.6.3发布,更新一个主要文件

这次更新主要是由于一个名为Snoopy的PHP库爆出了一个漏洞,而WordPress主程序在Dashboard(也就是管理主面板)中显示RSS内容的功能则使用了这个库,因此也受到影响。需要更新的文件是:

  1. wp-includes/class-snoopy.php(Snoopy的漏洞修补)
  2. wp-includes/version.php(修改版本号)

不过,由于这个库仅对Dashboard才有作用,因此普通用户也不必担心它会带来多大的危害。我觉得,WordPress安全性最大的弱点仍然在目录权限和插件、主题的使用方面。这必定要依靠WordPress的lead developer引领整个社区的插件、主题开发者一起重视这个问题并编写效率高、可靠性强的代码。

到底有多少留言是Spam,Akismet告诉你!

Akismet是Matt Mullenweg早期创办的一个项目,现在已经是Automattic公司的一个专注于剿杀垃圾评论的产品。我非常欣赏这种集众人之优势来对抗恶势力的做法。相比SK2,Akismet更灵活更强大,使用更简易而且有“学习性”(与时俱进)。例如:某Spam发送者到10个WordPress博客群发垃圾广告,而这10个博客中如果有5个安装了Akismet,而这5个blogger中有3个将这条垃圾广告标记为了“spam”,那么剩下的受到Akismet保护的系统都会将你拒之门外(IP、网址、昵称,whatever~)

目前,由于垃圾评论的发送成本越来越廉价,尤其是某些“公司”然能用5毛钱就请到一个发spam的人,垃圾评论已经占据了所有互联网评论中的绝大部分,看Akismet带来的图:

这里可以看到最新的实时统计;这里有更多我曾经写过的关于垃圾Spam的文章。

Automattic收购在线投票服务PollDaddy

Automattic继收购Gravatar(扫盲:什么是Gravatar)和intense debate之后,近日又收购了PollDaddy。这是一家在线投票系统提供商。这实在是一件令人振奋人心的消息。

现在WordPress.com用户已经可以在第一时间体验这个Web产品了,而独立WordPress博客也可以在这里下载一个插件来做集成。不过由于目前PollDaddy对中文支持欠佳,我并没有安装。

我第一次见到PollDaddy的产品是在LostPedia的首页,令我惊讶的是,这个专业的投票服务产品居然是一个只有两个人的团队(补充:官方日志提到是2人,但公司介绍是4人,有待考证)!而整个Automattic公司也只有30个人。当然,Automattic和WordPress的开源哲学也造就了无数的贡献者来为它添砖加瓦。

另外,也许因此我喜爱的wp-polls插件就要考虑退休了。毕竟,PollDaddy会提供比目前wp-polls更加全面的投票管理系统。无论是前端呈现形式,还是数据管理和数据分析,“投票”这一功能将会让WordPress如虎添翼。

最后我想说的是,Automattic的确在为我们每一个人打造一个强大的Blog系统,尤其当一向“瞧不起个人blog”的SNS鼓吹者们从“一夜暴富”到现在“全球萎靡”、“尔虞我诈”的状态之后,个人博客又一次成为了这场江湖恩怨的避风港。这也是为什么我一直不愿意在BSP开博的原因。纵然一年投入几千元人民币和辛辛苦苦的维护精力,但的确能换来一方净土,这还是很值得的!

PS:我作为第三方开发者与Automattic的合作也在顺利进行着,之前为WordPress VIP用户所制作的一个项目已经上线(可惜在中国地区看不到),在接下来的一段时间,我会投入Gravatar的一个主功能开发。作为一名中国的Web开发者,能将自己的代码和创意贡献到世界级产品中去,有压力,有挑战,但也是一种无限的乐趣。