2、Dive Into HTML 5
Mark Pilgrim 是知名软件开发师与博客作者，他在线编写了一本有关 HTML5 的书，侧重 HTML5 的编程方面的功能。

3、HTML5 Doctor
发布 HTML5 相关的文章，介绍目前我们可以借助 HTML5 实现的应用。站点中的一些文章和栏目，也是 HTML5 相应技术的最佳注解，如 dl element ，article element 以及 Q&As 部分。这个站点由一群在 Future of Web Design 大会相遇相识的开发人员共同创办。

4、When Can I Use…
这个简单的单页式站点是一份 HTML5 各种功能同当前主流浏览器（以及它们的不同版本）的兼容清单。

5、HTML5 W3C  Specifications
这是 HTML5 的最新的草案，由 W3C 起草，如果你想对 HTML5 的方方面面有个权威的了解，这是最好的资源。

6、Yes,  You Can Use HTML 5 Today!
SitePoint 有一篇非常出色的文章，鼓励开发和设计者现在就开始部署使用 HTML5，还讲述了改如何编写代码，以适应那些尚不支持 HTML5 的浏览器，如 IE8。

7、Coding  A HTML 5 Layout from Scratch
这是来自 Smashing Magazine 的一篇文章，讲述了如何使用 HTML5 的新元素进行页面布局设计。

8、HTML5  presentation
这是一份关于 HTML5 的演示，是一份有关 HTML5 非常超前的资料，原本是为 Google Chrome用户 设 计，因此，在某些浏览器上可能无法观看。

9、HTML5 Gallery
这是一个 HTML5 站点展示站点，定期推出一些基于 HTML5 的站点介绍，你可以藉此借鉴先行者们的技巧和经验。

10、A Web Developer’s  Guide to HTML 5
这篇来自 W3C 的文章面向 Web 开发者，介绍了HTML5 的语法，API，术语以及各种开发者们关心的资源和技术。

11、HTML5 Demos and Examples
Remy Sharp 是一位来自英国的 web 开发者，他编译了这套 HTML5 演示，包括简单的，基于浏览器的聊天程序.

12、Web  Designer’s Checklist: HTML5 Support Tables
一份非常全面的 HTML5 和 CSS3 浏览器兼容清单。

13、HTML  5 differences from HTML 4
HTML5 和 HTML4 到底有什么区别，这是 W3C 官方对比清单。

14、HTML5-wikipedia
维基百科上有关 HTML5 的词条，非常权威，文章下方还提供了大量 HTML5 的权威资源。

15、The HTML5 test
这个站点可以帮您测试你的浏览器对 HTML5 的支持情况，并为你打出分数。

无相关文章

1. 环境说明：

• firejspt不依赖于任何的插件库，即使脱离jQuery也能很好的工作。
• 目前只是在装有FireBug插件的浏览器上起作用，包括FireFox，Chrome ，对IE无效。

2. 引入firejspt的核心JS类库：

<script type="text/javascript" src="firejspt.js"  ></script>

3. 性能的监控代码的调用

<script type="text/javascript">
 //需要监控性能的模拟代码功能块1
 function testFun1(){
     for (var i=0;i<100;i++){
	   $("#test").html("Hello World");
	 }
  }

  //需要监控性能的模拟代码功能块2
  function testFun2(){
     for (var i=0;i<500;i++){
	   $("#test").html("Hello World");
	 }
  }

 $(function(){
  //执行性能监控测试
  jspt.test(function(){testFun1();});
  jspt.test(function(){testFun2();});
 });
</script>

下面是页面打开后，FireBug中的效果图：

4.更多扩展设定

//关闭性能监控的运行
 jspt.run=false;

 //设置运行时间超过5ms就显示报警提示
 jspt.limt=5;

//同时监控多个函数，自定义控制台显示名称
  jspt.test(function(){testFun1(); testFun2();},"业务功能1");

5. 托管于Google Code

项目首页：http://code.google.com/p/firejspt/

下载地址：http://code.google.com/p/firejspt/downloads/list

相关文章:

1. 浮光掠影（第1季）：高性能JavaScript实践

但是，由于用户浏览器使用情况的千差万别，尤其是性能极差的不死的IE6的顽固存在，同时JS的使用已经超越了浏览器的性能极限，而开发者对于JS性能的理解还存在空白，导致JS的性能问题越来越受到人们的重视。下面就我所知道的关于JS性能方面的一些经验总结，欢迎批评指正。

1.避免Javascript加载时Block引起的阻塞

这个问题在所有的JS性能教程上都是很重要的一条了，先呈上一幅图看下阻塞的情况。

JavaScript放于头部引起的阻塞

在雅虎的高性能网页开发的14条军规中已经对这样的情况提出了解决方案。

第1条: 尽可能的减少 HTTP 的请求数  => 合并JS,减少Block的次数

第6条: 将脚本移动到底部（包括内联的）=> 减少阻塞对网页加载页面渲染的影响

第10条: 压缩 JavaScript 和 CSS (包括内联的) => 减少阻塞的时间

如果条件允许，使用JS的动态加载技术，也是一个很不错的方案

JavaScript放于尾部，减少阻塞对页面的影响

2.  尽可能的使用局部变量

//错误的代码：html()执行了100次
for (var i=0;i<100;i++){
   $("#id").html(    $("#id").html() + "hello" );
}

//正确的代码：html()执行了2次
var str= $("#id").html() ;
for (var i=0;i<100;i++){
   str =str + "hello";
}
 $("#id").html(str );

下面是测试的性能对比数据

Dom读取100次循环执行的对比数据

Dom读取1000次循环执行的对比数据

由上图可以看出，在100次循环的时候，性能对比是1ms VS 30ms, 当1000次循环的时候，性能对比是2ms VS 786 ms ，这个差距是相当惊人的。

对于Dom的操作的资源消耗是非常昂贵， Dom是用来操作，不是用来计算的。用局部变量保存这个值并用来计算，会显著提高JS的性能

3. 多使用ID选择器，少使用CSS选择器

JQ的ID选择器比CSS的选择器要快很多倍，尤其与是页面上的Dom的数量多少成反比，Dom数量越多，CSS选择器越慢

//性能差的写法
$(".title").html();

//性能好的写法
$("#test").html();

JQ CSS选择器 VS ID选择器 性能对比

从上图可以看出，1000次循环，id选择器消耗了22ms,而CSS选择器，消耗了139ms，性能相差6倍。

4. 不要轻易获取布局信息

offsetTop,offsetLeft , offsetWidth,offsetHeight,

scrollTop,scrollLeft ,scrollWidth,scrollHeight ,

clientTop,clientLeft,clientWidth,clientHeight

这些都属于布局信息，每调用一次，都会导致页面的布局的重新刷新渲染和布局计算，代价是非常高昂的，在不得不用的时候，只能通过局部变量在存储值，尽量少的去调用。特别是这种计算与定时器相关的时候，重复调用数量明显上升，尤其要注意。

循环获取定位100次2ms VS 1000次21ms

5. 使用冒泡机制减少事件绑定次数

事件绑定也同样是需要消耗资源的，可以利用冒泡和事件拦截机制，在父层绑定一次，对下层的事件进行拦截，减少绑定次数提示性能。

//不使用冒泡，绑定多次，性能较差
$("ul li").onclick(function(){
  alert(this.html());
});

//使用冒泡，绑定1次，性能较好
$("ul").onclick(function(event){
   alert($(event.target).html());
});

绑定父级使用冒泡机制

上图是有1000个LI的时候的性能对比， 1ms VS 63ms ,差距非常明显。使用冒泡机制还有一个好处，就是在动态新增LI的时候，无需重新事件绑定，同样减少了程序的复杂性

6. 慎用定时器

定时器（timer）是作为监听或者定时执行经常用到的，因为循环定时执行，所以其对网页的性能消耗非常的大，所以，首先要注意控制定时器的间隔时间，不可过于密集，增添客户端的压力，同时也注意尽量使用一个定时器控制多件动作，而不是每个动作一个定时器。

7. 优化效果不明显的那些技巧

在很多优化教程中，还有一些其他的技巧，但是本人测试下来，优化效果是有，但是并不是那么明显.

如： 数组的length应该先预存， if/else  ,  switch/case 应该根据离散概率排序，而不是123顺序排序， 这些优化手段不能说没用，但是收效甚微，不如上面提到的那些手段能起到立杆见影的功效。这就是常说的，20%的努力，可以解决80%的优化问题，但是剩下的20%的优化问题，却需要80%的努力。

8.推荐的性能测试工具FireJSPT

为了做这次测试，我自己写了一个小巧的JS性能测试工具FireJSPT，“工欲善其事，必先利其器”, 已经提交到Google Code 并开源了，有兴趣的童鞋可以去看下。

9.推荐的网站性能优化方面的书

高性能网站建设指南

高性能网站建设进阶指南

高性能JavaScript

以上三本书都是网站前端性能优化方面的经典之作，不能不看，推荐下。

相关文章:

1. Javascript性能测试工具 FireJSPT
2. 快讯：人人网艰难的决定：推出QQ劝架补丁
3. 从各国领导打伞的组图，可以悟出什么？
4. 恭喜英文站www.idiaocha.com获得了第一条真实评论
5. 腾讯QQ霸权主义，逼迫用户360和QQ只能选一个，你拿用户当什么？

1. 误区一：过度追求完美

就拿本公司来说，一个项目还没上线，就已经几易其稿，设计者自己在不停的自我YY，说用户一定会喜欢这样，一定会喜欢那样。到最后，网站还没上线，UI设计人员和前端开发人员，已经被折腾得不像人样了。其实，UED是一个需要用户参与的过程，不经过真实用户的检验，是永远不能理解用户的真实想法。不要用自己的思维去考虑用户，用户永远和你想象的不一样。同时，产品的设计也是一个不断迭代前进的过程，时代会变，用户的习惯也会变，但这都建立在循序渐进的基础上。完全完美的东西，世界上是不存在的。

2. 误区二：片面追求绚丽的功能

现在的前端技术越来越发达，各种绚丽的前端技巧都可以实现。 于是网站产品人员就巴不得把所有的交互技术都堆到网站上，以表现自己的“用户体验”。 其实，“绚丽!=用户体验” ,真正的应该是“简单=用户体验”。用户来访问你的网站，使用你的产品的功能，就一个要求：简单+便捷 。

3. 误区三：拍脑袋做决定

这个是大多数人都会犯的错误。 好多从事UED的人，都自我感觉非常良好，认为自己是最懂用户的。其实，所有的UED的决定，是不取决与任何某一个人的主观意见，而是取决于数据。 UED的任何措施，都是长期数据积累分析的结果。包括用户的访问跟踪，行为分析，路径分析等。什么时候UED人员把自己当成“白痴”去用自己的产品，去思考自己的产品时，什么时候懂得在杂乱无章的数据中找到事物发展的规律和方法，他才是一个合格的UED大师。

4. 误区四：人云亦云

这个错误也很常见，通常是自己想不出招来，就抄袭，模仿，认为别人这么干，一定有他自己的道理。这话是不错，但是每个产品都是自己的特性，都有自己不同的商业诉求和用户习惯。并不是说淘宝搞个什么，我们就抄个什么。一定要学会自己独立思考，按照自己的产品个性和用户习惯来制定UED策略。

5. 误区五：UED只是UI设计的事情

很多人认为UED只是UI设计的事情，特别是程序员，你怎么设计，我就怎么干，效果好不好与我无关。 这已经涉及到管理的问题了，每个人都是UED的设计者，每个人也都是产品的用户。只有集思广益，广开言路，才能做出优秀的产品。而且，在UED人员中，除了产品设计，UE设计，前端开发，程序开发，还要将市场、运营所有的人调动起来。离开商业诉求的UED，只能沦落为自我YY。

6. 误区六：UED的目的是为了用户使用更方便

这句话并不全对，UED的终极目的不是为了用户，而是为了网站获得更大的营收。 比如很多网站一登录，会在右下角弹出一个广告小窗，或者新浪有时也是全屏弹广告， 而多如牛毛的下载站就更不用提了，你点10个“下载”链接，至少9个是假的。 但是，他们这样做是有道理的，糟糕的用户体验，有时候也是为营收服务的，这说明，追求用户体验有个平衡点，要根据自己的商业需要来寻求自己的平衡点。

7. 误区七：用户体验适合网站发展的任何时期

一个新建的网站，什么流量都没有，什么用户都没有，就去花很多人力和时间在用户体验设计上，有意义吗？用户体验是网站竞争白热化的一个产物，说白了，就是网站发展后期拼服务，用户体验是服务中的一个细小分类。 刚才已经说了，只有建立在用户数据积累和分析上的用户体验，才是有效的。一个新建立的网站，应该更多的把思路放在尽快上线给用户检验，尽快完善自己的流程设计，尽快拓展自己的用户群，尽快宣传自己拉升自己的网站流量上，至于“用户体验”，等时机成熟了再搞也不迟。

8. 误区八：为了用户体验经常改版

用户体验专家为了显示自己的“专业性”，为了显示自己“很忙”“很投入”，于是今天一个策划，明天一个策划。 不但开发人员被折腾，用户也被折腾。 实际上用户的习惯哪怕是不合理的，当他习惯之后，就很难去纠正。 这个时候，要去强力扭转，一定会发生老用户反水和流失。 所以，用户体验的修改，是一个小步慢跑，逐步推进的过程，每次只是一个小修改，等用户习惯后，在推另一个小修改，在不知不觉中，积少成多，完成一个庞大的改版任务。

以上的8点，都是本人的切身体会，如果网友有不同的意见，也欢迎一起讨论。

原创版权，转载请保留出处：http://www.kacakong.com/archives/289

相关文章:

1. Exciting Andorid英文站开通3天，Google已经收录15篇
2. Google退出中国折射出中国的网络环境
3. 英文垃圾站新手上路经验总结，上线10天初体验
4. 韩寒“南方周末文化论坛”《所谓文化大国》演讲实录[转]
5. Android开发初体验

人人网劝架补丁：以和为贵

突然发现这个四个字似曾相识：

黑社会：以和为贵

还有那些做出艰难的决定的公司呢？

1、新浪UC，在360vs QQ 的相关新闻后放置新浪UC的下载链接。

2、网易泡泡在论坛发布《网易POPO致老用户的 一封邀请信》，鼓励新老用户使用网易泡泡。

3、飞信使用弹窗告知用户飞信能兼容各类软件。

4、人人网推出QQ劝架补丁，声称能让QQ与360和平共处。

5、 金山和卡巴斯基宣布免费一年。

相关文章:

1. 腾讯QQ霸权主义，逼迫用户360和QQ只能选一个，你拿用户当什么？
2. 360安全卫士发布隐私保护器与腾讯QQ互掐，网民隐私谁来保护？
3. 恭喜英文站www.idiaocha.com获得了第一条真实评论
4. QQ如何与360共存办法，破解QQ霸权终极解决方案，
5. 浮光掠影（第1季）：高性能JavaScript实践

腾讯QQ不把用户当回事，咱们用户也要学会自救是不是？

方法一（适合NTFS格式的硬盘，右键硬盘选择属性可以看到是NTFS还是FAT32格式）：

win7系统的，在c:\users(用户)\你的名字\appdata\roaming\tencent\qq里，右键safedase文件夹，选择属性-安全，选择高级-更改权限-权限设置，分别点选权限项目里的用户名或组名，点编辑，勾选完全拒绝。

XP系统的，在c:\documents and settings\administrator\application data\tencent\qq里，右键safedase文件夹，选择属性，安全里权限设置为完全拒绝。

*右键没有安全选项的，可以随便打开个文件夹，菜单工具里选择文件夹选项，勾选“使用简单文件共享”这栏，确定后按步骤做就看得到了。

方法二（适合FAT32格式的硬盘，查看方式同方法一）：

这个方法简单了，删除这个safedase目录，然后新建一个同名的目

方法一（适合NTFS格式的硬盘，右键硬盘选择属性可以看到是NTFS还是FAT32格式）：win7系统的，在c:\users(用户)\你的名字\appdata\roaming\tencent\qq里，右键safedase文件夹，选择属性-安全，选择高级-更改权限-权限设置，分别点选权限项目里的用户名或组名，点编辑，勾选完全拒绝。XP系统的，在c:\documents and settings\administrator\application data\tencent\qq里，右键safedase文件夹，选择属性，安全里权限设置为完全拒绝。*右键没有安全选项的，可以随便打开个文件夹，菜单工具里选择文件夹选项，勾选“使用简单文件共享”这栏，确定后按步骤做就看得到了。方法二（适合FAT32格式的硬盘，查看方式同方法一）：这个方法简单了，删除这个safedase目录，然后新建一个同名的目录

我是准备一周不上QQ了，这个方法也是网上搜集而来，有兴趣的网友可以自己试试，如果有效果，别忘记留个言告诉我一声

原创版权，欢迎转载，转载请注明出处：http://www.kacakong.com/archives/284

相关文章:

1. 腾讯QQ霸权主义，逼迫用户360和QQ只能选一个，你拿用户当什么？
2. Exciting Andorid英文站开通3天，Google已经收录15篇

QQ与360大战，无辜用户受牵连

是谁给了QQ今天如日中天的地位？ 正是广大的用户，而现在，无辜的用户却成为两大公司之间商业争斗的牺牲品。在这场战役里，有谁考虑过用户的感受？ 先是拿用户的桌面搞弹窗大战，接着是相互出软件制衡，现在，QQ居然逼迫用户在360与QQ之间，二者只能取其一。

这不是一个正常的商业公司应该有的行径，这不是一个有基本社会公德的上市公司应该有的作为。作为一个中国青少年的商业成功人士表率之一，居然做事就象一个被冷落的第三者怨妇，在已经被男人（用户)厌弃的情况下，还在哪里滚地撒娇打泼：“有我没她，有她没我”，NND，难道天底下就你一个女人吗？ 我还有MSN，还有GTalk,  NND QQ，给我滚一边去。

从今天开始，为了表示对QQ暴力行径的愤慨决定停用QQ一周，有事去请上MSN/GTalk 找我。

世界上没有什么不可替代，除了人心。

原创版权,欢迎转载，转载请注明出处：http://www.kacakong.com/archives/281

附记： 用户的眼睛是雪亮的，请参与和查看新浪正在持续进行的QQ VS 360 站队调查

相关文章:

1. 360安全卫士发布隐私保护器与腾讯QQ互掐，网民隐私谁来保护？
2. QQ如何与360共存办法，破解QQ霸权终极解决方案，
3. 快讯：人人网艰难的决定：推出QQ劝架补丁

IP：110 ， 收录数 2200 ，也算不错的成绩了。目前的流量主要来源也就是Google。 百度虽然也有，但是几乎可以忽略。

这还不算什么，重要的是英文站的Google Adsense单价，再来晒一幅图，有图有真相。

仅仅一次点击Google AD就0.98刀，偶滴神啊，如果每次点击都是这样，那该多爽啊！这幅图来自10.2日。

40天英文站运营总结如下：

1. 每天坚持的更新频率，导致Google对本站的重视，因此Google的抓取也就更频繁。虽然我的PR目前还没有数据。

2. 伪原创还是有威力的。我在可读性和差异度上，选择了可读性。 并且坚持手工做一些后期的维护，虽然费力，但是有效。

不足之处：

1. 外链问题还没有找到好的解决办法。

2.搜索词几乎都是长尾词，没有一个是热门词。

3.手工太多的介入，也不是长久之计，毕竟大家时间都很宝贵，是不是有更偷懒的法子呢？ 懒人才是世界发展的唯一动力。

相关文章:

1. 英文垃圾站新手上路经验总结，上线10天初体验
2. 今天架设了第一个英文站 Exciting Android

T-Mobile G2 Android Phone 手机

我们来一起看一下T-Mobile G2的配置：

G2 （1701089）是T-Mobile的首个HSPA的智能手机，基于新的HSPA+，支持4G的连接速度。 截至周日，10月3日，你将能够购买到G2！

概述： G2拥有了高通MSM7230 800 MHz处理器，它带有一个3.7“WVGA触摸屏，4GB的内部存储器和外部microSD卡插槽，支持高达32GB的卡（内置8 GB的卡），其他功能包括：集成的语音动作，一个高清720p的500万像素摄像头，LED闪光灯和自动对焦，视频录制等。

价格： G2 新激活两年为149.99美元，升级两年为199.99美元。附加FlexPay和A线，并需要Android的激活数据计划。

[ via Android Phone ]

本文地址：http://www.kacakong.com/archives/260

原创翻译,转载请保留出处。

相关文章:

1. 谷歌的基于GPS定位的广告：Google hyperlocal

如果，你和你的伙伴正迷茫的走在路上，夜已经深了，你好想要个汉堡包啊！ 你已经持续驾驶6个小时了，忽然广告牌适时出现了，小镇上一个闪闪发光的霓虹灯映入你的眼帘，你开车经过过它时，发现上面写着：“温迪出口164”。 你的眼睛发光，直流口水，好想吃啊，快去享受你的美味时光吧！

大多数时间，广告是一个令人讨厌的东西。但向刚才的例子，广告出现的恰当时机正是你附近的而且是你所迫切需要的，Google  hyperlocal 就是为此而存在的。Google hyperlocal是一个十分聪明的广告。Google使用Android Phone 的GPS知道你在哪里，你周围有什么。Google找到你所需要的东西，他能够同时在Google搜索和GPS导航中插入这些广告。如果你不想要这些广告也没问题，Google hyperlocal 只是在你选择了共享你的位置的时候，才会起作用。
[ via Android Phone ]

本文地址：http://www.kacakong.com/archives/258

原创翻译,转载请保留出处。

相关文章:

1. T-Mobile G2 预计10月3日发售，价格149.99美元
2. 宁为玉碎，不为瓦全-为Google喝彩【转】
3. Google纯爷们，此处不留爷，咱们墙外见
4. Android SDK下载
5. 仅3800元 谷歌Nexus One国内购买攻略