主要原因是因为, WordPress把其实应该是标题的Bulk actions直接作为批量修改选择框选项的第一项, 当选择该项时实际上相当于不进行任何批量操作. 虽然如此, 这时候旁边的Apply按钮还是可以操作, 按下去的效果就是进行了一次什么事情都不做的提交. 不知道Wordpress的产品经理有没有注意到这个比较奇怪的界面设计.

如果参考
Don’t Make Me Think的准则, 我觉得改成这样就挺好.

该书在第2~7章的最后部分都有一个投资自己小节, 分别在明天/下周/下月/增强关系网等方面给出具体行动指导, 对于具体实践很有帮助.

现在很多上都有自己的网站了,这本书也不例外. [网站]上除了书籍宣传外, 还有blog, 论坛, 和一本免费本书精简版: Executive Summary. 如果你想要更精简的内容, 如果你够聪明看看网站上的这个about页面, 估计也能差不多了解书籍的内容了. 当然了你会落下很多有趣的故事.

下面这张思维导图是从本书的blog里看到的, 对于阅读也很帮助.

另外还有点感慨Linkedin CEO Reid Hoffman的人脉真广, 参与和投资成功的项目真多!

传统教育的方法, 默认为知识是相对静态的. 我们学习,记忆然后在某一天通过考试来检验.
现在的实际情况是知识更新非常快, 我们不可能,也没有必要记在所有的知识. 正确的方法应该是能够在需要的时候获取需要的知识.

通过智囊网络解决专业挑战

曾经利用你的智能网络是很费时费力的事情, 如管理名牌/信件/当面会晤等. 我们只有在一些比较大的事情上才会启用自己的智囊网络, 比如找工作.
但是现在科技的发展使这些交流非常方便, 使我们有机会有可能利用我们的智囊网络帮助我们解决日常遇到的专业上的问题.

风险和机遇是一个硬币的两面, 总是同时存在.
我们既要把握机会,创造突破性的机遇, 同时也要正确评估可能面对的风险.

比如飞机出行, 会报是巨大的,可以快速的在两地往返, 但是一但出现事故后果也是严重的. 但是出事故的概率非常低, 其实飞机出行是很安全的.

好的创业家跟一般的创业家的区别是, 好的创业家不是能承受更大的风险, 而是有能力分析/判断/掌控风险. 他们(能有策略???)的追寻那些回报高的机会, 同时分析规避可能出现的风险.

管理风险

• 通常风险可能根本不是你想象的那样, 情况可能并不像你想象的那么糟.
• 如果最坏的情况发生,你能够承受吗? 只要你的救生艇Plan Z还有效, 算是些钱财不算什么, 只要你还能在这个领域玩下去.
• 可以中途改变决定吗? Plan B还能做下去吗? 如果某个风险导致Plan B/Plan Z也有做不下去ide可能, 那要小心了.
• 不确定性总是存在, 不要把不确定性和风险划等号.
• 考虑风险的时候想一想年龄因素. 同样的风险, 对二三十岁和四五十岁的人是完全不同的, 所以冒险要趁早.
• 当别人都认为有风险的时候, 可能并不是那样, 抓住这样的机遇. 巴菲特在投资上有类似的观点.

短期的风险有利于长期的安定

波动悖论说, 小的波动虽然会对系统产生破坏, 但是也给系统自愈的机会. 由于小的波动不是毁灭性的, 所造成的危害不会太大, 所以能起到锤炼系统, 增加系统防范大的波动的能力. 小火防大灾.

硅谷创业环境拥抱变化, 保持混乱状态的文化, 在一定程度上造就了硅谷在科技领域保持领先地位. 这个现象未来很可能扩散到全球其他地方.

企业的发展和个人职业的发展都不是平稳的上升的, 通常是阶段系的, 缓慢发展和突破性发展交替出现的.

就像创业家不断的寻求企业发展的突破醒机遇一样, 个人也一名能够给不断留意寻找这种突破性机遇. 我们要始终保持好奇心.

如何发现职业机会

机会的出现不是必然的, 通常是我们的努力再加上一些运气. 虽然没有绝对的事情, 但是我们还是应该保持开放的心态, 坚持努力, 当运气来时抓住机遇.

机遇和我们接触哪些人,那些环境有关. 如果希望发现某个行业的机遇, 就多参加一些相关的社区或组织吧.

Paypal帮在硅谷在硅谷声名显赫. Paypal帮的声誉不是来自某个人, 而是他们之间互相帮助, 互相支持, 共享资源, 互相之间创造和传递机遇, 专注在特定的领域, 这些才创造了他们每个人的成功机会.

如果有什么比参加社区或组织更好的选择的话, 那就是自己去建立相关的社区和组织.

保持紧迫感

时刻准备应对变化, 早起的鸟儿有食吃吗.

保持基本弹药(资源). 没有一定的资源企业运行不下去, 没人能保证你能及时获得收入或投资, 虽然要开源节流, 平常保持一定运营资源是必须的.

保持弹性. 企业和职业发展难免起起伏伏, 要适应环境, 能屈能伸.

我们即使已经意识到了人生应该永久保持beta状态,即使开发了自己的竞争优势,即使根据不同清楚在调整自己的计划; 但是如果你是一个人在战斗, 大部分情况下也注定会失败.
这就是要说到关系的重要性, 我们要利用自己的关系, 结网而行. 就像Jobs没有Wozniak也创造不出苹果的辉煌一样, 我们应该找到自己的Wozniak.

拿创业做比较, VC在投资时, 向来把团队看得跟idea一样重要, 甚至更重要. 创始人的角色是, 不但要自己聪明能干, 更要能忽悠比自己更聪明能干的人入伙.

结网而行的好处是, 物以类聚, 你的伙伴会直接影响你的成长. 改变自己的最快最有效的方法就是同你希望成为的人一道.

I^we

个人的成功不只是靠自己的能力, 更依赖你周围的人来帮助你, 放大你. we对I的影响是指数形式的, we能极大的放大个人的能力, 但是如果个人的能力是0, 那we再大也无能为力.

关系所处的环境很重要

我们总是实际生活在各种不同的关系之中, 亲密vs疏远, 项目vs长期, 亲戚vs同事, 等等. 这本书主要讨论的是职场上的各种关系.

建立真诚的联系

首先考虑如何能帮助别人. 我们结识别人时, 首先应该考虑的问题是:我能为他/她做些什么, 而不应该是: 他/她能为我做些什么.

同理心. 创业家是最擅长同理心的一群人. 他们只有从客户角度思考, 创造出客户想要的产品, 才会成功.

关系的类型

就像数码相机的存储卡只能存储有限的照片一样, 一个人能管理过来的关系的总数也是有限的, 通常这个极限数字在150左右.

6度理论证明我们跟世界上任何一个人之间的距离多超过6个人. 但是实际生活中真正对你有影响的人, 基本上是在3度以内.

1度关系, 包括与你紧密的盟友(ally), 盟友之间, 在成长的道路上, 互相促进, 互相支持.
也包括关系稍微松一些职场上的熟人, 这些人能帮助你拓展不同领域的职业机会.

2度关系, 是你的1度关系朋友的1度关系朋友.

3度关系, 依次类推是你的2度关系朋友的1度关系朋友.

要经常主动通过这3度关系, 结识新朋友. 结识新朋友时目标要明确, 期望认识什么样的人, 你能为他/她做些什么?

好的职业关系网是就有粘滞性,又有多样性的有机的结合体.

维护和加强关系网

保持长久关系的秘诀是给予. 通常会有这样的误解: 我人小力微,钱少,没经验,没办法给予别人有用的帮助. 实际上不是这样, 每个人都有自己的长处, 要学会发现, 天生我才.

乐于搭桥, 乐于做别人的桥梁.

经常保持联系, 让别人能想起你.

适应改变, 不断的调整自己的计划.

Pivot: 调整方向,及时掉头

什么时候掉头, 既要靠直觉, 又要根据手上掌握的实际数据来决定. 当然了常见的情况是干不下去了, 必须掉头了.

往哪里掉头, 可以考虑相近的利基领域,不同但是又有联系的领域.

怎么掉头, 可以从业余项目(side project)开始, 主动建立项目相关的人际关系. 3M/Google/Linkedin这种公司等你给员工20%的工作时间去做业余项目, 我们自己更应该分配好时间发展自己的业余项目.

Plan ABZ

以前没听说过, 这本书里提到的比较新颖的说法.

• Plan A, 是指你现在正在为之工作的计划.
• Plan B, 是指你在Plan A中积累经验, 获得数据后的新发现, 通常是对Plan A改进, 是适时的方向调整. 调整以后Plan B即是当前的Plan A.
• Plan Z, 是救生艇. 人生不如意事十有八九, 这时候还是要活命的. Plan Z比较保险, 能给你时间和金钱, 重整旗鼓, 再次开始你的Plan A.

竞争无处不在, 企业竞争客户, 雇员竞争职位.

竞争优势铁三角

资产, 理想, 市场现实构成了竞争优势的铁三角.
对企业家来说最常问的一个问题就是, 为什么客户要买你的产品或服务, 而不是别的企业的? 同样, 对于个人来说, 同一个职位, 为什么雇主会选择你而不是别人, 你的优势在哪里?

你的优势不是比所有人都好, 什么都比别人好. 试图在所有的事上都比别人强, 最后只会一事无成, 什么都不强. 应该在一个垂直的,细分的领域或技能上去尝试做到最好.

网络鞋王Zappos的成功之道就是, 在在线销售鞋子这件事情上把服务做到最好. 如果不是专注在网络,鞋子,服务构成的这个垂直领域, Zappos可能不会有现在这么成功.

竞争优势铁三角能执导我们方向,告诉我们自己的优势是什么.
竞争优势铁三角有助于帮助我们解答这些问题: 我应该专注的做什么? 那些机会是我们应该追寻的? 我们应该如何投资自己?

资产

资产是指我们现在有些什么.
资产分两类软件财富和硬件财富:

• 软件资产是不能直接交易的财富. 比如知识,人脉,技能,个人品牌,能力等.

• 硬件资产是指实物财富. 比如现金,股票,房产等.

在基本生活保障解决了的情况后, 软件资产比硬件资产更重要.

最好的商业计划通常是创始人对自己已有资产的最优重组得来的. 单一资产通常价值不高, 但是当不同的资产结合在一起时, 竞争优势就突显出来了.

理想和价值观

理想有不同的等级: 希望(wish), 想法(idea), 目标(goal), 愿景(vision)

为自己的理想而不是金钱而工作的人, 在做和自己理想相关的工作时, 因为有理想而更努力, 事情做的更好.
理想会促使我们去学习,去尝试. 随着时间的推移, 尝试和学习反过来又会影响我们对理想的追求和演化. do意味着做,而不是想像.

市场现实

不管外形和功能多么的炫, 如果没有用户需要, 就是不能赚钱的产品.
同理你的财富也一样.

不存在的市场,不在乎你有多聪明.如果没有人愿意为你的技能买单,你工作多努力,多有理想,多有热情,一点都不重要.

三位一体

好的职业规划由资产,理想和价值观,市场现实三者共同组成, 三者互相影响. 评估一个因素的时候,同时考虑大另外两个因素对它的影响. 只有经常这样评估, 日积月累, 三者才能不断的磨合.

垂直突显优势(all adavatage are local)

学习多样技能能够增加竞争优势, 但这不是最有效的方式. 更有效的方式是找到一个能突显自己现在的资产组合的垂直,利基市场. Linkedin的成功在于它定位在职业社交这个社交细分领域.

不知道这本书的中文名称会翻译成什么, 我就叫它人生如创业吧.

第一章: 人人都是创业家

每个人生下来都是创业家

每个人生下来都是创业家, 并不意味着每个人都要开公司, 事实上很多人不适合开公司.
每个人生下来都是创业家, 是指我们骨子里都有创业的基因, 创业的本质是创造财富. 我们的老祖宗还住在山洞里的时候, 就自己找或者生产食物养活自己. 他们是自己生活的创始人. 几百上千年过了, 我们似乎忘了这个根本, 我们都是创业家; 逐渐的我们习惯了劳动/工作这件事情.

摩登时代的新次序: 工作

人们冒各种风险移民到美国, 他们认为在那里只要努力的工作, 就能比父辈们过得好. 对稳定的财富积累成了美国梦的一部分.

然而最近60年左右情况有点变化, 职业阶梯上的每个层次似乎都人满为患, 很多受了很好教育的人也只能在职业阶梯的最底层滚打, 有的甚至失业.

雇佣关系也从以前公司通过提供好的福利换取员工的长期的/终生的忠诚服务, 变成了公司与雇员之间短期的基于能力变现的合约(contract)关系.

这些改变大概都是拜全球化和科技进步所赐. 规则变了, 不再是预备, 瞄准, 开火, 现在是瞄准, 开火, 瞄准, 开火, 瞄准, 开火.

为什么说人生如创业

创建公司时, 创业家在有限的信息/时间/资源环境下决策. 这时候没有安全保证, 创业家都在冒一定的风险. 竞争对手在变化, 市场在变化. 公司的生命周期相对短.

创业家在创建公司时遇到的这些问题, 现在我们在职业生涯中都会遇到, 所以说人生如创业. 要以创业的心态去经营自己的职业生涯.

底特律兴起和没落的故事, 说明了保持创业心态的重要性. Netflix的成功和媒体大佬的没落, 同样说明这个问题.

创业的心态: 永久beta

完成这个词对我们有害无益. 我们每天都在进展中. 在职业生涯中, 每天都会有机会, 学习多一点, 做的多一点, 变好一点, 成熟一点.
在职业生涯中保持永久beta的心态, 让我们认识的自己始终是有缺陷的, 有新的领域待开发,适应,成长. 这不但有利于保证我们不断的提高自己, 也有利于保证我们不断改善所处的世界.
逆水行舟,不进则退. 不要把20年的经验变成一年的经验的20次重复. 要在每一年都尝试新挑战, 获得新机会, 学习新知识.

但是在Chrome下我还真不清楚在哪里能看到浏览器现在是否是在以QuirkMode在渲染页面.
找了一圈子,也只找到了这个用JavaScript判断的方法. 难道Chrome没有在界面上提供工具指示这个状态吗?

window.alert('You are in ' + (document.compatMode==='CSS1Compat'?'Standards':'Quirks') + ' mode.')

参考:

• http://stackoverflow.com/questions/627097/how-to-tell-if-a-browser-is-in-quirks-mode

那个高高的女孩转过身来.

“对,就是你!”他重申道.

女孩不认识他, 她感到有些困惑. 但是女孩还是大步的朝他走了过来. 她一头卷卷的红发, 眼睛闪闪的, 反射着周围的颜色, 她的手很柔美, 腿修长而白皙.
“听着,听我说.注意停,我没有时间了.” Hugo气喘嘘嘘的说.

“我认识你吗?” 女孩问到.

“奥,对不起,我叫Hugo.” 他回答道. “你叫什么名字?”

女孩向后退了一步, 有点犹豫是不是应该回答他, 还是一走了之算了. 她嘴唇微微颤抖道, “Charlotte.”

“很高兴遇到你,亲爱的女士. 可以占用你一点时间吗?”

“嗯…, 当然” Charlotte一边检查自己那小巧的腕表一边回答道.

那天有点微风,阳光灿烂. 他们面对面站在布鲁塞尔火车站前. 两个陌生人 – 一个人遇到了点难处, 另一个人也许能帮他.

“我错过了火车.” Hugo解释道. “你知道我在哪儿能查到下一班去巴黎的火车是什么时候吗?”

“我知道, 跟我来.” 她回答道.

他们穿过一间高高天花板的大房间, 里面的人们像是蚁丘里的小小的蚂蚁. 像Hugo一样, 每个人都显得匆忙而紧张. 只有Charlotte不一样, 她看起来很平静.

“火车时刻表就在那儿.” 她微笑的说道, 并用食指在空中一指. “就在你前面.”

Hugo匆匆的查看, 眼光扫过一行行正在离站的火车. 忽然眼光一闪, 巴黎, 第五站台, 14:41开车.

“不好意思, Charlotte, 现在几点了?” Hugo问道.

Hugo转过身来, 才发现她已经走了. 喔, 他甚至都没来及谢谢她呢. 他像刚才查看火车时刻表那样在大房间里查找, 还真找到Charlotte了, 就像刚才在火车时刻表上找到巴黎一样.

是的,她就在那儿. 他看到一头微卷红发的拓,正朝沿着一个长走廊往前走. 他紧走几步跟上她.

“Charlotte, 嗨, Charlotte..” Hugo从后面追上来.

Charlotte转过身, 她的微笑还挂在她尖尖的鼻子下面.

“嗨” Hugo试着喘口气. “不好意思, 还没来得及谢谢你呢, 多谢了.” 他今天第一次露出了笑脸.

“不用谢.” 她回答.

“我能.. 请你喝杯咖啡吗?” Hugo提议道, 他急切的等待着Charlotte的回答.

“当然可以, 不过我们必须往北走.” 她说. “我只往方走.”

Hugo觉得她的回答很奇怪, 但是他很快就回过神来, 说道. “往北, 可以. 我的火车开之前我还有大约42分钟. 我想时间足够了.”

他们一起走着 – Charlotte朝北走, Hugo在旁边跟着. 不一会他们找到一个舒适的地方. Hugo点了一杯浓缩咖啡, 在他们过来的路上他就跟Charlotte说他现在特想喝浓缩咖啡. 她点了一杯水.

“你要到北方什么地方去?” Hugo边问边滋溜了一口他的咖啡.

Charlotte笑了笑, 她知道他会这么问的. “没什么特定的地点, 只是朝北走.” 她稍微顿了顿, 看到Hugo的眼神显得有些疑惑, 她接着说. “我没有最终的目的地, 我只是朝北走.”

“嗯, 你计划去哪儿呢? 荷兰? 丹麦? 挪威?” 他还是不理解.

“我没有计划. 我每天醒来只是往北走. 我慢慢走. 我也不着急, 反正也没有具体目标. 我只有一个方向.” 她说.

“那工作怎么办? 你有工作的吧? 难道你没有什么职责吗?” Hugo觉得挺好奇.

Charlotte把头发理到身后,笑了笑. Hugo看着她. 她的笑容很美. “我曾经有个工作,” 她说“但是2个月前我辞掉了. 因为我要往北走.”

“但是为什么往北呢?” Hugo想知道.

“因为我掷了两次硬币, 两次都是人头. 如果是字, 我就往南走了.” 她从口袋里拿出一枚硬币, 放在他俩之间的桌子上. “在路上我学到了很多东西 – 有关于我自己的,也有关于生命的. 我认识到专注有多重要. 我曾经有一个计划,一个目标, 每天忙碌着去完成我的计划任务(to-dos). 任务一件接着一件从我的脑袋里冒出来. 我失去了自己的自由. 我变成了自己计划的奴隶. Hugo, 你知道Charlotte这个名字的意义吗?” 她问道.

“不知道, 什么意义?” 他回答道.

“自由的人. 我不再自由了, Hugo. 我就是一个囚犯. 我的存在不是因为我的思想, 而是因为我的计划任务(to-dos). 我需要改变. 然后我就发现了专注.” 她笑得很开心. “专注意味着你做事情时, 不是赶时间(rush), 而是享受(enjoy), 从你每天遇到的事情上去学习和互动, 不要囫囵吞枣.” 她的声音充满了热情和激情. “我们的祖先曾经是思考者(thinkers),但是今天的社会把我们变成了工兵(doers). 我们崇尚质量和解决之道, 但是我们完全忘记了过程.”

“过程?”雨果问道.

“是的. 开始和结束之间的距离, A和B之间的距离. 很多人只看到了B, 和到达B要花费什么代价, 另一些人则甚至从来没有从A出发. 这两类人很不同, 但是从理解专注和过程的角度说, 他们是一样的. 当人专注在过程上时, 他就会在过程中发现很多宝藏. 对你我来说, 那些宝藏就在哪儿.”

Charlotte把硬币推到Hugo面前. “掷一个.” 她建议道. 他拿起硬币,往空中一掷, 硬币翻滚着落回到桌面上. 这时Charlotte已经起身走了, 他回头看了看硬币.

“Hugo, 你知道你的名字的意义吗? 它的含义是思考者. 也许巴黎不是你最终的目的地.” 他微笑着走出了咖啡店.

Hugo静静的站在那儿, 低头看着硬币. 硬币是字朝上.

1. 翻译自: http://1p1e1.tumblr.com/post/16164435870/focus-focus-focus-on-the-process

可惜的是这个功能并不支持<符合,不知道这是出于什么考虑.不过给<加上这个功能也很简单.只需要打开Default (OSX).sublime-keymap文件.在里面添加下列配置即可.

{ "keys": ["<"], "command": "insert_snippet", "args": {"contents": "<${0:$SELECTION}>"}, "context":
  [
    { "key": "setting.auto_match_enabled", "operator": "equal", "operand": true },
    { "key": "selection_empty", "operator": "equal", "operand": false, "match_all": true }
  ]
},

打开inspector窗口

• CMD+J or Ctrl+Shift+J in Windows, CMD+Alt+J in OSX

tips

单击右下角的设置按钮，进入设置界面，可以把inspector窗口调成Dock to Right，在宽屏下比较舒服

通过URL直接创建页面内容

data:text/html,<b>ZOMG I AM BOLD!?!!?</b>

快捷键帮助

在Elements Panel按?会显示快捷键

console

• 使用shift + enter可以输入多行代码
• 内置全局对象
  • $(), 通过ID查找DOM节点, 同document.getElementById()
  • $$(), 通过CSS selector查找DOM节点,同document.querySelectorAll()
  • $0, 当前页上的正在被查看(inspect)的元素
  • keys(), 返回某个对象的所有key,不包括从prototype继承来的.同object.keys
  • values(), 返回某个对象的所有value,不包括从prototype继承来的.同object.values
  • clear(), 清空console
  • inspect(), 查看(inspect)某个对象

Elements Panel

• Break on Subtree Modifications/Break on attributes Modifications/Break on node removal 子节点内容、属性被修改试、被移除时触发断点。调试代码.应该很有用.

Network Panel

• 蓝线是DOMContent ready事件触发时间. 页面设计时,这个时间应该越短越好.
• 橙线是window load事件触发时间
  

Scripts Panel

• {} 按钮能够Pretty print方式显示javascript, 这对那些做了压缩的javascript特别有用
• Pause 按钮有三种状态:
  1. Don’t pause on exceptions
  2. Pause on all exceptions
  3. Pause on uncaught exceptions
• 文件浏览
  1. CMD+O, open up a TextMate-style “Go-to-File” popover that lets you quickly jump to a file
  2. CMD + Shift+ O, open up a “Go-to-Symbol” popover that lets you quickly jump to a symbol in the current file
  3. CMD + L, will let you jump to a specific line

• 设置断点
  • 支持Call Stack
  • Edit Breakpoint支持设置条件断点

    

  • XHR Breakpoints可以根据URL设置断点

  • 在Scope Variablessection里, 可以右键,选择Jump to Definition跳转到函数定义的位置

Timeline Panel

• 点击Record按钮以后,会记录浏览器的各种内部操作消耗的时间和内存, 对于调试页面性能非常有效.

  

• 可以Save Timeline data,保持格式是JSON.但是点击Load Timeline data时什么反应都没有,我哪里搞错了?

Profiles Panel

• JavaScript CPU Profiler 可以定位那些js最耗时
• CSS Selector Profiler 可以定位那些css选择器的性能有问题
• Heap Snapshot 可以定位数组/对象/字符串等使用内存的情况

Audits Panel

• 这个有点类似YSlow, 分析当前页面, 并给出修改建议. 例如合并js/优化cache/删除用不到的css选择器等.
• 产品上线前应该用这个工具检测一下.

参考

1. http://jtaby.com/2012/04/23/modern-web-development-part-1.html
2. https://developer.mozilla.org/en/Using_the_Web_Console

如果你必须把这个列表压缩成一句话，那也许是：不要做一个不知停顿的齿轮。这个5个错误，刻画出一个后工业时代人的形象。他把自己压缩成一个适应形状，以适应他的环境，然后直到他停下来，才变得忠实(dutifully)。

值得警惕的是，这些错误都是由于疏忽(omission)引起的。你忘掉了自己的梦想，忽略了自己的家人，压制了自己的感受，忽略了自己朋友，忘记了要快乐的活着。疏忽是一种特别危险的错误，因为你会默认犯这种错误。

我希望能避免这些错误。但是你要怎样做才能防止犯这些默认就会犯的错误呢？理想情况就是转变自己的生活方式，用别的默认行为代替这些默认行为。不过要彻底改变很难。只要这些错误还会默认犯，你也许就应该不停提醒自己。所以我把这个五个错误编成了5个命令，然后把他们列在我的任务列表文件的最头上。他们是：

• 不要忘掉自己的梦想
• 不要只顾着工作
• 说出你的想法
• 积累朋友
• 快乐的活着

翻译自: Paul Graham的The Top Of My Todo List

感觉backbone.js确实解决了很大的问题，使得前端的开发更加模块化，更有利于开发相对复杂些的单页面应用、webapp和手机native＋Html5的混合应用。典型的成功案例有Linkedin的手机应用、教育网站Khan Academy，团购网站Groupon Now!，任务管理应用Trello等。

我也学着backbone.js的著名例子Todos，试验了一些。简单修个Todos，实现了两个小应用：4Blocks和9Blocks。

4Blocks，在Todos的基础上把任务列表复制成了4个，结合《高效人士的7个习惯》里的把任务划分为轻重缓急的概念而来。可以作为自己日常的Task管理器。

9Blocks，则把Todos的任务列表复制了9个，结合Business Model Generation的商业模式画板，可以用来做简单的商业模式分析工具。

• 创建游戏，找个玩家作对手
• 获得3个单词，挑选一个，画一幅关于这个单词的图，发给对手
• 对手根据你的图画，猜测单词
• 交换角色，进入下一轮

感觉Draw Something就像个社交化了Hangman。Yoyo最近在课堂上经常玩Hangman，毫无悬念，他马上也喜欢上了Draw Something。

感觉类似Hangman和Draw Something这样的单词游戏，确实挺适合中小学生在游戏中学习单词的。如果能专门针对中小学课本内容，提供一些单词列表，一定会很受欢迎。

绘画方面，也很有意。这里的绘画追求的是表达意思，而不是画的精致图片。这也很有利于小朋友独立思考，同时让别人理解自己是如何思考的。如果特别有兴趣，其实可以学习些简笔画的基础。

互动应该是Draw Something的最大特色了。游戏的绘画和猜字过程都会回放给对手。我们可以很清晰的看到画画的人的思路，如何修改内容的，如何努力把概念表达清除。也可以看到猜字的人的心理历程，有的人很聪明，很快就能直接猜到；有的耗尽脑汁也想不出，有时候就不停的重试各种字母的排序。
Yoyo在玩的时候，说的最多的话就是”我…”和”他…”,这就是游戏互动的最好表现吧。特别是在别人猜出自己的拙劣的图画，或者是猜出别的的图画时，成就感真的很足呀。

虽然我和Yoyo只是跟陌生人完了几局，但已经感到很有趣了。如果是通过Facebook／Linkedin连上好友，各种杰出绘画作品一定会成为大家重要的话题。

有时候碰到很难表达的单词，我们最常见的一着就是直接把单词写出来，这应该不算是作弊，只能算是耍赖吧。由于猜英文单词对有些人来说实在时不那么容易，比如我的词汇量就很有限，于是催生了各种辅助工具，估且叫做作弊吧。不过这和其他游戏的作弊不同，是好的作弊，是辅助你多认识些单词。其实我们还没有使用过任何辅助工具，如果有道字典不算的话。

奇怪的是我在游戏里没看到有share自己的作品的功能，难道一定要连上Facebook以后才能吗？Share应该会是很有趣的功能。

绘画的时候，会明显感觉到用手指的不方便，看来真的需要一个触摸笔了。

最后我学着Business model generation用9Blocks画了一个Draw Something的商业模式图，有兴趣的朋友可以看看，交流交流。

基本原理

Shadow的思路是这样的。首先在桌面安装一个Shadow的服务程序，这个程序大概是作为桌面浏览器跟移动设备之间通信的桥梁。然后在Chrome浏览器里安装一个Shadow的插件，这个插件负责把当前你在访问的页面发送到Shadow客户端。最后在移动设备上装个Shadow的客户端(iPhone, Android)，客户端充当浏览器的作用，收到消息，并同步显示你在桌面浏览器里访问的页面。

多设备同步浏览

这样的设计思路很简单，实现效果却不错，特别是当你有多个客户端时，就自然形成了多个移动设备同时浏览你的网页的效果。特别是当你的移动设备有iPhone／Android，有小的手机，也有大的pad时，很实用，也很壮观。

远程调试

Shadow的另一个功能也很实用，就是你可以在桌面上打开一个调试窗口，就像Firebug／Chrome开发人员工具一样。然后你就可以像在桌面浏览器里一样，调整移动设备页面上的CSS，调试Javascript了。一个字，爽呆了。

稍微有点遗憾的是，Shadow现在还只是个试验产品，速度有点慢，特别是远程调试的时候不太流畅。Anyway，如果你有兴趣，去看看这段video，然后安装一下自己玩吧。

还有一个说法比较有意，说现在流行老大跟老二合并。优酷跟土豆的合并基本上就垄断国内的在线视频了。于是有人担心，以后youtudou.com的广告时间就是优酷的30秒广告，加上土豆的30秒广告，咱们就能享受60秒广告了。不看还不行，你还没其他地方看去呢！电视广告都有限广令，视频网站也应该有类似规定吧。

后来想到，有没有屏蔽flash广告的插件呀。没想到马上有人回我说，有，但是屏蔽以后的结果是这样的:(。

后来我想到了个简单的方法，就是通过修改hosts文件，让播放器访问不到视频网站的广告服务器。于是就试了一下，还挺好使。记在这里，希望多其他人也有用。

127.0.0.1 valf.atm.youku.com valc.atm.youku.com stat.youku.com

less支持嵌套，而且习惯上使用嵌套时使用缩进。但是嵌套的语法还是使用{}，而不是缩进。所以下面的写法是错误的。

.classA {
    display: block;
    }
    .classB {
        display: none;
    }
//生成的css如下
.classA {
  display: block;
}
.classB {
  display: none;
}

正确的写法是

.classA {
    display: block;
    .classB {
        display: none;
    }
 }
//生成的css如下
.classA {
  display: block;
}
.classA .classB {
  display: none;
}

串联选择器

默认情况下less嵌套生成的是后代选择器。如果要生成串联选择器，一定记得要在前面加上&符号。这对伪类尤其有用如 :hover 和 :focus。这点我搞错了好几次。例如：

.button{
    background-color: #aaa;
    :hover{ //实际上是对所有的页面元素的hover进行了设置
        background-color: #ccc;
    }
}
//生成的css如下：
.button {
  background-color: #aaa;
}
.button :hover {
  background-color: #ccc;
}

正确的写法是：

.button{
    background-color: #aaa;
    &:hover{
        background-color: #ccc;
    }
}
//生成的css如下：
.button {
  background-color: #aaa;
}
.button:hover {
  background-color: #ccc;
}

可以使用less直接计算像素

开始我以为要使用变量，计算好数值以后，再拼上px来生成像素属性。折腾了半天，语法还不太对。其实less是可以方便的直接计算像素属性的。例如：

@w : 100px;
.classA {
    width: @w;
    height: @w/2;
    margin-left: -@w/10;
}
//生成的css如下
.classA {
  width: 100px;
  height: 50px;
  margin-left: -10px;
}

less还把这个特性进一步深入，支持一些HSL的颜色操作函数。如：lighten/darken/saturate/desaturate/fadein/fadeout/spin

less样式文件一定要在引入less.js前先引入

如果你现在在浏览器里生成css，除了引入.less文件的时候要设置rel属性设置为stylesheet/less，记住紧接着要加载less.js。

<link rel="stylesheet/less" type="text/css" href="styles.less">
<script src="less.js" type="text/javascript"></script>

参考文档