<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>代码狂人</title>
	<atom:link href="http://open.cnmsdn.com/feed" rel="self" type="application/rss+xml" />
	<link>http://open.cnmsdn.com</link>
	<description>分享国内外知名的开源项目，让开发更简单！</description>
	<lastBuildDate>Sat, 18 Feb 2012 10:24:36 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
<xhtml:meta xmlns:xhtml="http://www.w3.org/1999/xhtml" name="robots" content="noindex" />
		<item>
		<title>HTML5提供的性能分析API</title>
		<link>http://open.cnmsdn.com/archives/310</link>
		<comments>http://open.cnmsdn.com/archives/310#comments</comments>
		<pubDate>Sat, 18 Feb 2012 10:24:36 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[api]]></category>
		<category><![CDATA[HTML5]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=310</guid>
		<description><![CDATA[最近在做前端性能监控的时候研究了一下这个api,总结整理一下. HTML5提供的性能分析API HTML5草案中提供了这样一个api,在javascript中可以这样获取: window.performance.timing 有如下这些属性: navigationStart unloadEventStart unloadEventEnd redirectStart redirectEnd fetchStart domainLookupStart domainLookupEnd connectStart connectEnd secureConnectionStart requestStart responseStart responseEnd domLoading domInteractive domContentLoadedStart domContentLoadedEnd domComplete loadEventStart loadEventEnd http://w3c-test.org/webperf/specs/NavigationTiming/ 在这里提供了一张解释的图表: &#160; window.performance.timing中各个属性发生过程的图解 &#160; 上面这个地址中,完整地定义了每个值在什么情况下如何返回,可以仔细阅读一下. 采集到这些数据后就可以发回服务端进行统计分析. 浏览器兼容性和bug 目前IE9+,Chrome 14+,firefox 7+支持了这个api,关于完整的支持列表可以在这里查到.safari居然没实现. 由于各个浏览器实现的差异,以及有些字段定义的不明确,所以有一些bug和差异.下面这篇文章十分全面,可以作为详细的使用参考: HTML5 performance API &#8230; <a href="http://open.cnmsdn.com/archives/310">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/310/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5游戏快速开发工具推荐</title>
		<link>http://open.cnmsdn.com/archives/308</link>
		<comments>http://open.cnmsdn.com/archives/308#comments</comments>
		<pubDate>Sat, 04 Feb 2012 05:10:17 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发资源]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[游戏]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=308</guid>
		<description><![CDATA[目前，HTML5已经在移动领域打败了Flash，越来越多的开发者已投身或准备投身到HTML5应用的开发中。由于HTML5无可替代的优势，其前景一片光明。 本文主要介绍三款工具，可帮助开发者快速进行HTML5 2D游戏的开发。 1. GameMaker 最老牌、最强大的一款工具。最近添加了对HTML5的支持(GameMaker:HTML5)。借助此工具的可视化开发界面，开发者无需写代码即可创建简单的游戏。 对于复杂游戏，GameMaker可以根据用户创建的界面生成游戏脚本代码，代码基于GameMaker语言(GameMaker Language，简称GML，这是GameMaker的最大优势)，你可以手动编辑它们。 该工具的精简版(lite)是免费的。 2. Construct 2 最简单、最容易的基本游戏开发工具，它有一个可视化编辑器，让你不写一行代码创建HTML5游戏，这要归功于它的事件编辑器，而且对于初学者和高级用户都非常容易。该工具最近添加了WebGL加速。 100个事件以下的版本是免费的，其中包括拖放物理引擎。 3. Spaceport Spaceport 是基于云的游戏创作平台，该平台使用JavaScript让游戏开发者建立一个可以在所有智能手机系统上运行的游戏，就如同是在这一智能手机平台上开发的原生应用一般。基于网页的游戏则是以一种HTML5与原生应用混合的方式运行，只需编写一个简单的脚本就可以在任何设备上运行。]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/308/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5本地存储不完全指南</title>
		<link>http://open.cnmsdn.com/archives/305</link>
		<comments>http://open.cnmsdn.com/archives/305#comments</comments>
		<pubDate>Fri, 20 Jan 2012 07:25:59 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[本地存储]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=305</guid>
		<description><![CDATA[这篇文章来自于黑客志，对HTML5的本次存储方式进行了非常全面的介绍和分析，对于学习HTML5的开发者来说，不容错过哦。 历史 在HTML5本地存储之前，如果我们想在客户端保存持久化数据，有这么几个选择： HTTP cookie。HTTP cookie的缺点很明显，最多只能存储4KB的数据，每个HTTP请求都会被传送回服务器，明文传输（除非你使用SSL）。 IE userData。userData是微软在上世纪90年代的浏览器大战时推出的本地存储方 案，借助DHTML的behaviour属性来存储本地数据， 允许每个页面最多存储64K数据，每个站点最多640K数据，userData的缺点显而易见，它不是Web标准的一部分，除非你的程序只需要支持IE， 否则它基本没什么用处。 Flash cookie。Flash cookie的名字有些误导，它实际上和HTTP cookie并不是一回事，或许它的名字应该叫做”Flash本地存储”，Flash cookie默认允许每个站点存储不超过100K的数据，如果超出了，Flash会自动向用户请求更大的存储空间，借助Flash的 ExternalInterface接口，你可以很轻松地通过Javascript操作Flash的本地存储。Flash的问题很简单，就是因为它是 Flash。 Google Gears。Gears是Google在07年发布的一个开源浏览器插件，旨在改进 各大浏览器的兼容性，Gears内置了一个基于SQLite的嵌入式 SQL数据库，并提供了统一API对数据库进行访问，在取得用户授权之后，每个站点可以在SQL数据库中存储不限大小的数据，Gears的问题就是 Google自己都已经不用它了。 现状 我们现在通常所说的HTML5本地存储，一般指的是Web Storage规范，这个标准曾经是HTML5规范的一部分，但后来因为种种原因从HTML5规范中分离了出来。但是除了Web Storage，HTML5的本地存储标准还有另外2个竞争者：Web SQL Database和IndexedDB。下面就让我们依次来看看这3个规范吧。 Web Storage Web Storage是目前得到支持最广泛的HTML5本地存储规范：IE 8+、FF 3.5+、Safari 4+、Chrome 4+、Opera 10.5+，以及iPhone 2+和Android 2+都已经支持Web &#8230; <a href="http://open.cnmsdn.com/archives/305">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/305/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5 游戏项目托管站点推荐</title>
		<link>http://open.cnmsdn.com/archives/302</link>
		<comments>http://open.cnmsdn.com/archives/302#comments</comments>
		<pubDate>Fri, 20 Jan 2012 07:11:19 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发资源]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[项目托管]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=302</guid>
		<description><![CDATA[HTML5游戏的开发、发布不像传统的Flash游戏那么容易控制，对于程序员和个人开发者来说，做出来的HTML5游戏包含源代码、脚本库、CSS样式表、图片等资源。而他们大多数没有自己的网站来存储这些资源，所以很多时候要依托于项目托管服务。下面介绍国外最优秀的项目托管商，希望对HTML5游戏和应用开发者有用。 托管站点Top20如下： 1. SourceForge SF为大家所熟知，开源项目的大本营，SF托管至少28万个开源项目，一天的下载量超过200万。 2. GitHub GitHub托管使用Git版本控制系统的公开和私有项目。 目前该网站托管超过170万存储项目，包括许多开源软件。 3. Google Code Google提供免费的使用Subversion或是Mercurial版本控制系统的开源项目托管服务。 它提供2G的存储空间，整合了代码查看工具、wiki、问题跟踪。Google Code站点也提供了大量的Googe自己的APIs和其他开发工具。 4. Eclipse Labs 同样由Google Code托管， Eclipse Labs 是建立在Ecipse平台上的开源项目存储。提示，这些并不是官方的Eclipse基金会项目。 5. BitBucket 类似GitHub， BitBucket托管公开和私有项目。在这个站点上，开源项目和私有项目的用户少于5人，则免费。它托管了超过4.8万个项目，多数可在站点上搜索。 6. LaunchPad 由Ubuntu的东家Canonical维护，LaunchPad目标是运行在Ubuntu上的项目。它托管超过2.1万个使用Bazaar版本控制系统的项目。 7. Codehaus Codehaus定义自己为“开源软件的协作开发环境”。托管需要审查，是否符合站点的声明。 8. RubyForge 从名字您就可猜出，它托管Ruby程序语言开发的开源项目，目前托管项目超过9000个。 9. Tigris Tigris具有很强的专注性，仅限于“为协作软件开发创建更好的工具”。它目前包括700个项目。 10. &#8230; <a href="http://open.cnmsdn.com/archives/302">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/302/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5 WebSocket之HelloWorld</title>
		<link>http://open.cnmsdn.com/archives/297</link>
		<comments>http://open.cnmsdn.com/archives/297#comments</comments>
		<pubDate>Wed, 18 Jan 2012 02:01:06 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[websocket]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=297</guid>
		<description><![CDATA[方案 要实现一个WebSocket有很多方案，客户端方面可以用原生的WebSocket对象，也可以使用类似Socket.IO、jQuery Websocket Plugin这样的封装API，服务器端则可以使用Jetty（Java）、Netty（Java）、mod_pywebsocket（Python&#38;Apache）、nodejs（JavaScript）等 这 里我挑选了客户端Socket.IO+服务器端Socket.IO-node，这样做一方面客户端和服务器端都使用JavaScript，避免有些童鞋因 为不了解Java、Python等其他语言而导致学习成本增加，另一方面两端框架均使用Socket.IO也可以避免客户端和服务器端学习两套不同框架而 导致的学习成本 &#160; 前提条件 * Linux系统一个（或Mac、Solaris、Cgwin、MingW），用于安装nodejs * 支持HTML5浏览器一个（非IE及其内核浏览器均可，建议Chrome） &#160; 安装WebSocket服务器 1. 安装nodejs node.js是近年来较为流行的服务器端JavaScript框架，基于V8引擎开发，本人曾在早期做过其中文文档项目 访问nodejs主页下载最新版本的nodejs，我用的是0.4.3（安装过程以Linux为例，其他平台可以访问查看安装方法）。然后解压到本地 $ tar xfz node-v0.4.3.tar.gz $ cd node-v0.4.3 $ ./configure &#8211;prefix /home/guolin/tools/node-v0.4.3 $ make $ make install 如果安装过程出现问题，请确认本地安装有Python 2.4或更高版本，以及libssl-dev包 2. 安装nodejs管理工具NPM &#8230; <a href="http://open.cnmsdn.com/archives/297">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/297/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML Canvas绘图使用详解</title>
		<link>http://open.cnmsdn.com/archives/295</link>
		<comments>http://open.cnmsdn.com/archives/295#comments</comments>
		<pubDate>Wed, 18 Jan 2012 02:00:02 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[canvas]]></category>
		<category><![CDATA[HTML5]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=295</guid>
		<description><![CDATA[&#60;canvas&#62;是一个新的HTML元素，这个元素可以被Script语言(通常是JavaScript)用来绘制图形。例如可以用它 来画图、合成图象、或做简单的(和不那么简单的)动画。右面的图象展示了一些&#60;canvas&#62;的应用示例，我们将会在此教程中看到他们的实 现。 &#60;canvas&#62;最先在苹果公司(Apple)的Mac OS X Dashboard上被引入，而后被应用于Safari。基于Gecko1.8的浏览器，例如Firefox 1.5，也支持这个新元素。元素&#60;canvas&#62;是WhatWG Web applications 1.0也就是大家都知道的HTML 5标准规范的一部分。 本教程内容只覆盖了一小部分、但却是非常重要的canvas标记的应用功能——图像显示和处理。 设置图片来源 最常见的在canvas上画图的方法是使用Image对象。所支持的来源图片格式依赖于浏览器的支持，然而，一些典型的图片格式(png，jpg，gif等)基本上都没有问题。 图片可以从DOM中已经加载的元素中抓取，也可以按需即时创建。 // 抓取页面上已有的图片。 var myImage = document.getElementById(‘myimageid’);// 或创建一个新图片。 myImage = new Image(); myImage.src = ‘image.png’; &#160; 大多数支持canvas标记的浏览器的当前版本中，当图片还没有加载完成时，如果你要去画它，结果是什么事情都不会发生。也就是说，如果你想画一个图片，你需要等它完全加载。你可以使用图片对象的onload函数来进行判断。 // Create an image. myImage = new Image(); &#8230; <a href="http://open.cnmsdn.com/archives/295">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/295/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>浅谈HTML5的本地存储特性</title>
		<link>http://open.cnmsdn.com/archives/292</link>
		<comments>http://open.cnmsdn.com/archives/292#comments</comments>
		<pubDate>Tue, 17 Jan 2012 02:18:44 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[本地存储]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=292</guid>
		<description><![CDATA[本地存储，说起来也不是什么新特性，在HTML5之前的我们已经可以通过各种方法保存本地数据，基本上包括以下方法： HTTP Cookie 大小限制在4KB IE专有特性userData 大小限制在64KB Flash 大小限制100KB Google Gears 大小限制无 HTML5 本地存储 大小限制5MB &#160; Cookies大家都知道，存储量很小，大概也就4KB的样子，而且IE6限制每个域名20个cookies。不过Cookie的优势是通用性。几乎没有用户去禁用浏览器的Cookie功能。 userData是IE的专用特性，正是因为专用所以没人用，估计知道的人都不多。现在用的最多的是Flash的本地存储吧，空间是Cookie的25倍，大小基本够用。 后来Google发布了Google Gears，存储大小虽然没有限制，但是要装额外的插件，就这一条就把这个功能枪毙了，除非Goggle能保证 Google Gears 的装机率达到90%以上。 HTML5的出现终于解决了这一难题。首先是大小限制，W3C的给建议是每个网站5MB，这已经很大，用来存些字符串数据，绰绰有余了。其次是通用 性，HTML5是一个浏览器标准，大家统一标准是迟早的事。虽说HTML5 本地存储的大小限制是5MB，但是有些浏览器在使用本地空间超出50MB时可以向用户征得同意以增加存储空间，例如Safari。对于HTML5开发者来 说，5MB空间是相当够用了。 对HTML5 本地存储的支持的情况如上图， 非常出人意料的是IE在8.0的时候就支持了，这也是我在查阅相关资料时才发现的。需要注意的是，使用IE、Firefox在本地做测试的时候需要把文件 上传到服务器上（或者也可以在本地搭建服务器），直接打开本地的HTML文件，是无法使用本地存储的。 如果想使用HTML5本地存储的话，为了照顾到老式浏览器，首先必须检测浏览器是否支持本地存储。在HTML5中，本地存储包括 localStorage和sessionStorage，前者是一直存在本地的，后者只是在网页打开时暂时储存，窗口一旦关闭存储的信息就清空了。二者 用法基本上相同，这里以localStorage为例。 1: if(window.localStorage){ 2: alert('This browser supports localStorage'); &#8230; <a href="http://open.cnmsdn.com/archives/292">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/292/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>《Cut The Rope》 HTML 5版背后的开发故事</title>
		<link>http://open.cnmsdn.com/archives/290</link>
		<comments>http://open.cnmsdn.com/archives/290#comments</comments>
		<pubDate>Tue, 17 Jan 2012 02:13:12 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[小道消息]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[ie9]]></category>
		<category><![CDATA[JS]]></category>
		<category><![CDATA[游戏]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=290</guid>
		<description><![CDATA[译者注：Cut the Rope 是一款人见人爱的小游戏。有一个开发团队将它改造成了HTML5版本。想看看他们在改造过程中的经验之谈吗？那就看下面由开发人员自己写的文章吧~ 启示 在IE9中作为一个HTML5应用来运行，从原始的iOS源码改写而来。 Cut the Rope 是一款人见人爱的小游戏。所以我们有了个点子，即通过使用HTML5将这款游戏放到网上以便让更多的人能接触到它。 为了做到这一点，微软的IE团队和ZeptoLab团队（游戏的开发者）以及Pixel Lab的专家们合作以便将Cut the Rope 的网络版本实现。最终效果要能将游戏毫不失真地翻译成网络版本，并且能展示出HTML5的强大功能：画布提供的绘图、基于浏览器的音频和视频、CSS3风格以及WOFF字体的个性。 如果你想玩一下Cut the Rope 的HTML5版本，就去下面这个网址吧：www.cuttherope.ie. 我们觉得HTML5版本的游戏让网络更有趣了，同时，它也展示了IE的上一个版本因支持开放标准而显示出的长处。因此，我们想要分享一些开发 Cut the Rope 过程中的技术细节，以便帮助构建你自己的HTML5站点，并最终为Windows 8 Store做准备！ 从Objective-C到 JavaScript 在将Cut the Rope应用到一个新平台上的时候，我们希望我们保留了这个游 戏的独特的物理特性、动作以及风格。所以，在开始的时候，我们想要改写iOS版本（而不是重写）。我们仔细分析了用Objective-C写成的原始版 本，发现工程量很大，并且很复杂。iOS版本包含大约15，000行代码（不包括库！）代码中最复杂的部分是动作、动画以及绘图引擎。它们本身就很复杂， 使事情变得更为复杂的是这三块之间耦合度很高，并经过了大量优化。 这是个令人生畏的工作：要将这些代码在浏览器上实现，而又不丧失原先的独特个性以及很高的质量。为了完成这个工作，我们赌上了Javascript。 在过去，Javascript一直被人看做是速度很慢的语言。坦白讲，这种说法在最初的确是对的。老的 Javascript引擎是为处理简单的“脚本”（scripting）类型的工作设计的（如它的名字所示）。然而，在现在，Javascript引擎已 经经过大量优化了。整合进just-in-time等功能以后，Javascript执行速度已经可以接近底层代码执行速度了。 除此以外，我们知道使用Javascript编程不同于——并且需要的思维方式也不同于——用编译型语言编程。当我们将这个游戏从Objective-C改写过来的时候，我们知道应该充分利用Javascript编程的不同以及优点。 一个明显的例子是在Javascript中缺少structs。Structs是相关属性的轻量级的聚合。使用 Javascript对象来聚合一系列属性是很容易的，但是这和使用一个合适的struct是很不同的。第一个不同是一旦structs被赋值给一个变量 或则传递到一个函数的时候，它都会被复制。因此，一个使用如Objective-C这样的编译型语言编写的函数可以修改以参数形式传过来的struct的 值，而又不改变原来调用函数中的值。即使是在同一个函数中，将一个不同的值赋给struct也会将值复制一遍。而Javascript对象，是通过引用传 递的。所以一个函数修改了一个对象参数的时候，原调用函数也能看到这个变化。 一个用来模仿structs的简单的方式是每当将Javascript对象作为赋值对象或者参数传递的对象时都创建一个 副本对象。在底层语言（native languages）中，使用structs的开销是很小的。但在Javascript中创建一个对象则会有很大开销，因此我们要非常小心，减少创建对象 &#8230; <a href="http://open.cnmsdn.com/archives/290">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/290/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5和CSS3令设计师心动的新特征</title>
		<link>http://open.cnmsdn.com/archives/287</link>
		<comments>http://open.cnmsdn.com/archives/287#comments</comments>
		<pubDate>Mon, 16 Jan 2012 03:15:40 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[CSS3]]></category>
		<category><![CDATA[HTML5]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=287</guid>
		<description><![CDATA[什么是HTML5和CSS3 HTML和CSS并不难理解。HTML为构成网页的主要语言。通过这种语言，我们可以向计算机说明网页格式、内容、显示效果等等。而CSS则是专门 用来控制网页显示效果的语言。这时候问题出来了，为什么我们要单独使用CSS呢，HTML不是一样可以控制Web页面的显示效果么?为了回答这个问题，我 举个简单的例子 有没有发现如果一旦形容的事情过多，想要把事情描述清楚的时候，我们不得不重复大量的信息?页面语言也是一样，在这种情况下显得杂乱无章，非常难以 理出头绪。通过将控制显示效果的语言集成到CSS里，我们不但可以保证页面语言主体部分的简洁，而且可以非常方便的复用各种语言集合。 HTML5和CSS3是HTML和CSS的最新版本，它们目前均未确定标准，但是已经公布的新特征已经让我们心动不已。 HTML 5的新特新 1. 新的内容标签 HTML4中的内容标签级别相同，无法区分各部分内容。而HTML5中的内容标签互相独立，级别不同，搜索引擎以及统计软件等均可快速识别各部分内容。 2. 更好的表格体系 现在，你可以抛弃JavaScript或者是PHP，只通过HTML5来定义表格。你可以定义每个表格单元的输入格式，也可以定义这个单元是否是必填的等等。 3. 音频、视频API HTML5不但允许你在网页中直接整合视频、音频，同时更提供了一套功能丰富的API用来控制媒体播放，而这些用来控制媒体播放的元素也都是可以被编辑的。因此，HTML5在视频以及音频层面上实际已经可以替代常用的flash插件了。 4. 画布(Canvas) API 在网页中绘制图形一直是个大难题，我们不得不借助flash、silverlight等插件。然而HTML5允许你直接在网页上进行绘图，甚至允许你与网页生成更多的交互，例如绘制图形、放大缩小，等等。图例是一个用HTML5制作的小游戏。 5. 地理(Geolocation) API HTML5提供了地理信息的应用接口Geolocation API。通过这个API，网页可以通过IP，GPS等方式来获得用户的地理信息;同时用户也可以选择是否关闭这个功能。 6. 网页存储(Web storage) API HTML5提供了网页存储的API，方便Web应用的离线使用。除此之外，新的API相对于cookie也有着高安全性，高效率，更大空间等优点。 7. 拖拽释放(Drag and drop) API]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/287/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5的革命性时代还有多远？</title>
		<link>http://open.cnmsdn.com/archives/285</link>
		<comments>http://open.cnmsdn.com/archives/285#comments</comments>
		<pubDate>Sun, 15 Jan 2012 11:21:05 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[品头论足]]></category>
		<category><![CDATA[HTML5]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=285</guid>
		<description><![CDATA[前些日子，国外知名科技网站VentureBeat在评选2011年最佳互联网技术的时候，HTML5以其巨大的行业前瞻性荣登榜单，在国内，欧 朋浏览器也在上周发布了基于HTML5应用的H5版本，开辟了HTML5在移动互联网应用领域的新篇章。自此，HTML5将在2012年成为互联网新一代 技术潮流的话题也迅速传开来，其中更有媒体预言，HTML5将在2012年产生革命性的杀手级应用。 　　HTML5能协助移动互联网带来革命性的变化，这是大多数分析家看好的观点，但事实上，HTML5的实际效用从理论到实践，这期间的距离也将决定着HTML5的普及性状况。 HTML5能为移动互联网带来什么？ 在互联网信息技术方面，HTML5能原生支持多媒体功能，不再依赖浏览器插件而实现跨平台在线影音播放，同时，HTML5还可以让网页调用手机 的应用数据从而降低了电量消耗和性能的损耗，上周发布的欧朋浏览器H5产品因为基于HTML5技术，在体验测试的跑分结果中得到高达惊人305分（总分 450）的数据排名。 除此之外，HTML5还对互联网产品在用户体验、视觉UI等等方面起到良好的提升效果，根据目前发布的欧朋浏览器H5版本来看，基于HTML5 技术的欧朋浏览器H5还具备CS3特性，用户可轻松实现为图片添加圆角、阴影等等特效的功能，同时用户还可以打造一个矢量图的效果，图片放大也不会出现锯 齿和毛边。 这就是说，HTML5在最终表现形式方面，将有别于传统互联网的表现方式，如欧朋浏览器H5的网页信息交互界面，用户可通过浏览器界面轻松实现各种移动应用的随意使用和设置，这和传统互联网模式下需要经过“下载安装包–安装–使用”等方式的传统模式具有本质的区别。 HTML5的具有什么前瞻性价值？ HTML5在现实中能为普通用户带来哪些实际使用价值？这一直是很多用户都异常关注的焦点，在这个问题身上，HTML5最终能带来的使用意义目前已经随着欧朋浏览器H5等产品的发布而得到了体验，因而其最终的行业价值预计也将逐渐得到行业认同。 比如用户想在网页中实现一个视频功能，如果在传统互联网模式下则必须安装本地的Flash插件，而在HTML5的浏览器身上则依托自身的 Video技术实现视频直接播放，这种具备前瞻性意义的产品效用目前已经在欧朋浏览器H5身上得到体现，并且其他浏览器产品也正在跟进中。 这种模式，可以让用户无需离开浏览器就能完成编辑文档、访问社交网络、看电影、玩游戏或听音乐等等互联网任务，同时，用户还可以访问以远程方式存储在“云”中的各种内容，不受位置和设备的限制，以全面拥抱的姿态赋予移动互联网新的面目。 HTML5的全面应用时代还有多远？ HTML5目前看来虽然寓意了下一代互联网发展的新方向，但真正实现全面普及HTML5则需要一定的时间，这是因为HTML5目前还没正式出台行业标准，不过，根据目前情势来看这个问题应该很快可以得到解决。 HTML5时代有哪些代表产品？ 案例和数据是最好的说服力证据，目前对于HTML5的现实应用意义和行业价值，国内外大多互联网厂商均已试水并推出相关互联网产品，目前国内厂 商北界创想推出的欧朋浏览器H5,就是一款完全基于HTML5技术标准的移动互联网产品，并且其目前无论在产品功能还是在理念体现等等方面，都完全符合 HTML5的技术要求。 这款基于HTML5技术标准的手机浏览器，可让用户轻松实现指南针、摄像头拍照、地理位置、离线存储、娱乐和游戏等特效，尤其值得指出的是，这 些特效完全基于HTML5技术标准，用户无须任何其他操作即可轻松实现便利使用，并且其无论在音效和UI界面，都要远远强于传统互联网表现方式。 这种表现，或将正是开启新一代移动互联网时代的预兆。（朱翊） HTML5的革命性时代还有多远？-i朱翊-ZOL博客.]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/285/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>精通HTML5编程</title>
		<link>http://open.cnmsdn.com/archives/283</link>
		<comments>http://open.cnmsdn.com/archives/283#comments</comments>
		<pubDate>Sun, 15 Jan 2012 11:19:26 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[HTML5]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=283</guid>
		<description><![CDATA[本书第二章介绍Canvas。 一、简介 1、历史 Web之前有三种绘图的方式，Adobe Flash，SVG和VML。此次HTML5元素新添加的Canvas实际上是一个像素画布（bitmap canvas），和SVG不同，画在Canvas上的元素无法进行缩放，同时也不是DOM的一部分。 WHATWG的HTML5选择Canvas作为标准原因有二：1、由于不用存储画出的每一个元素，所以性能更好。2、和其他语言的二维绘图API类似，更 容易实现。 2、结构 Canvas在HTML页面中是一个“&#60;canvas&#62;&#60;/canvas&#62;”标签，显示为一个矩形区域。矩形区域的左上角为坐标原点(0,0)，向右为X轴，向下为Y轴。 3、检测浏览器支持 try { document.createElement(“canvas”).getContext(“2d”); document.getElementById(“support”).innerHTML = “HTML5 Canvas is supported in your browser.”; } catch (e) { document.getElementById(“support”).innerHTML = “HTML5 Canvas is not supported É in your browser.”; } 4、失败回退 &#8230; <a href="http://open.cnmsdn.com/archives/283">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/283/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5代码加密问题讨论</title>
		<link>http://open.cnmsdn.com/archives/280</link>
		<comments>http://open.cnmsdn.com/archives/280#comments</comments>
		<pubDate>Sun, 15 Jan 2012 11:17:06 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[品头论足]]></category>
		<category><![CDATA[加密]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=280</guid>
		<description><![CDATA[正如我们所见,越来越多的HTML5网站大行其道,于是产生一个问题,如何保护我们的代码,保护我们的劳动成果,保护我们的知识产权?HTML5的 大部分功能由JavaScript所实现,因为用户是可以查看 JavaScript 源代码的，即使是被压缩之后的,所以问题归结到我们是否需要深入研究JS的代码加密问题? 我觉得JavaScript从诞生起就不应该作为一种被保护的代码，因此你才会看到大量的JavaScript库都以开源方式发布，需要保护的代码是服务端的代码（防止你不想要的漏洞挖掘行为）和服务器的安全。 举个不恰当的例子，优秀的JavaScript代码之于盗取代码的人而言就像名画之于临摹画作的人，你需要做的是把画做好就行，别人临摹反而是对你 “画作”的一种肯定。因此，防止别人盗取要做的不是把画给抹掉，而是用法律武器（如果你想非开源并保护你代码版权的话）。而虚拟机的 话，JavaScript执行的宿主环境浏览器本来就可以看做一个虚拟机，除非把JavaScript弄成编译型语言，否则并无法做到源代码直接查看，但 是这又会丧失了JavaScript本身优秀的动态特性。 同样作为编译型语言的C#、java等依然可以反编译出非常易读的代码（例如C#的反编译工具reflector），就算是C语言在编译后也可以反汇编为汇编代码，只要你有恒心，任何逆向工程都是可以的。 因此，只要代码是在本地执行的，那就不存在绝对的代码保护。JavaScript现有的保护机制主要为混淆合并等，但是更多这种工具（例如 closure compiler）的初衷是用于减小JavaScript体积而不是用于混淆代码，而某些混淆加密工具反而会增大js体积，这在实践中是不可取的。 文章引用知乎网友的回答，感觉回答的不错，遂发文在此。 HTML5代码加密问题讨论 &#124; HTML5学习Step By Step.]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/280/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5使移动游戏开发者成第一受益者</title>
		<link>http://open.cnmsdn.com/archives/278</link>
		<comments>http://open.cnmsdn.com/archives/278#comments</comments>
		<pubDate>Sun, 15 Jan 2012 02:47:48 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[小道消息]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[游戏]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=278</guid>
		<description><![CDATA[1月 11 日消息，易观国际分析师孙梦子今日发布分析报告，指出开发者通过 HTML5 技术开发一款产品，可以应用于多平台，开发成本上的支出就可以大幅度降低。因此移动游戏开发者成第一受益者。 孙梦子说，随着目前中国移动互联网的飞速发展，HTML5的技术优势会愈发体现，在 2012 年的市场上会有亮眼的表现，发展前景值得期待。 事件背景： 近日，Adobe 全球平台技术总监 Ben Forta 表示 Adobe 不再推出基于移动设备浏览器 Flash Player 的更新版本，而在桌面平台使用的 Flash 及移动设备浏览器之外使用的 Flash 即 AIR，Adobe 将继续支持。目前 HTML5 在 Adobe 内部绝对是工作的重点，是非常关键的领域。 易观分析： 2010年 4 月，尚未离开的乔布斯公开表示 Flash 已不再为浏览视频或者其他 web 内容所必须，并且用自家产品全面拥抱 HTML5 的实际行动支持自己的论点。无独有偶，同样在智能机上大行其道的，Google 也同样不遗余力的推动 &#8230; <a href="http://open.cnmsdn.com/archives/278">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/278/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5游戏开发的5条最佳实践</title>
		<link>http://open.cnmsdn.com/archives/276</link>
		<comments>http://open.cnmsdn.com/archives/276#comments</comments>
		<pubDate>Sun, 15 Jan 2012 02:46:03 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[游戏]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=276</guid>
		<description><![CDATA[HTML5很棒，因为它几乎无所不能——它并不是为某种特殊的应用设计的。更重要的是，HTML5几乎是无处不在的。它就在你的PC机上、你的手机上、你的平板设备上——它甚至可能就在你的厨房电器上。 正是由于HTML5具有丰富的功能并且无处不在，所以它给开发者带来了很多的灵感。俗话说得好，“一旦开发者有了灵感，他们就开始编写游戏了。”（这句话应该是作者编的O(∩_∩)O~） 幸运的是，有关HTML5游戏开发的指南现在已经有很多了。而这篇文章则是要告诉开发者在开发HTML5游戏以前应该具备的一些全局概念。你能从这篇文章中学到什么？这里会介绍HTML5游戏开发的一些框架，你将知道如何使你设计的游戏能够在更多的平台上运行，了解如何管理在线游戏的状态，如何处理性能问题。 话不多说，现在就开始介绍HTML5游戏开发的5条实用建议。 建议#1：使用框架 如果只是用HTML5编写一些小程序其实非常简单，但如果想往你的游戏中加入更丰富的功能，那么就有许多其他的事情需要处理了。 比如，如果你的游戏中有大量的图片、音效或是其他的资源，那么浏览器需要从你的游戏服务器上下载这些资源，这往往需要花费很多的时间。如果你在编写程序的时候没有考虑这些问题，那么你也许会对最后的结果感到意外。由于图形和声音文件都是异步下载的，也许在你的资源下载好以前你的JavaScript脚步已经开始运行了。这就是所谓的“爆音”现象（图像显示异常），而声音也可能在错误的时间播放。一个好的解决方法就是创建一个预先下载机制，保证所有的资源下载完以后才允许脚本执行。 另一个你可能碰到的问题就是你的游戏在不同的机器甚至是浏览器中运行的速度有所不同。虽然这也许在你的控制范围以外，但你还是可以尽量使得你的动画或是动作的速度不依赖于游戏运行框架的速度。 其实，现在有许多的游戏模板代码，里面实现了大多数游戏需要的功能。这样，开发者不需要从头到尾编写一个完整的游戏程序。现在有许多框架可以帮助开发者设计游戏，开发者只用关注具体的游戏逻辑，而不用担心如何使游戏顺畅运行这些细节问题。 使用框架时唯一需要注意的一点就是如何从众多的框架中挑选一个合适的框架。像 ImpactJS这样的框架功能非常强大，几乎可以在各个方面为开发者提供帮助；而像 EaselJS的框架则主要是处理图形方面的工作。最后，还是需要由开发者决定使用哪种框架更加合适。这看起来似乎很简单，但在JavaScript的世界里面，选择一个框架时也意味着你选择了一种特定的编程风格。 ImpactJS就是一个很好的例子，它不仅提供了图像显示和音效处理的方法，还在实现中插入了自己的对象和模型。 Ascended Arcade三个月内发开了三款游戏，全部使用的是ImpactJS的框架 虽然现在已经有很多HTML5游戏使用了一些框架，但是还是有很多开发者不嫌麻烦地选择不依赖任何框架完全自己开发。如果你想在合理的时间内完成任务，使用框架当然是最有效的方法。Ascended Arcade就是一个很好的例子，在短短三个月的时间里，他们就开发出了三个游戏，全部使用了ImpactJS框架。 建议#2：将小屏幕和触屏设备考虑在内 HTML5最大的卖点之一就是它既能在桌面PC上使用，也能在笔记本电脑、平板设备甚至是智能手机上运行。（这里有IE9在Windows Phone 7 Mango上的运行效果演示）。 HTML5与生俱来就具备了跨平台的特性，通常为开发者节省了很多工作。然而，有些事情是需要开发者考虑的… SpyChase在Windows Phone 7 Mango上的运行效果 首先也是最重要的一点，不同的设备屏幕的尺寸也有所不同，屏幕的宽高比以及分辨率可能有很大的差别。如果想让你的 HTML5在移动设备上拥有良好的效果，确保它支持多种分辨率并且不超过WVGA的800×480框架大小。此外，由于大多数的移动设备无法在一个屏幕上 显示所有的页面内容，他们常常采用精确的缩放和平移技术，而这些技术通常并不适用于游戏的编写。可以在编程的时候使用viewport meta标志禁用这些功能。下面的代码片段可以用来使你的游戏视图根据屏幕的实际水平宽度自动调节。移动浏览器上的缩放功能常常与触控游戏控制功能产生冲突，可以将“user-scaleable”参数设置为“no”，从而禁用浏览器的缩放功能。 现在你已经能够将你的游戏视图很好地呈现在小屏幕设备上了，接下来就该考虑如何处理用户输入的问题了。大多数触屏设备都有一个虚拟键盘，但是在玩游戏的时候显示一个虚拟键盘实在太浪费空间了。你应该开发一个有限的虚拟键盘，只提供游戏中使用到的按键（比如箭头）。当然，最好是尽可能在游戏中不需要使用额外的元素。Spy Chase在这方面做得很好，用户只用一个手指就能控制游戏中的汽车了。 建议#3：自动保存用户的记录 使用 site pinning,web浏览器试图让web apps可以像桌面apps一样工作。但是，让网站像apps一样运行的想法还比较新鲜，同样的，让web页面保存客户端的状态也尚未成熟。用户在关闭Microsoft Word的文档时可能会思考一下内容是否已经保存，而在关闭web页面时往往不会这么仔细了。通常这并不会带来什么问题——大多数的web页面是没有状态的，或者是将用户的记录保存在了服务器上。 但如果是处理浏览器游戏，情况就完全不同了。通常在客户端执行的是JavaScript代码，HTML5游戏通常将游戏的状态缓存在内存中（RAM）。一旦关闭浏览器窗口，用户辛辛苦苦赢得的高分就永远地丢失了。 你可以要求用户小心一点，不要将正在进行的游戏窗口关闭，但是意外总是会发生的，尤其是当用户开了多个窗口或是电池没电的时候。 长话短说：在编写HTML5游戏时，最好是经常将游戏玩家的进度状态保存一下，当用户重新打开关闭的web页面时，应该让用户可以继续之前没有结束的游戏而不是重头来过。 你应该将用户的记录保存在哪里呢？过去，答案往往是服务器端的数据库或是客户端的cookie。但是这两个都不是最佳的选择。如果是在服 &#8230; <a href="http://open.cnmsdn.com/archives/276">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/276/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5 游戏 Newton’s Tower 试玩</title>
		<link>http://open.cnmsdn.com/archives/274</link>
		<comments>http://open.cnmsdn.com/archives/274#comments</comments>
		<pubDate>Fri, 06 Jan 2012 16:23:04 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[实例展示]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[游戏]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=274</guid>
		<description><![CDATA[在这个游戏中，你的任务是尽可能快地建设不会倒塌的高塔，越快越好。 游戏试玩地址：http://www.3d-sport.com/gamestart.php?id=175]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/274/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5 &lt;canvas&gt;元素的基本用法</title>
		<link>http://open.cnmsdn.com/archives/272</link>
		<comments>http://open.cnmsdn.com/archives/272#comments</comments>
		<pubDate>Fri, 06 Jan 2012 16:14:40 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[canvas]]></category>
		<category><![CDATA[HTML5]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=272</guid>
		<description><![CDATA[让我们从&#60;canvas&#62;元素的定义开始吧。 &#60;canvas id=”tutorial” width=”150&#8243; height=”150&#8243;&#62;&#60;/canvas&#62; &#60;canvas&#62;看起来很像&#60;img&#62;，唯一不同就是它不含 src 和 alt 属性。它只有两个属性，width 和 height，两个都是可选的，并且都可以 DOM 或者 CSS 来设置。如果不指定width 和 height，默认的是宽300像素，高150像素。虽然可以通过 CSS 来调整canvas的大小，但渲染图像会缩放来适应布局的(如果你发现渲染结果看上去变形了，不必一味依赖CSS，可以尝试显式指定canvas的width 和 height 属性值)。 id 属性不是&#60;canvas&#62;专享的，就像标准的HTLM标签一样，任何一个HTML元素都可以指定其 id 值。一般，为元素指定 id 是个不错的主意，这样使得在脚本中应用更加方便。 &#60;canvas&#62;元素可以像普通图片一样指定其样式(边距，边框，背景等等)。然而这些样式并不会对canvas实际生成的图像产生什么影响。下面我们会看到如何应用样式。如果不指定样式，canvas默认是全透明的。 因为 &#60;canvas&#62; 相对较新，有些浏览器并没实现，如Firefox 1.0 和 Internet Explorer，所以我们需要为那些不支持canvas的浏览器提供替用显示内容。 我们只需要直接在canvas元素内插入替用内容即可。不支持canvas的浏览器会忽略canvas元素而直接渲染替用内容，而支持的浏览器则会正常地渲染canvas。例如，我们可以把一些文字或图片填入canvas内，作为替用内容： &#60;canvas id=”stockGraph” &#8230; <a href="http://open.cnmsdn.com/archives/272">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/272/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>使用tiggr五步创建手机应用</title>
		<link>http://open.cnmsdn.com/archives/263</link>
		<comments>http://open.cnmsdn.com/archives/263#comments</comments>
		<pubDate>Fri, 06 Jan 2012 15:58:05 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[android]]></category>
		<category><![CDATA[iphone]]></category>
		<category><![CDATA[jQuery mobile]]></category>
		<category><![CDATA[JS]]></category>
		<category><![CDATA[tiggr]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=263</guid>
		<description><![CDATA[上一篇文章介绍了HTML5 web应用开发框架tiggr，本文介绍如何使用tiggr构建web应用程序。 使用tiggr创建应用程序通常需要经过以下五个步骤： 1、手机界面的原型设计 2、建立REST服务以供应用程序使用 3、为界面UI组件绑定事件和行为 4、在浏览器或其他设备中测试应用程序 5、导出或生成适合运行在各种手机系统的应用程序 手机界面的原型设计 Tiggr设计器的左侧是jQury Mobile的UI设计界面，它可以帮助你方便快速地设计出你想要的原型。选择UI组件并拖拽到手机界面，同时你可以在界面右侧部分为这些UI组件绑定事件、行为和设置属性。如下图： 设置REST服务 如果应用程序没有数据，那将缺少很多趣味性。应用程序可以通过REST服务处理JSON格式或XML格式的数据，设置REST服务通常由下面三个步骤组成： 1、输入服务地址URL 2、设置要请求的参数 3、获得服务反馈的参数 为了使用REST服务，一个特殊的数据源组件被植入手机界面，为了反馈数据给服务，UI输入组件接受参数的输入，然后服务响应参数请求并把结果返回给输出组件。 UI组件映射如图： 为组件绑定事件和行为 为UI组件定义事件并添加被调用的行为，例如，要调用我们上面设置的服务，我们可以为某个组件添加点击事件和调用数据源的行为。当应用程序运行的时候，点击这个组件即可掉用远程服务。 需要注意的是：我们知道尽管你还没有打算创建一款真正的应用，但也许你已经想要在这个过程中植入自定义Javascript或调用第三方JS库，其实这也是非常简单的。如图所示： 在浏览器或其他设备中测试应用程序 你可以在桌面浏览器、手机浏览器或Tiggr测试器中测试你生成的应用程序，如下图： 注意：ANDROID版本的Tiggr 手机测试器应用程序已经发布到ANDROID MARKET，你可以在你的应用程序搜索框中搜索TIGGR MOBILE TESTER找到该应用。iphone办的Tiggr手机测试器已经发布到这里以供下载，请在使用之前阅读readme文档。 导出或生成适合运行在各种手机系统的应用程序 你可以把应用程序中的资源导出为任何你想要的形式，可以是HTML/JS/CSS的文档列表，可以是Ecilpse工程文件，也可以是ANDROID使用的apk应用程序，或者是iPhone平台下的xcode 工程等。如图：]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/263/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5 web开发框架 tiggr 介绍</title>
		<link>http://open.cnmsdn.com/archives/248</link>
		<comments>http://open.cnmsdn.com/archives/248#comments</comments>
		<pubDate>Fri, 06 Jan 2012 15:12:37 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发资源]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[jQuery mobile]]></category>
		<category><![CDATA[tiggr]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=248</guid>
		<description><![CDATA[Tiggr是一个移动一个用创建工具，可以让你快速创建移动应用。你不需要写代码就能创建丰富的移动应用。 使用jQuery Mobile UI组件构建界面 Tiggr使用jQuery Mobile UI组件可以方便快速地构建非常漂亮的用户界面，可视化的jQuery Mobile 编辑器可以使用拖拽的方式快速构建手机屏幕。 定义和连接REST服务 tiggr可以快速定义和连接REST服务，支持JSON和XML，可以定义服务的输入和输出，并且可以在tiggr中测试运行是否正常。在echo模式下，tiggr可以不使用实际数据而进行有效的调试。 添加HTML事件和绑定行为 可以在浏览器或Tiggr测试器中测试应用程序，并且可以把测试地址分享给合作开发者或客户。 导出和生成应用 即时导出APP应用为兼容android、iphone等系统的手机web。 协作和共享 将你的手机web应用实时地分享给你的协同开发者或商业合作伙伴以及测试用户。 设计原型用可视化编辑器 简单拖拽UI组件到手机屏幕即可完成原型的设计。 直观地为手机界面绑定服务 快速轻松地绑定UI输入组件到输入服务和UI输出组件到输出服务，或者在映射过程中调用自定义的Javascript。 方便自定义Javascript或导入第三方JS库 通过自定义Javascript或第三方JS库为web应用程序添加功能。 Tiggr手机web应用测试环境 Tiggr mobile tester 是免费的，提供最容易的本地应用的测试，不需要安装，而仅仅需要点击一下就可以在手机环境下测试本地应用。  Android  apk应用生成器 方便快捷地将web应用程序打包成apk应用程序并发布到Android market。  自定义界面风格 使用tiggr可视化编辑器创建即时预览的自定义界面风格。]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/248/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>让你的网站融入HTML5的元素</title>
		<link>http://open.cnmsdn.com/archives/244</link>
		<comments>http://open.cnmsdn.com/archives/244#comments</comments>
		<pubDate>Fri, 06 Jan 2012 14:13:00 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[开发技术]]></category>
		<category><![CDATA[HTML5]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=244</guid>
		<description><![CDATA[我们已经看过许多关于HTML 5的文章了，但是，对于Web开发人员来说，最主要需要知道的是：我现在可以用上HTML 5来做些什么，我怎么开始使用它?本文将带您了解如何在你的站点上使用HTML 5。 已经有许多文章是关于HTML 5的了，例如“HTML 5时代来临”和“HTML 5会如何改变网络”之类的，但是对于Web开发人员来说，最主要需要知道的是：我现在可以用上HTML 5来做些什么，我怎么开始使用它?好消息是现在已经有不少的HTML 5里的东西可以使用了。 但是，开始你就必须要明白一件事情，你需要知道你的受众如何，否则的话你就不该使用HTML 5。假如你的站点的访问大部分人都是在使用IE 6，那么你完全没有任何理由使用HTML 5。另一方面，如果你站点的访问者都是使用手机浏览器，如iPhone和iPad，那么你还在等什么呢?马上就可以开始动手了!等等，这里有一些准则，看 完再动手不迟。 你现在可以使用哪些HTML5特性? 虽然HTML 5标准现在仍然是个草案，在标准化组织手里依然还在商讨，但是重要的部分已经被许多现代的浏览器实现了。Apple Safari, Google Chrome, Mozilla Firefox, Opera和Microsoft IE 9都已经很好的支持了HTML 5的部分特性。先来看看各浏览器在HTML 5 TEST网站上的得分如何： * Apple Safari 5.0: 208 * Google Chrome 5.03: 197 * &#8230; <a href="http://open.cnmsdn.com/archives/244">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/244/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5游戏开发与赚钱经验分享</title>
		<link>http://open.cnmsdn.com/archives/242</link>
		<comments>http://open.cnmsdn.com/archives/242#comments</comments>
		<pubDate>Fri, 06 Jan 2012 09:32:19 +0000</pubDate>
		<dc:creator>luokelong</dc:creator>
				<category><![CDATA[小道消息]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[游戏]]></category>
		<category><![CDATA[赚钱]]></category>

		<guid isPermaLink="false">http://open.cnmsdn.com/?p=242</guid>
		<description><![CDATA[本文由一位游戏开发者所撰。 作为一个HTML5游戏设计师，对未来的游戏，个人非常乐观，喜欢创造游戏的过程及使用新技术的过程。 回顾2011，HTML5游戏设计者可以做梦，有很多好的创意，我们可以花很小的成本去做，今年就是你将梦想实现的时候，在这里分享几点游戏设计与货币化经验。 利用好移动平台 确保开发的所有游戏都在智能手机上玩儿，如果设计iOS游戏，分辨率最好为320×480。有本书很不错，叫《利用HTML，CSS，JavaScript 开发iPhone 应用：无需Objective-C或Cocoa的情况下开发iOS应用》(Building iPhone Apps with HTML, CSS, and JavaScript: Making App Store Apps Without Objective-C or Cocoa)，这本书很不错，能让人豁然开朗，能让人立即理解画面与规模，还能学到许多CSS小技巧及如何很好利用移动设备。 其次就是触摸设计，其实这个不是很难。另一个重点的就是规模及角色构成设计，在小设备上真的没必要创造一些细小的角色，而是需要创造一些大的，英勇的，色彩浓重的游戏角色。 如何盈利 你有几种选择，但不是每种选择都能带来收入，记住，简单展示游戏并不意味着money，这里分享个人成功经验。 授权：需要考虑独家授权还是非独家授权 独家授权：有太大局限性，等于你不能把自己的作品再授给别人。 非独家授权：高度自由，本人选择的就是这种。 如果你选择独家，则可以提高授权费，因为你不能授权给别人如果选择非独家，根据个人经验，授权费平均在350英镑到400英镑之间。当然，更多游戏意味着更多授权费。 要研究你的客户，也就是那些游戏经营者，关注他们网站发布的游戏风格，也许你的游戏和他们发布的游戏不是一个流派，但风格相似，他们会收纳你的游戏。其次，很多客户都希望通过移动平台去盈利。 收入分摊与广告 如其名，就是你和游戏经营者之间分摊游戏收入，如果选择这种方案，你可以通过打广告或者其它方式来增加收入。 本人觉得Google的AdSense很不错，当然，它不是最好最受欢迎的广告网络，但对刚做游戏的人很有用，免费，易用。 在你的游戏主屏，尽可能在游戏空余时间，如Game Over的时候，屏幕留出约320×50大小的空间来打广告。 利用好Adsense，通过它，可以在网站的内容网页上展示相关性较高的 Google广告，并且这些广告不会过分夸张醒目，google根据网站上显示的广告被点击的次数支付佣金。 一定要与游戏经营者保持联系，如果你的游戏能为他们带来流量，他们就一定会发布你的游戏。 一定要知道游戏授权的相关法律，虽然律师很贵，但确实能帮你解决很多问题，能投帮你省下很多成本，解决很多烦恼。 一定要选择好授权合同类别，避免概念模糊，合同关系双方权利义务，很多时候，你的客户都会让你签署他们起草的合同，对他们有利的合同，自己要保持清醒的头脑，维护自己的利益，避免不必要的纠纷。 &#8230; <a href="http://open.cnmsdn.com/archives/242">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
		<wfw:commentRss>http://open.cnmsdn.com/archives/242/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

