Category Archives: 业界杂谈

业界杂谈 日志

LAMP人分享交流会

昨天长途跋涉去中关村参加了“第13期#LAMP人#主题分享交流会”,感觉很不错,对得起一天的时间。

这次是木瓜移动专场,第一场是关于移动游戏市场的,与技术关系不大;第二场“社交网络动态框架”,内容实际是web开发在手机客户端的应用;第三场是在讲使用木瓜移动平台做游戏,讲游戏平台前,有一大半时间是在将计算机视频处理~~~汗,技术含量太高了,听了个热闹;最后还有个Any Share环节,分别是phonegap介绍和svn的使用小技巧

收获最大的是第二场,由木瓜移动的研发总监李章晶讲的手机客户端如何与web开发相结合。不同于简单的webview,他所说的方法,将手机客户端与webview结合的更紧密,使用高度定制化的浏览器:1. 客户端会保存web页面的html等资源,并结合svn自动更新  2. webview的ajax请求实际是走的客户端的tcp,节约了http的连接时间  3. 客户端和web页面通过js交互,使更新页面内容变得很简单~~~不懂客户端开发,具体细节记不清了

另外,后面的PhoneGap介绍,也是蛮有吸引力的的,可以使用html/js/css开发跨平台的手机应用,有时间的时候会去做些尝试

整体感觉,昨天下午比之前参加两次百度技术沙龙的收获更多。后者的分享基本是分享者在讲自己的东西,听者只能是借鉴一些共通的经验;而昨天下午的技术分享,基本都是就技术论技术,特别是第二场李章晶的分享,确实是在给听众介绍实际的方法~~~还有最重要的一点,前者是有小礼品的 ; )  ~~~当然,这里没有贬低百度技术沙龙的意思呀~~~分享思路不同而已

Hello World 业界杂谈

书签里的js

如要你要去现在很流行的花瓣网去注册,会发现其中有一步,是让你将它的一个“采集到花瓣”的链接添加到你浏览器的书签里。当你使用这个浏览器再浏览其他网页时,点这个书签,就会弹出花瓣网采集该网页图片的界面~~
这是一个很nice的功能,已经有点类似客户端了,把这个书签里的“链接”拿出来,整理一下:

function(d,a,c,b){
	//首先检查document里面是否有'__huaban',如果没有,就去加载一段自己的js
	if(a[c] && typeof a[c].showValidImages=='function'){
		a[c].showValidImages()
	}else{
		b=a.createElement('script');
		b.id='huaban_script';
		b.setAttribute('charset','utf-8');
		b.src='http://huaban.com/js/pinmarklet.js?'+Math.floor(new Date());
		a.body.appendChild(b);
	}
}(window,document,'__huaban'));

对,这段代码就是取加载一段花瓣网自己的js~~~~~~ :twisted: :twisted: 在别人的页面上注入一段自己的代码,然后它就可以为所欲为了:除了抓图片,抓视频,还可以取cookie,修改页面css等等
除了书签外,还可以直接在地址栏执行js的逻辑,比如:javascript:alert(document.title);
其实,把js放在书签里,只是浏览器地址栏执行js的一种表现而已

Hello World 业界杂谈

整站ajax中url的处理

早在两年前,互联网中的网页数量就已超过了1万亿,并且,每天还会增加数十亿。虽然是如此浩瀚的世界,我们却可以通过url轻而易举的找到每一个页面,可见url对于网络世界时多么的重要。

随着浏览器的进步和对用户体验要求的提升,整站ajax之类的一站式前端应用正在逐步取代传统的一个url对一个页面的展示方式。在整站ajax中,数个模块在一个url下,采用无刷新的方式切换,通过减少页面刷新有效的提升了用户体验,但也带来了一些问题:

1. 某些用户习惯根据url判断自己所在的位置,如果明明点击了链接,页面变化了,url却没有变化,用户会比较晕

2. 用户保存书签后,在打开这个书签,得到的可能并不是自己想要的内容

3. 模块间切换后,不能使用浏览器的回退键退回去

针对上述问题,比较简单的方式是使用锚点做标记:每个模块切换时,锚点都会有所变化,比如:/index#list,/index#edit,这样,可以有效的解决上面提到的第1个问题;对第2个问题,前端代码初始化时根据当前页面的hash做些处理也就行了;第3个问题稍微麻烦一些,需要监控页面url的变化。

浏览器不可以给地址栏添加监听时间,只能通过定时读取location.hash/href来判断锚点是否发生了变化。定时长度不能太长,否则影响用户体验,也不能太频,会耗太多资源。这种定时的方式虽然很土,但出了“坚挺”浏览器是否回退、前进以外,却还可以减少很多绑定链接click的操作:只需要给按钮链接的href加上锚点,将参数写在锚点里,用户点击这个url时,锚点变化被定时程序“监听”到,就可以执行相应的逻辑(还顺道解决了按钮重复点击的问题,一举多得呀 :-) )。关于如何把button按钮转变为锚点链接的点击可以参考本人以前的博文:js触发链接

不过使用定时方式“监听”浏览器回退,还有一个无法解决的缺陷(只是本人还未发现解决方法),IE6/7的锚点跳转记录不会进入history对象,也就是在IE6/7里,有A页面进入B页面后,B页面内由/B跳到/B#1,再跳到/B#2,再“回退”,也还是会回到A页面,无法回到中间的/B跳和/B#1…….IE而已,可以暂时不去理它。

前面说,使用方式监听地址栏变化有些土,那么,有跟好的办法吗?

之前转发的一篇博文(使用ajax和history.pushState无刷新改变页面URL)里提到了html5的一个新特性:可以注册“popstate”事件监听url的变化,我们可把前面的定时“监听”稍作改进,如果浏览器支持popstate,就使用popstate,如果不支持,在使用定时。本人测试表明,firefox、chrome、safari支持popstate事件,IE系、以及opera不支持。

———-End

业界杂谈 他山石

[转]抓大放小,从粗到精

作为产品经理的你,洋洋洒洒的整理完产品的功能列表,长舒一口气,看,爷的产品多强大,规划了这么多牛掰闪闪的功能;作为交互设计师的你,头晕眼花的画完产品的原型和流程,暗自窃喜道,看,咱的流程多细致,梳理了那么多特殊情况和可能性;作为视觉设计师的你,设计了好多个华丽丽的界面,你为每一个页面进行了精心的雕琢,期待用户见到每一个页面都竖起大拇指说这个界面真漂亮;作为开发人员的你,搭建完框架之后,发现每个模块都有评审时漏掉的细节,一个模块一个模块的赶进度,导致你精疲力尽力不从心。

其实,在一个产品里,并不是所有的功能都那么重要的,如果产品经理只是交付一个功能列表,而不做需求优先级设定的话,产品可能沦为没有主心骨的产品,交互设计师设计的时候,不确定主要任务是什么;视觉设计师设计的的时候,不确定哪些界面和模块要提供更精致的设计;开发人员开发的时候,不知道哪些功能该设定更高的开发优先级,于是就会形成大家都在搅浆糊的状态,可能因为某些弱弱的分支流程的复杂性,导致开发人员花了大量的时间去攻克难题;可能因为某个不那么重要的设置界面中,UI增加了复杂的转场效果,导致开发人员搞到头破血流;可能因为开发人员捡着简单的功能先做,导致复杂的重要功能到最后才被草草攻克,一堆bug。别在抱怨各个角色不给力什么的了,想想自己的需求的分析是否到位,是否给你的需求排排等级,哪些对解决产品的商业价值+用户价值有最大的帮助,优先实现它,不重要的,不着急的,可以次优先级实现。

产品功能就像镜头里的花,如果你的镜头里,全是花,会因为全是亮点而变得没有亮点;如果你的镜头里,聚焦于一朵最娇艳的话,亮点就轻松浮现了。但有时候,说不做什么比说做什么还要难。必须每次改版,都上一些新功能,才能让用户知道我们在持续改进,才能让老板知道我们的团队充满战斗力。针对这些要上的功能(或来源于客户,或来源于老板,或来源于自己突发奇想),如果你经过了反复的调研,结论是做的意义不大,你甚至都不敢汇报,还是要硬着头皮上新功能。直到程序底层架构出了大问题,才不得不停下来做代码重构。

“People think focus means saying yes to the thing you’ve got to focus on. But that’s not what it means at all. It means saying no to the hundred other good ideas that there are. You have to pick carefully. I’m actually as proud of the things we haven’t done as the things I have done. Innovation is saying ‘no’ to 1,000 things. ——Steve Jobs

是的,不得不说,乔布斯是一个睿智的产品经理,他眼光独到,敢于取舍,会为了一个产品秘密研发几年,终于厚积薄发。国内环境不太一样,是非成败,瞬息万变,没有一个老板乐意让团队研发那么久,下那么大赌注在一款产品上。他们希望马上看到成绩,逼得团队甚至没有太多时间去深入调研,只能找到一些已经被证明可用的模式,Copy to China,虽说有些变态,可更多的是无奈。

即便如此,产品经理仍然可以讲清楚,产品的核心模块、核心功能是什么。就像这样一个金字塔,塔尖上的是最重要的需求,没有这些,就没有产品价值。

而一个交互设计师,则需要在了解清楚主要需求之后,对应分解到主要任务流程,你需要花80%的精力去设计那20%的重要任务流程,而这20%的重要任务流程,又足以解决80%的用户的核心需求。

有两个技巧让你不会劳心劳力又没成绩——1.抓大放小,要精心雕琢主要任务快速完成次要任务;2.从粗到精,不要上来就陷入到细节中去

其实花了这么多笔墨,只是讲了一个简单的道理,学会做减法,学会排优先级,学会抓主要矛盾。但这本身就是一件知易行难的事,还需要在实践中不断磨练。
———-
转自:http://ucdchina.com/snap/10368

Hello World 业界杂谈

百度技术沙龙

昨天下午跑去参加的百度技术沙龙,之所以回去,是因为这一期的主题是“全站式ajax应用”,正是自己近半年一直在做的东西—-闭门造车这么久,终于有机会看看别人是怎么做的了。
两场讲座,一个是百度的人在讲自己的一个前端框架,领一个是IBM的的人在讲Dojo。
百度董睿所讲的ER框架(这里),用来做所谓整站式ajax应用,在前端实现了MVC的分离、url的前进后退、参数的传递、html模版等等,以及DOM操作~~~听他刚开始讲ER框架用途和亮点时,自己突然,第一次有了一种站在了技术最前沿的感觉—-几个月前为空间通讯录做的前端框架,实现的正是这套东西,MVC/url参数传递等的思想方式与ER很类似,不同的是DOM操作是基于jquery的,另外,为了应对页面灵活多变的显示方式,没有使用html模版。
不过听了ER的一些做法,自己还是受了一些启发的,比如url参数传递方式可以更精简,MVC分层可以更清晰,引入html模版降低使用难度和维护成本等等~~~四个小时的公车算是没白坐吧。
另一场关于Dojo的讲座(这里)—-本来主要式冲着这一场去的—-讲的有些泛泛,基本上就是在推广Dojo,感觉没有多少实质性的内容。
第一次参加这种行业内的技术讲座,本来以为会有更权威的人讲解怎么做 “全站式ajax应用”,但实际两位都只是在介绍、推广自己的东西,所以,刚听完的时候感觉有些失望。但后来想了想,这种技术分享,也只能做到什么程度~~~大家只是将自己的实践经验推广给别人,没有所谓的权威,没有绝对的对与错,大家都是探路者。。。