<?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>HTML5中国</title>
	<atom:link href="http://html5cn.net/feed" rel="self" type="application/rss+xml" />
	<link>http://html5cn.net</link>
	<description>HTML5中文网</description>
	<lastBuildDate>Mon, 16 Jan 2012 05:55:24 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
		<item>
		<title>15个拥有惊艳效果的HTML5和CSS3体验</title>
		<link>http://html5cn.net/archives/197.html</link>
		<comments>http://html5cn.net/archives/197.html#comments</comments>
		<pubDate>Mon, 16 Jan 2012 05:55:24 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[html5演示]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=197</guid>
		<description><![CDATA[看看下面这些界面的效果，令人难以置信的它们居然都是采用HTML5+CSS3开发的！ MADMANIMATION Demo Bon Bon Buttons Demo &#124; More Information Monster Cursor Demo 3D Home Demo &#124; More Information iOS Icons Demo &#124; More Information Digital Clock Demo Spiderman Demo &#124; More Information i Twitty the Fool Demo Solar System Demo &#124; More Information CSS3 Zoom Demo &#124; More Information iPhone Helix Demo &#124; More Information Mac OSX Finder Demo Social Media Icons Demo &#124; More Information iPhone 3GS Demo &#124; More Information [...]]]></description>
			<content:encoded><![CDATA[<p class="postbody clearfix" style="clear: both; font-size: 14px; line-height: 25px; text-align: left; height: 25px; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">看看下面这些界面的效果，令人难以置信的它们居然都是采用HTML5+CSS3开发的！</p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>MADMANIMATION</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="MADMANIMATION" href="http://animatable.com/demos/madmanimation/" target="_blank">Demo</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3834" style="border-style: initial; border-color: initial; width: 578px; height: 325px;" title="madmanimation" src="http://articles.csdn.net/uploads/allimg/120111/0920192546-0.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>Bon Bon Buttons</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="Bon Bon Buttons" href="http://lab.simurai.com/css/buttons/" target="_blank">Demo</a> | <a style="color: #015fb6; text-decoration: none;" title="Bon Bon Buttons" href="http://lab.simurai.com/css/buttons/" target="_blank">More Information</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3826" style="border-style: initial; border-color: initial; width: 581px; height: 249px;" title="bon-bon-buttons" src="http://articles.csdn.net/uploads/allimg/120111/092019DC-1.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>Monster Cursor</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="Monster Cursor" href="http://lab.simurai.com/toy/monster/" target="_blank">Demo</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3836" style="border-style: initial; border-color: initial; width: 601px; height: 430px;" title="mosnter-cursor" src="http://articles.csdn.net/uploads/allimg/120111/0920191003-2.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>3D Home</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="3D Home" href="http://cubiq.org/dropbox/3dcity/index2.html" target="_blank">Demo</a> | <a style="color: #015fb6; text-decoration: none;" title="3D Home" href="http://cubiq.org/building-a-pure-css-3d-city" target="_blank">More Information</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3825" style="border-style: initial; border-color: initial; width: 622px; height: 295px;" title="3d-city" src="http://articles.csdn.net/uploads/allimg/120111/0920191U7-3.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>iOS Icons</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="iOS Icons" href="http://graphicpeel.com/cssiosicons" target="_blank">Demo</a> | <a style="color: #015fb6; text-decoration: none;" title="iOS Icons" href="http://blog.graphicpeel.com/post/740928981/ios-icons-made-in-pure-css" target="_blank">More Information</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3830" style="border-style: initial; border-color: initial; width: 561px; height: 241px;" title="ios-icons" src="http://articles.csdn.net/uploads/allimg/120111/0920195b8-4.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>Digital Clock</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="Digital Clock" href="http://www.gesteves.com/experiments/clock.html" target="_blank">Demo</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3829" style="border-style: initial; border-color: initial; width: 585px; height: 261px;" title="digital-clock-css3" src="http://articles.csdn.net/uploads/allimg/120111/09201aP0-5.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>Spiderman</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="Spiderman" href="http://www.optimum7.com/css3-man/animation.html" target="_blank">Demo</a> | <a style="color: #015fb6; text-decoration: none;" title="Spiderman" href="http://www.optimum7.com/internet-marketing/web-development/pure-css3-spiderman-ipad-cartoon-jquery-html5-no-flash.html" target="_blank">More Information</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3839" style="border-style: initial; border-color: initial; width: 601px; height: 475px;" title="spiderman-css3" src="http://articles.csdn.net/uploads/allimg/120111/09201a323-6.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>i Twitty the Fool</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="i Twitty the Fool" href="http://www.anthonycalzadilla.com/i-twitty-the-fool/" target="_blank">Demo</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3832" style="border-style: initial; border-color: initial; width: 601px; height: 327px;" title="i-twitty-the-fool" src="http://articles.csdn.net/uploads/allimg/120111/09201a5D-7.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>Solar System</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="Solar System" href="http://neography.com/experiment/circles/solarsystem/" target="_blank">Demo</a> | <a style="color: #015fb6; text-decoration: none;" title="Solar System" href="http://neography.com/journal/our-solar-system-in-css3/" target="_blank">More Information</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3838" style="border-style: initial; border-color: initial; width: 543px; height: 453px;" title="solar-system-css3" src="http://articles.csdn.net/uploads/allimg/120111/0920195936-8.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>CSS3 Zoom</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="CSS3 Zoom" href="http://www.cssplay.co.uk/menu/css3-zoom.html" target="_blank">Demo</a> | <a style="color: #015fb6; text-decoration: none;" title="CSS3 Zoom" href="http://www.cssplay.co.uk/menu/css3-zoom.html" target="_blank">More Information</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3828" style="border-style: initial; border-color: initial;" title="css3-zoom" src="http://articles.csdn.net/uploads/allimg/120111/092019A94-9.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" width="521" height="521" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>iPhone Helix</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="iPhone Helix" href="http://demo.marcofolio.net/css3_helix/" target="_blank">Demo</a> | <a style="color: #015fb6; text-decoration: none;" title="iPhone Helix" href="http://www.marcofolio.net/css/animated_css3_helix_using_3d_transforms.html" target="_blank">More Information</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3827" style="border-style: initial; border-color: initial; width: 584px; height: 334px;" title="css3-helix" src="http://articles.csdn.net/uploads/allimg/120111/0920193W6-10.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>Mac OSX Finder</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="Mac OSX Finder" href="http://arronhunt.com/labs/finder/index.html" target="_blank">Demo</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3833" style="border-style: initial; border-color: initial; width: 570px; height: 371px;" title="mac-osx-finder" src="http://articles.csdn.net/uploads/allimg/120111/09201a2C-11.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>Social Media Icons</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="Social Media Icons" href="http://insicdesigns.com/demo/css3/exp3/index.html" target="_blank">Demo</a> | <a style="color: #015fb6; text-decoration: none;" title="Social Media Icons" href="http://blog.insicdesigns.com/2010/03/create-social-media-icons-in-pure-css/" target="_blank">More Information</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="spl" class="size-full wp-image-3837 aligncenter" style="border-style: initial; border-color: initial;" title="social-media-icons-css3" src="http://articles.csdn.net/uploads/allimg/120111/0920194K1-12.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" width="385" height="533" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>iPhone 3GS</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="iPhone 3GS" href="http://lab.jeffbatterton.com/iphone-css3/" target="_blank">Demo</a> | <a style="color: #015fb6; text-decoration: none;" title="iPhone 3GS" href="http://jeffbatterton.com/blog/5" target="_blank">More Information</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="spl" class="size-full wp-image-3831 aligncenter" style="border-style: initial; border-color: initial;" title="iphone-3gs" src="http://articles.csdn.net/uploads/allimg/120111/0920194207-13.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" width="430" height="749" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>Morphing Cubes</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><a style="color: #015fb6; text-decoration: none;" title="Morphing Cubes" href="http://www.webkit.org/blog-files/3d-transforms/morphing-cubes.html" target="_blank">Demo</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img id="nor" class="aligncenter size-full wp-image-3835" style="border-style: initial; border-color: initial; width: 529px; height: 240px;" title="morphing-cubes" src="http://articles.csdn.net/uploads/allimg/120111/0920191W8-14.jpg" alt="15 难以置信的 HTML5 和 CSS3 体验" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">文章出自：<a style="color: #015fb6; text-decoration: none;" href="http://www.open-open.com/news/view/169514b" target="_blank">open-open</a></p>
<div class="page" style="text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; font-size: 12px; line-height: 18px; background-color: #f8fafd;"></div>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/197.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>使用HTML5+JavaScript 低成本开发应用</title>
		<link>http://html5cn.net/archives/196.html</link>
		<comments>http://html5cn.net/archives/196.html#comments</comments>
		<pubDate>Tue, 10 Jan 2012 09:18:47 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[HTML5知识]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=196</guid>
		<description><![CDATA[     HTML 5+JavaScript混合方案是成本控制和潜在市场覆盖的最佳组合，极有可能成为未来移动开发市场的主宰。          开发者们经常思考的一个问题是该开发Web应用、本地应用，还是其他混合形式的内容。其实，该问题的答案虽不确定但十分简单，在正式的开发工作开始前，开发者需想清楚一些关键问题，如：目标受众是谁?开发该应用的目的是什么等等。 　　市场研究公司Forrester表示，开发者不应该在本地代码和HTML 5之间进行非此即彼的选择。以下是Forrester关于四种开发方案的具体分析： 　　1)本地应用： 　　提供最好的用户体验、性能，以及设备API访问(摄像头、联系人、手机状态等);不过，由于四个主要的移动平台(iOS、Android、Windows Phone、BlackBerry)使用不同的代码库，因此同一款应用需要针对不同的平台进行多次开发，导致实际的开发预算可能会比预期高出150%至210%。 　　2)HTML 5/JavaScript Web应用 　　优点是浏览器无处不在，HTML 5的 和 标签，以及设备访问API极大地增强了Web应用的功能;不足是JavaScript没有本地代码快，用户体验和设计流畅性做得不是很好。 　　3)HTML 5+JavaScript混合应用 　　该混合方案使其兼备多种本地功能，是Facebook移动应用和PhoneGap所采用的方案。从某种意义上来说，不管是对Web应用，还是本地应用，都最为两全其美。 　　4)移动中间软件 　　集成客户端和服务器端组件开发等多种开发环境，多适用于使用Oracle或SAP等系统的企业级开发工作室。 　　除此以外，开发者还需认真考虑的是成本和资源。在当前环境下，开发工作室通常会找一些精通Web技术的编码人员开发适用四种主要平台的应用。对Web应用来说，Forrester建议使用HTML 5+JavaScript混合方案;本地应用虽然有更好的视觉效果和更强大的设备访问API，但其跨平台的高额开发成本可能会让很多开发者望而却步。 　　小结： 　　总的来说，HTML 5+JavaScript混合方案是成本控制和潜在市场覆盖的最佳组合，极有可能成为未来移动开发市场的主宰。]]></description>
			<content:encoded><![CDATA[<p><span style="font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff;">     HTML 5+JavaScript混合方案是成本控制和潜在市场覆盖的最佳组合，极有可能成为未来移动开发市场的主宰。</span><br style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff;" /><br style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff;" /></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">         开发者们经常思考的一个问题是该开发Web应用、本地应用，还是其他混合形式的内容。其实，该问题的答案虽不确定但十分简单，在正式的开发工作开始前，开发者需想清楚一些关键问题，如：目标受众是谁?开发该应用的目的是什么等等。</p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　市场研究公司Forrester表示，开发者不应该在本地代码和HTML 5之间进行非此即彼的选择。以下是Forrester关于四种开发方案的具体分析：</p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　<strong style="word-wrap: break-word;">1)本地应用：</strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;"><strong style="word-wrap: break-word;"><br style="word-wrap: break-word;" /></strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　提供最好的用户体验、性能，以及设备API访问(摄像头、联系人、手机状态等);不过，由于四个主要的移动平台(iOS、Android、Windows Phone、BlackBerry)使用不同的代码库，因此同一款应用需要针对不同的平台进行多次开发，导致实际的开发预算可能会比预期高出150%至210%。</p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　<strong style="word-wrap: break-word;">2)HTML 5/JavaScript Web应用</strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;"><strong style="word-wrap: break-word;"><br style="word-wrap: break-word;" /></strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　优点是浏览器无处不在，HTML 5的 和 标签，以及设备访问API极大地增强了Web应用的功能;不足是JavaScript没有本地代码快，用户体验和设计流畅性做得不是很好。</p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　<strong style="word-wrap: break-word;">3)HTML 5+JavaScript混合应用</strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;"><strong style="word-wrap: break-word;"><br style="word-wrap: break-word;" /></strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　该混合方案使其兼备多种本地功能，是Facebook移动应用和PhoneGap所采用的方案。从某种意义上来说，不管是对Web应用，还是本地应用，都最为两全其美。</p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　<strong style="word-wrap: break-word;">4)移动中间软件</strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;"><strong style="word-wrap: break-word;"><br style="word-wrap: break-word;" /></strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　集成客户端和服务器端组件开发等多种开发环境，多适用于使用Oracle或SAP等系统的企业级开发工作室。</p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　除此以外，开发者还需认真考虑的是成本和资源。在当前环境下，开发工作室通常会找一些精通Web技术的编码人员开发适用四种主要平台的应用。对Web应用来说，Forrester建议使用HTML 5+JavaScript混合方案;本地应用虽然有更好的视觉效果和更强大的设备访问API，但其跨平台的高额开发成本可能会让很多开发者望而却步。</p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　<strong style="word-wrap: break-word;">小结：</strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;"><strong style="word-wrap: break-word;"><br style="word-wrap: break-word;" /></strong></p>
<p style="word-wrap: break-word; font-family: 微软雅黑, Tahoma, Helvetica, SimSun, sans-serif; font-size: 14px; line-height: 25px; background-color: #ffffff; padding: 0px; margin: 0px;">　　总的来说，HTML 5+JavaScript混合方案是成本控制和潜在市场覆盖的最佳组合，极有可能成为未来移动开发市场的主宰。</p>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/196.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>2012年HTML5的14大预测</title>
		<link>http://html5cn.net/archives/190.html</link>
		<comments>http://html5cn.net/archives/190.html#comments</comments>
		<pubDate>Mon, 26 Dec 2011 09:33:07 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[html5前景]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=190</guid>
		<description><![CDATA[导读：本文作者Ben Savage ，创办了Spaceport.io，向移动游戏开发者提供原生Javascript和HTML5开发平台。 无论是当红科技企业如Zynga、Facebook、Google和Apple，还是刚刚诞生的初创企业，2012年都是决胜HTML5的一年。以下是关于HTML5在2012发展趋势的大胆预测： 一、欢迎来到更加互联的Web世界 2012年，HTML5将增加更多有用的开放接口API，供开发人员使用，让网站之间的连接更加紧密。 例如，Facebook上的Zynga游戏在iFrames里运行。通过调用最新的PostMessage API，这些游戏能在Facebook包容框架内互相之间通讯。在HTML5之前，不同窗口之间的通讯需要依赖远程服务器——或者使用不稳定的破解方法。 另外一个让人兴奋的新功能是CORS(Cross Origin Resource Sharing)。这使不同网站之间分享信息变得非常容易。例如，CORS将允许初创企业开发出一种能够编辑Facebook图片的编辑服务，允许你修改之后再上传，无需通过糟心的破解途径。 基于HTML5的的语义信息（例如Semantics和Microdata）创建提取Web页面信息的Web工具变得更加容易。因此，将有大量的Mashup混搭服务出现，出色的浏览模式也将越来越多（例如readers阅读器和translators） 二、Web浏览器看上去更像iPhone 每个人都喜欢苹果的iOS操作系统。现在你可以在HTML5上看到了。2012年浏览器将开始支持push notifications通知服务，geolocation地理位置服务，以及可以离线使用的应用程序。有些浏览器可能会采用更加类似iOS的用户界面。 三、越来越多的应用程序将基于HTML5创建，而不是以可下载应用程序的方式出现（例如金融时报的客户端） 你可能已经在使用电子邮件、日程和图片分享等Web应用程序，2012年将有更多类型的程序推出HTML5版本。你将看到类似Inkscape和Illustrator这样的内容创建程序也开始支持HTML5。 四、IE浏览器和微软将变得“酷”很多 微软对浏览器IE已经投入了巨资，并且很多资金用于提升HTML5的性能，未来将在IE10上有所体现。IE10凭借Canvas硬件加速功能将在速度测试上击败所有其他浏览器竞争对手。此外微软还在HTML5页面与桌面电脑的功能整合方面别具匠心，并最终推动HTML5应用的开发热情。 五、浏览器厂商将推出App Store业务 看到苹果公司的移动应用商店App Store的巨大成功，并且结合HTML5的日渐成熟，未来浏览器厂商将会构建自己的网络应用商店Web App Store，从而对苹果公司应用商店可能构成冲击。其实，谷歌公司的谷歌浏览器Google Chrome已经推出了网络应用商店。这个趋势对于HTML5应用开发者来说是个好事——这意味着程序将有更多的销售机会，尽管不同平台的支付平台和分账机制还未就绪。 六、至少有一个基于WebGL的重量级主机游戏会发布（再发布） 2012年至少有一个AAA级别的主机游戏公司会迈出这一步，发布一款基于WebGL的，无需客户端的3D Web游戏。也可能采用重新发布一部游戏大作的方式（例如Team Fortress 2或者Assassins Creed），或者是一款流行的多人在线游戏如魔兽世界，当然也有可能直接发布一款全新游戏。 七、多数应用都将通过离线缓存来支持离线工作 离线缓存技术将会迅速提高HTML5的可用性和应用范围。基于缓存而不需要联网，就可以查询本地数据库和服务，这一方面能提高HTML5应用的运行速度，提供类似传统桌面应用的流畅性，同时也能带来一些安全性话题，例如你可能在清理计算机缓存的时候不小心擦除掉你正在处理的文档或者工作进度，或者为恶意软件远程访问你电脑上的私密数据打开方便之门。 八、HTML5广告将取代Flash广告变得无处不在 HTML5广告可以兼容Flash广告，随着致力于基于HTML5提供各方面技术和工具以及各种服务的创业公司不断涌现，HTML5广告面临的sand boxing、安全问题以及认证工具等问题都将得到解决。 九、JavaScript随着内存管理和数据类型的改进而提高运行速度 JavaScript已经是世界上运行最快的脚本语言之一了，但还是有提高空间。Google Chrome已经开始着手推动更好的内存管理和垃圾收集算法。加之更优秀的数据类型管理，Javascript将获得与Java等成熟语言较为接近的性能表现。 十、Canvas硬件加速技术将被应用于多种浏览器（但不会是主流浏览器） 其他浏览器厂商都会学习微软引入硬件加速技术，不这么做就会显得落伍。火狐浏览器面临的形式最为严峻，如若不引入硬件加速将可能重演IE悲剧——迟钝、肿胀并被遗留代码活活拖跨。2012年主流移动浏览器还不会支持硬件加速，这估计要等到2013年。 十一、人们将能在移动设备上玩到Zynga等公司的HTML5流行游戏，但限于一些较为简单的游戏 你也许能看到有人玩纯HTML5版本的Zynga扑克、字谜、Mafia Wars等游戏，这些游戏可以在网页里，也可以在Facebook原生应用里运行。但这些都会是写基于菜单的游戏、棋牌游戏或者角色扮演游戏，更复杂的富有视觉冲击的游戏例如Ville还需要等待一段时间。 十二、Facebook将发布改进的HTML5 API，允许与其他网站更加无缝集成 十三、Facebook将于桌面更加无缝集成 想想吧，任意拖放、文件系统访问、照片同步以及桌面Widgets。这些功能将模糊桌面与浏览器之间的界限，让社交图谱与桌面体验紧密结合。 十四、苹果依然不会在移动版Safari上支持HTML5的声音功能 iOS 3时代，HTML5的声音功能在移动Safari上一切正常，但是苹果在iOS 4和5版本中禁用了大多数的API调用，因为这可能会冲击iTune业务。2012年，苹果依然不会放松对苹果生态系统的绝对控制权，并拒绝向HTML5提供声音接口API。]]></description>
			<content:encoded><![CDATA[<p><strong>导读：本文作者Ben Savage ，创办了Spaceport.io，向移动游戏开发者提供原生Javascript和HTML5开发平台。</strong></p>
<p>无论是当红科技企业如Zynga、Facebook、Google和Apple，还是刚刚诞生的初创企业，2012年都是决胜HTML5的一年。以下是关于HTML5在2012发展趋势的大胆预测：</p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong><span class="Apple-style-span" style="border-collapse: separate; font: normal normal normal 16px/16px 'Microsoft Yahei', Arial, 'Trebuchet MS', Verdana, Tahoma; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px;"><span class="Apple-style-span" style="text-align: left; line-height: 22px; color: #555555; font-size: 14px;"><a style="color: #f7941d; text-decoration: none; outline-width: 0px; font-size: 1em; vertical-align: baseline; border-width: 0px; padding: 0px; margin: 0px;" href="http://www.ctocio.com/ccnews/2261.html/attachment/html5in2012" rel="attachment wp-att-2263"><img class="alignnone size-large wp-image-2263" style="border-style: initial; border-color: initial; outline-width: 0px; font-size: 1em; vertical-align: baseline; text-decoration: none; padding: 2px; margin: 0px;" title="html5in2012" src="http://articles.csdn.net/uploads/allimg/111223/1031214506-0.jpg" alt="" width="580" height="197" /></a></span></span></strong></p>
<p><strong>一、欢迎来到更加互联的Web世界</strong></p>
<p>2012年，HTML5将增加更多有用的开放接口API，供开发人员使用，让网站之间的连接更加紧密。</p>
<p>例如，Facebook上的Zynga游戏在iFrames里运行。通过调用最新的PostMessage API，这些游戏能在Facebook包容框架内互相之间通讯。在HTML5之前，不同窗口之间的通讯需要依赖远程服务器——或者使用不稳定的破解方法。</p>
<p>另外一个让人兴奋的新功能是CORS(Cross Origin Resource Sharing)。这使不同网站之间分享信息变得非常容易。例如，CORS将允许初创企业开发出一种能够编辑Facebook图片的编辑服务，允许你修改之后再上传，无需通过糟心的破解途径。</p>
<p>基于HTML5的的语义信息（例如Semantics和Microdata）创建提取Web页面信息的Web工具变得更加容易。因此，将有大量的Mashup混搭服务出现，出色的浏览模式也将越来越多（例如readers阅读器和translators）</p>
<p><strong>二、Web浏览器看上去更像iPhone</strong></p>
<p>每个人都喜欢苹果的iOS操作系统。现在你可以在HTML5上看到了。2012年浏览器将开始支持push notifications通知服务，geolocation地理位置服务，以及可以离线使用的应用程序。有些浏览器可能会采用更加类似iOS的用户界面。</p>
<p><strong>三、越来越多的应用程序将基于HTML5创建，而不是以可下载应用程序的方式出现（例如金融时报的客户端）</strong></p>
<p>你可能已经在使用电子邮件、日程和图片分享等Web应用程序，2012年将有更多类型的程序推出HTML5版本。你将看到类似Inkscape和Illustrator这样的内容创建程序也开始支持HTML5。</p>
<p><strong>四、IE浏览器和微软将变得“酷”很多</strong></p>
<p>微软对浏览器IE已经投入了巨资，并且很多资金用于提升HTML5的性能，未来将在IE10上有所体现。IE10凭借Canvas硬件加速功能将在速度测试上击败所有其他浏览器竞争对手。此外微软还在HTML5页面与桌面电脑的功能整合方面别具匠心，并最终推动HTML5应用的开发热情。</p>
<p><strong>五、浏览器厂商将推出App Store业务</strong></p>
<p>看到苹果公司的移动应用商店App Store的巨大成功，并且结合HTML5的日渐成熟，未来浏览器厂商将会构建自己的网络应用商店Web App Store，从而对苹果公司应用商店可能构成冲击。其实，谷歌公司的谷歌浏览器Google Chrome已经推出了网络应用商店。这个趋势对于HTML5应用开发者来说是个好事——这意味着程序将有更多的销售机会，尽管不同平台的支付平台和分账机制还未就绪。</p>
<p><strong>六、至少有一个基于WebGL的重量级主机游戏会发布（再发布）</strong></p>
<p>2012年至少有一个AAA级别的主机游戏公司会迈出这一步，发布一款基于WebGL的，无需客户端的3D Web游戏。也可能采用重新发布一部游戏大作的方式（例如Team Fortress 2或者Assassins Creed），或者是一款流行的多人在线游戏如魔兽世界，当然也有可能直接发布一款全新游戏。</p>
<p><strong>七、多数应用都将通过离线缓存来支持离线工作</strong></p>
<p>离线缓存技术将会迅速提高HTML5的可用性和应用范围。基于缓存而不需要联网，就可以查询本地数据库和服务，这一方面能提高HTML5应用的运行速度，提供类似传统桌面应用的流畅性，同时也能带来一些安全性话题，例如你可能在清理计算机缓存的时候不小心擦除掉你正在处理的文档或者工作进度，或者为恶意软件远程访问你电脑上的私密数据打开方便之门。</p>
<p><strong>八、HTML5广告将取代Flash广告变得无处不在</strong></p>
<p>HTML5广告可以兼容Flash广告，随着致力于基于HTML5提供各方面技术和工具以及各种服务的创业公司不断涌现，HTML5广告面临的sand boxing、安全问题以及认证工具等问题都将得到解决。</p>
<p><strong>九、JavaScript随着内存管理和数据类型的改进而提高运行速度</strong></p>
<p>JavaScript已经是世界上运行最快的脚本语言之一了，但还是有提高空间。Google Chrome已经开始着手推动更好的内存管理和垃圾收集算法。加之更优秀的数据类型管理，Javascript将获得与Java等成熟语言较为接近的性能表现。</p>
<p><strong>十、Canvas硬件加速技术将被应用于多种浏览器（但不会是主流浏览器）</strong></p>
<p>其他浏览器厂商都会学习微软引入硬件加速技术，不这么做就会显得落伍。火狐浏览器面临的形式最为严峻，如若不引入硬件加速将可能重演IE悲剧——迟钝、肿胀并被遗留代码活活拖跨。2012年主流移动浏览器还不会支持硬件加速，这估计要等到2013年。</p>
<p><strong>十一、人们将能在移动设备上玩到Zynga等公司的HTML5流行游戏，但限于一些较为简单的游戏</strong></p>
<p>你也许能看到有人玩纯HTML5版本的Zynga扑克、字谜、Mafia Wars等游戏，这些游戏可以在网页里，也可以在Facebook原生应用里运行。但这些都会是写基于菜单的游戏、棋牌游戏或者角色扮演游戏，更复杂的富有视觉冲击的游戏例如Ville还需要等待一段时间。</p>
<p><strong>十二、Facebook将发布改进的HTML5 API，允许与其他网站更加无缝集成</strong></p>
<p><strong>十三、Facebook将于桌面更加无缝集成</strong></p>
<p>想想吧，任意拖放、文件系统访问、照片同步以及桌面Widgets。这些功能将模糊桌面与浏览器之间的界限，让社交图谱与桌面体验紧密结合。</p>
<p><strong>十四、苹果依然不会在移动版Safari上支持HTML5的声音功能</strong></p>
<p>iOS 3时代，HTML5的声音功能在移动Safari上一切正常，但是苹果在iOS 4和5版本中禁用了大多数的API调用，因为这可能会冲击iTune业务。2012年，苹果依然不会放松对苹果生态系统的绝对控制权，并拒绝向HTML5提供声音接口API。</p>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/190.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>11个有用的移动网页开发App和HTML5框架</title>
		<link>http://html5cn.net/archives/189.html</link>
		<comments>http://html5cn.net/archives/189.html#comments</comments>
		<pubDate>Mon, 14 Nov 2011 09:26:34 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[HTML5教程]]></category>
		<category><![CDATA[框架]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=189</guid>
		<description><![CDATA[对于本地的App有很多优势，虽然也有很多设计和开发上的挑战。这里列出了一系列有用的框架来帮助基于HTML的webapp开发。他们支持大部分流行的智能手机和平板。 1.Lungo.js：HTML5移动开发框架 Lungo.js是第一个应用HTML5和CSS3特性的移动开发框架。它可以帮助开发者创建iOS，Android，Blackberry和WebOS平台的应用。 Lungo.js不需要任何web服务器的支持就能帮助用户实现HTML5的功能，例如WebSQL, Geolocation，History，Device orientation等等。 2.JO：一个简单的HTML5 App框架 JO可以帮助你创建类似本地应用的Web App。JO是一个开源的免费框架，可以和PhoneGap一起使用。 3.Joshfire：跨设备的开发框架 Joshfire是一个开源的跨设备开发框架，帮助开发者创建可以在多种设备上运行的web app。它使用HTML5和JavaScript，并且允许开发者快速整合本地应用和特定的web应用。 Joshfire可以让你的应用接受键盘，鼠标，触摸屏，遥控器等设备的输入。Joshfire支持Node.JS。 4.Sencha Touch：基于HTML5的移动网页开发框架 Sencha touch可以让开发者创建类似本地应用体验的web app。Shencha是第一个使用HTML5，CSS和JavaScript并且支持音频/视频，本地存储，圆角，渐变背景以及阴影的开发框架。 5.Baker：HTML5电子书框架 Baker是用来在iPad或者iPhone平台上发布交互式的电子书或者电子杂志的HTML5电子书框架。. 6.Touchy Boilerplate Touchy Boilerplate是一个用来创建移动web app，包括HTML模板，Meta tag等的工具。Touchy可以支持动态页面导航，固定页头，滚动内容，浏览历史记录等功能。Touchy使用jQuery或者Zepto.JS。 7.Ripple：让移动开发测试更容易 在不同的平台上测试移动应用是一件令人头疼的事情。Ripple可以帮助你在不同的平台商测试并且调试你的HTML5移动应用。Ripple是一个chrome的扩展。它可以模拟每个设备的详细信息，例如user_Agent，Geolocation等等。 8.RestKit Restkit是一个objective-c的开发框架，目的是简化并加快与Restful的web service交互。它提供了一个简洁的HTTP request/response API和一个强大的对象映射系统。 9.HTML5兼容性表格 Mobile HTML5是一个表格，显示了不同设备/平台对HTML5特性的支持情况。包括Safari, Android, Blackberry，IE，Opera，Firefox，webOS和Symbian。 10.MobileESP：检测你的移动网页访问者 MobileESP项目提供了一套简单、轻量级的API让网站的开发者检测访客是不是使用移动设备，或者使用的是哪种移动设备。 11. Tiggr Tiggr是一个移动一个用创建工具，可以让你快速创建移动应用。你不需要写代码就能创建丰富的移动应用。 原文出处：skytechgeek 译文出处：开源中国]]></description>
			<content:encoded><![CDATA[<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">对于本地的App有很多优势，虽然也有很多设计和开发上的挑战。这里列出了一系列有用的框架来帮助基于HTML的webapp开发。他们支持大部分流行的智能手机和平板。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>1.Lungo.js：HTML5移动开发框架</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092113_1.jpg" border="0" alt="" width="500" height="266" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Lungo.js是第一个应用HTML5和CSS3特性的移动开发框架。它可以帮助开发者创建iOS，Android，Blackberry和WebOS平台的应用。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Lungo.js不需要任何web服务器的支持就能帮助用户实现HTML5的功能，例如WebSQL, Geolocation，History，Device orientation等等。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>2.JO：一个简单的HTML5 App框架</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092136_1.jpg" border="0" alt="" width="500" height="336" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">JO可以帮助你创建类似本地应用的Web App。JO是一个开源的免费框架，可以和PhoneGap一起使用。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>3.Joshfire：跨设备的开发框架</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092206_1.jpg" border="0" alt="" width="500" height="259" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Joshfire是一个开源的跨设备开发框架，帮助开发者创建可以在多种设备上运行的web app。它使用HTML5和JavaScript，并且允许开发者快速整合本地应用和特定的web应用。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Joshfire可以让你的应用接受键盘，鼠标，触摸屏，遥控器等设备的输入。Joshfire支持Node.JS。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>4.Sencha Touch：基于HTML5的移动网页开发框架</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092228_1.jpg" border="0" alt="" width="500" height="278" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Sencha touch可以让开发者创建类似本地应用体验的web app。Shencha是第一个使用HTML5，CSS和JavaScript并且支持音频/视频，本地存储，圆角，渐变背景以及阴影的开发框架。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>5.Baker：HTML5电子书框架</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092300_1.jpg" border="0" alt="" width="500" height="290" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Baker是用来在iPad或者iPhone平台上发布交互式的电子书或者电子杂志的HTML5电子书框架。.</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>6.Touchy Boilerplate</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092337_1.jpg" border="0" alt="" width="480" height="272" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Touchy Boilerplate是一个用来创建移动web app，包括HTML模板，Meta tag等的工具。Touchy可以支持动态页面导航，固定页头，滚动内容，浏览历史记录等功能。Touchy使用jQuery或者Zepto.JS。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>7.Ripple：让移动开发测试更容易</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092441_1.jpg" border="0" alt="" width="500" height="309" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">在不同的平台上测试移动应用是一件令人头疼的事情。Ripple可以帮助你在不同的平台商测试并且调试你的HTML5移动应用。Ripple是一个chrome的扩展。它可以模拟每个设备的详细信息，例如user_Agent，Geolocation等等。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">8.RestKit</p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092515_1.jpg" border="0" alt="" width="500" height="186" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Restkit是一个objective-c的开发框架，目的是简化并加快与Restful的web service交互。它提供了一个简洁的HTTP request/response API和一个强大的对象映射系统。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>9.HTML5兼容性表格</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092540_1.jpg" border="0" alt="" width="499" height="282" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Mobile HTML5是一个表格，显示了不同设备/平台对HTML5特性的支持情况。包括Safari, Android, Blackberry，IE，Opera，Firefox，webOS和Symbian。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>10.MobileESP：检测你的移动网页访问者</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092605_1.jpg" border="0" alt="" width="500" height="250" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">MobileESP项目提供了一套简单、轻量级的API让网站的开发者检测访客是不是使用移动设备，或者使用的是哪种移动设备。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><strong>11. Tiggr</strong></p>
<p style="font-size: 14px; line-height: 25px; text-align: center; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111114/104_111114092640_1.jpg" border="0" alt="" width="500" height="222" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Tiggr是一个移动一个用创建工具，可以让你快速创建移动应用。你不需要写代码就能创建丰富的移动应用。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">原文出处：<a style="color: #015fb6; text-decoration: none;" href="http://skytechgeek.com/2011/11/html5-frameworks-and-useful-apps-for-mobile-web-development/" target="_blank">skytechgeek</a></p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">译文出处：<a style="color: #015fb6; text-decoration: none;" href="http://www.oschina.net/news/23100/html5-frameworks-and-useful-apps-for-mobile-web-development" target="_blank">开源中国</a></p>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/189.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Adobe与苹果之争落败：停止开发移动版Flash</title>
		<link>http://html5cn.net/archives/188.html</link>
		<comments>http://html5cn.net/archives/188.html#comments</comments>
		<pubDate>Thu, 10 Nov 2011 09:06:23 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[HTML5 vs FLASH]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=188</guid>
		<description><![CDATA[北京时间11月10日凌晨消息，Adobe周三宣布，该公司将停止为移动浏览器开发Flash Player，这表明该公司基本上承认在与其竞争对手苹果长期以来的网络标准“战争”中落败。 业界人士指出，Adobe停止开发移动版Flash Player的决定意味着，网络开发者很可能将停止使用其Flash工具来制作用于移动浏览器的视频、网站和应用，这对iPhone和iPad用户来说是种安慰，原因是这些用户无法观看使用Flash工具制作的内容。但对于Adobe来说，这将损害其网站开发工具的销售表现。 Adobe今天表示，在停止开发移动版Flash Player以后，该公司将把业务重心转为向使用HTML5工具进行开发的网站开发者出售这种工具。 Abobe在周二晚间宣布，该公司计划裁减约7%员工，并向投资者发出警告称，该公司未来几年中的营收增长速度将有所放缓，原因是其将转向新的销售模式。 分析师指出，对于普通人来说，Flash和HTML5的区别可能只是技术上的不同，但对最近身故的苹果联合创始人史蒂夫·乔布斯（Steve Jobs）而言，他对两者的区别极感兴趣。乔布斯在世时拒绝在苹果移动浏览器中使用Flash技术，坚持声称这种技术给用户带来的浏览体验是次等的。Abobe则对这种说法作出反驳，并寻求向苹果施压，迫使其将Flash技术用于iPhone和iPad。 自苹果拒绝采用Flash技术以来，HTML5技术开始冒头，原因是开发者不希望iPhone和iPad用户无法浏览他们制作的内容。HTML5技术使用开放标准，这意味着象Adobe这样的某一家公司都无法对其拥有控制权。投资机构BGC Partners分析师科林·吉利斯（Colin Gillis）称：“乔布斯推动整个行业朝着HTML5的方向迈出了一步。开源技术经常都会取得胜利，即使这不意味着创新者能以此获利。” Adobe在周三发布的博客文章中承认，HTML5已经成为制作移动浏览器内容的开发者更加偏爱的互联网标准。Adobe副总裁兼交互开发业务总经理丹尼·维诺科（Danny Winokur）在文中表示：“除了个别特例以外，HTML5现已受到主要移动设备的广泛支持，这令HTML5成为在所有移动平台上制作和部署浏览器内容的最佳解决方案。”他还表示，Adobe将继续对用于移动应用的Flash技术进行投资，这些应用将通过其Abobe AIR平台在移动设备上运行，但用户必须首先安装AIR软件。]]></description>
			<content:encoded><![CDATA[<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">北京时间11月10日凌晨消息，Adobe周三宣布，该公司将停止为移动浏览器开发Flash Player，这表明该公司基本上承认在与其竞争对手苹果长期以来的网络标准“战争”中落败。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">业界人士指出，Adobe停止开发移动版Flash Player的决定意味着，网络开发者很可能将停止使用其Flash工具来制作用于移动浏览器的视频、网站和应用，这对iPhone和iPad用户来说是种安慰，原因是这些用户无法观看使用Flash工具制作的内容。但对于Adobe来说，这将损害其网站开发工具的销售表现。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Adobe今天表示，在停止开发移动版Flash Player以后，该公司将把业务重心转为向使用HTML5工具进行开发的网站开发者出售这种工具。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Abobe在周二晚间宣布，该公司计划裁减约7%员工，并向投资者发出警告称，该公司未来几年中的营收增长速度将有所放缓，原因是其将转向新的销售模式。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">分析师指出，对于普通人来说，Flash和HTML5的区别可能只是技术上的不同，但对最近身故的苹果联合创始人史蒂夫·乔布斯（Steve Jobs）而言，他对两者的区别极感兴趣。乔布斯在世时拒绝在苹果移动浏览器中使用Flash技术，坚持声称这种技术给用户带来的浏览体验是次等的。Abobe则对这种说法作出反驳，并寻求向苹果施压，迫使其将Flash技术用于iPhone和iPad。</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">自苹果拒绝采用Flash技术以来，HTML5技术开始冒头，原因是开发者不希望iPhone和iPad用户无法浏览他们制作的内容。HTML5技术使用开放标准，这意味着象Adobe这样的某一家公司都无法对其拥有控制权。投资机构BGC Partners分析师科林·吉利斯（Colin Gillis）称：“乔布斯推动整个行业朝着HTML5的方向迈出了一步。开源技术经常都会取得胜利，即使这不意味着创新者能以此获利。”</p>
<p style="font-size: 14px; line-height: 25px; text-align: justify; font-family: Helvetica, Tahoma, Arial, sans-serif; background-color: #f8fafd;">Adobe在周三发布的博客文章中承认，HTML5已经成为制作移动浏览器内容的开发者更加偏爱的互联网标准。Adobe副总裁兼交互开发业务总经理丹尼·维诺科（Danny Winokur）在文中表示：“除了个别特例以外，HTML5现已受到主要移动设备的广泛支持，这令HTML5成为在所有移动平台上制作和部署浏览器内容的最佳解决方案。”他还表示，Adobe将继续对用于移动应用的Flash技术进行投资，这些应用将通过其Abobe AIR平台在移动设备上运行，但用户必须首先安装AIR软件。</p>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/188.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Adobe对于HTML5和Flash未来战略</title>
		<link>http://html5cn.net/archives/187.html</link>
		<comments>http://html5cn.net/archives/187.html#comments</comments>
		<pubDate>Thu, 10 Nov 2011 08:57:26 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[HTML5 vs FLASH]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=187</guid>
		<description><![CDATA[今天，Adobe公司发布了最新的消息，对于Flash与HTML5的未来投资做了战略调整。Flash将专注于PC浏览和移动应用,Adobe将更加积极地为HTML5投入贡献，未来Flash在移动设备上的策略将是：专注于为广大Flash开发者提供将Flash内容通过AIR打包成为主流应用商店里的Native App的形式来服务。 主题 Flash将专注于PC浏览和移动应用 Adobe将更加积极地为HTML5投入贡献 文章要点总结： 过去2年，Adobe为许多移动设备的浏览器提供了几乎与PC上功能和体验一致的Flash播放器。现在，HTML5已经被主要移动设备终端所支持。HTML5会成为创造和部署跨移动设备浏览器内容的最佳解决方案之一。Adobe将积极的成为HTML社区的关键角色，与Google等公司一起成为HTML5的贡献方。 未来Flash在移动设备上的策略将是：专注于为广大Flash开发者提供将Flash内容通过AIR打包成为主流应用商店里的Native App的形式来服务。 Adobe不在继续开发对于未来新移动设备浏览器插件形式的Flash Player，主要针对Android和BlackBerry Playbook。但是Adobe将为已经安装浏览器播放器的移动设备提供软件关键更新和安全更新。（从Flash Player 11.1开始） Adobe仍然为合作伙伴提供源代码授权许可，方便他们的整合实现需求。 这表明Adobe要增加对HTML5的投资，同时对于Flash实施专注型的创新，比如高级Web游戏和增值视频领域。Flash Player 11的Stage3D硬件GPU 3D图形加速和HD视频保护技术就是证明。 Flash开发者在PC上可以通过Flash这些新功能受益，也可以通过Adobe AIR将Flash的功能打包成功实现扩展到PC之外的移动设备Native App，这一方案，我们将支持iOS iTunes App Store, Android Market，Amazon Appstore和BlackBerry App World。 Adobe已经开始Flash Player 12的开发，并且会加入大量高级的功能来提升Flash的游戏和高清娱乐体验。 同时，Adobe也同W3C和WebKit一起工作，为HTML5领域带来全新的CSS Shaders技术。 Adobe还将设计Flash平滑过渡到HTML5的新功能，能够便于开发者可以自信地投资于他们所了解和需要的技术领域。 文章出自：7yue的博客]]></description>
			<content:encoded><![CDATA[<p>今天，Adobe公司发布了最新的消息，对于Flash与HTML5的未来投资做了战略调整。Flash将专注于PC浏览和移动应用,Adobe将更加积极地为HTML5投入贡献，未来Flash在移动设备上的策略将是：专注于为广大Flash开发者提供将Flash内容通过AIR打包成为主流应用商店里的Native App的形式来服务。</p>
<p>主题</p>
<p>Flash将专注于PC浏览和移动应用</p>
<p>Adobe将更加积极地为HTML5投入贡献</p>
<p>文章要点总结：</p>
<p>过去2年，Adobe为许多移动设备的浏览器提供了几乎与PC上功能和体验一致的Flash播放器。现在，HTML5已经被主要移动设备终端所支持。HTML5会成为创造和部署跨移动设备浏览器内容的最佳解决方案之一。Adobe将积极的成为HTML社区的关键角色，与Google等公司一起成为HTML5的贡献方。</p>
<p>未来Flash在移动设备上的策略将是：专注于为广大Flash开发者提供将Flash内容通过AIR打包成为主流应用商店里的Native App的形式来服务。</p>
<p>Adobe不在继续开发对于未来新移动设备浏览器插件形式的Flash Player，主要针对Android和BlackBerry Playbook。但是Adobe将为已经安装浏览器播放器的移动设备提供软件关键更新和安全更新。（从Flash Player 11.1开始）</p>
<p>Adobe仍然为合作伙伴提供源代码授权许可，方便他们的整合实现需求。</p>
<p>这表明Adobe要增加对HTML5的投资，同时对于Flash实施专注型的创新，比如高级Web游戏和增值视频领域。Flash Player 11的Stage3D硬件GPU 3D图形加速和HD视频保护技术就是证明。</p>
<p>Flash开发者在PC上可以通过Flash这些新功能受益，也可以通过Adobe AIR将Flash的功能打包成功实现扩展到PC之外的移动设备Native App，这一方案，我们将支持iOS iTunes App Store, Android Market，Amazon Appstore和BlackBerry App World。</p>
<p>Adobe已经开始Flash Player 12的开发，并且会加入大量高级的功能来提升Flash的游戏和高清娱乐体验。</p>
<p>同时，Adobe也同W3C和WebKit一起工作，为HTML5领域带来全新的CSS Shaders技术。</p>
<p>Adobe还将设计Flash平滑过渡到HTML5的新功能，能够便于开发者可以自信地投资于他们所了解和需要的技术领域。</p>
<p>文章出自：7yue的博客</p>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/187.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>TOP30移动大抉择之海豚浏览器：Web App将成为主流</title>
		<link>http://html5cn.net/archives/186.html</link>
		<comments>http://html5cn.net/archives/186.html#comments</comments>
		<pubDate>Tue, 11 Oct 2011 09:07:39 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[其他]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=186</guid>
		<description><![CDATA[【中国Top30应用 移动时代大抉择系列报道】在今天这样的移动大航海时代，每个团队都渴望拥有一副可靠的航海图，或退而求其次，能在自己的航海图上标注上之前成功的船队的航行路线。在2011中国移动开发者大会召开之前，我们邀请到国内最优秀的30家移动团队分享他们对平台、用户和产品方向等重要抉择，希望对开发者有借鉴。第一期是海豚浏览器，分享人为百纳信息技术有限公司CTO刘铁锋。 2011移动开发者大会Top30应用之海豚浏览器 应用名：海豚浏览器 发布时间：2010年3月 官网：http://cn.dolphin-browser.com/ 团队/公司：百纳信息有限公司 团队规模：&#62;100 创始人/CEO：杨永智 融资情况：7月份获得红杉资本和经纬创投一千万美元投资 成绩：海豚浏览器Android版用户超过1000万，更是被CNET评选为2011年全球排名第二的最受用户欢迎的Android应用。新近发布的iPhone版海豚浏览器，也在不到两天内就冲到了二十多个国家分类排行榜第一名。iPad版不仅仅在近四十个国家分类排行位列第一，更是勇夺iPad美国免费应用排行榜第七名。 2011中国移动开发者大会参会情况：百纳信息公司CTO刘铁锋将作为演讲嘉宾参加大会“平台与技术”主题论坛，分享Web App在移动设备上的发展趋势,而公司美国区的市场负责人Edith Yeung也将参加本次大会，负责组织海外推广论坛并发表演讲。 海豚浏览器的移动大抉择 目前会优先选择哪个移动平台（iOS VS. Android VS. Windows Phone）？如何看待未来几大移动平台的竞争？ 从08年开始，我们一直在Android平台上开发应用，早期，包括海豚浏览器在内的几款应用都在Android Market多个分类名列前茅。最近我们才扩展到iOS版本，在这个平台上取得市场成绩也令人惊喜。关于iOS 、Android、Windows Phone的竞争，我们认为都有机会。 现在是否有投入HTML 5的研发?你认为多长时间内，HTML5会成为一个主流选择？ 我们非常看好Web App的发展，很早就在关注HTML5的发展，并认为未来3、5年内HTML 5技术就会爆发。HTML5其实本质上没有太多革命性的技术，这不过是各家巨头看准了在互联网上新的革命和洗牌机会。仔细想想HTML5为用户带来了什么？新的标签，也就是强制的展示方式标准；Drag &#38; Drop，也就是增强的类似Native App的交互方式；加入新的Canvas的绘图方式，能够直接访问GPU，这就是Native App使用所有的访问硬件资源的能力，再加入剩下的技术特性加起来，不就是之前流行的RIA吗? 不过是革了Flash和Sliverlight的命，让原先被这些公司垄断的标准被打破，产生新的平衡而已。这是业界在推动Web技术发生变革。 这些技术的改变，意味着产业趋势、技术趋势，甚至是技术标准已经为Web App铺平了道路，也就是说在移动领域一样会出现像PC时代所出现的C/S往B/S转型的必然趋势。 目前更专注于哪个市场（海外 VS. 国内）？未来呢？ 我们是支国际化的团队，之前一直面向海外市场，在美、日、韩都是当地Android平台上最受欢迎的手机浏览器。从7月开始，转战国内市场，以后是双边并重。 你的应用更偏向哪类用户？白领还是三低人群？ 因为海豚的国际化背景以及不断推出更酷的创新特性，目前的用户主要是白领等中高端用户。 产品方向是做游戏还是做应用？做大众消费还是面向企业市场？做平台基础应用，还是做垂直应用？ 浏览器算基础类工具，正如第一个问题中谈到的，移动领域也将出现像PC时代由C/S往B/S转型的必然趋势，承载这个未来的必将是移动浏览器，配合未来上百亿台移动终端，浏览器也将成为前景巨大的平台级产品，这也是海豚浏览器的未来。 现在已经和哪个开放平台有合作？未来您怎么看？ 目前有合作的是新浪微博，在海豚浏览器中，可以很方便地浏览和发布微博。 现在的收入模式是什么？你最看好的赢利模式是什么？未来赢利模式最大的机会是什么？ 目前还不注重盈利，看好广告和增值服务等模式在移动应用中的采用。 刘铁锋的个人移动生活 你有几部手机？最常用的是哪个手机？最常用的应用有什么？最喜欢和关注的应用是什么？ 现同时使用两款手机，一款是LG的双核Android手机，一款是iPhone。除了自己的应用，还常用的应用是新浪微博和Google Reader。 Top30App移动大抉择下期预告： &#62; [...]]]></description>
			<content:encoded><![CDATA[<p><span style="font-family: Arial, Tahoma, sans-serif; line-height: 18px; background-color: #f8fafd;"></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><span>【中国Top30应用 移动时代大抉择系列报道】在今天这样的移动大航海时代，每个团队都渴望拥有一副可靠的航海图，或退而求其次，能在自己的航海图上标注上之前成功的船队的航行路线。在</span>2011中国移动开发者大会<span>召开之前，我们邀请到国内最优秀的30家移动团队分享他们对平台、用户和产品方向等重要抉择，希望对开发者有借鉴。</span>第一期是海豚浏览器，分享人为百纳信息技术有限公司CTO刘铁锋。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><span style="color: #000080;"><span style="font-size: larger;"><strong>2011移动开发者大会Top30应用之海豚浏览器</strong></span></span></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111010/20_111010203703_1.jpg" border="0" alt="" width="158" height="158" /></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>应用名：</strong>海豚浏览器</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>发布时间：</strong>2010年3月</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>官网</strong>：<a style="color: #015fb6; text-decoration: none;" href="http://cn.dolphin-browser.com/">http://cn.dolphin-browser.com/</a></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>团队/公司：</strong>百纳信息有限公司</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>团队规模：</strong>&gt;100</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>创始人/CEO：</strong>杨永智</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>融资情况</strong>：7月份获得红杉资本和经纬创投一千万美元投资</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>成绩</strong>：海豚浏览器Android版用户超过1000万，更是被CNET评选为2011年全球排名第二的最受用户欢迎的Android应用。新近发布的iPhone版海豚浏览器，也在不到两天内就冲到了二十多个国家分类排行榜第一名。iPad版不仅仅在近四十个国家分类排行位列第一，更是勇夺iPad美国免费应用排行榜第七名。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px; text-align: center;"><img style="border-style: initial; border-color: initial; cursor: pointer;" src="http://articles.csdn.net/uploads/allimg/111011/20_111011112008_1.jpg" border="0" alt="" width="603" height="358" /></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>2011中国移动开发者大会</strong><strong>参会情况：</strong>百纳信息公司CTO刘铁锋将作为演讲嘉宾参加大会“平台与技术”主题论坛，分享Web App在移动设备上的发展趋势,而公司美国区的市场负责人Edith Yeung也将参加本次大会，负责组织海外推广论坛并发表演讲。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong> </strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><span style="font-size: larger;"><strong><span style="color: #000080;">海豚浏览器的移动大抉择</span></strong></span></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>目前会优先选择哪个移动平台（iOS VS. Android VS. Windows Phone）？如何看待未来几大移动平台的竞争？</strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">从08年开始，我们一直在Android平台上开发应用，早期，包括海豚浏览器在内的几款应用都在Android Market多个分类名列前茅。最近我们才扩展到iOS版本，在这个平台上取得市场成绩也令人惊喜。关于iOS 、Android、Windows Phone的竞争，我们认为都有机会。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>现在是否有投入HTML 5的研发?你认为多长时间内，HTML5会成为一个主流选择？ </strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">我们非常看好Web App的发展，很早就在关注HTML5的发展，并认为未来3、5年内HTML 5技术就会爆发。HTML5其实本质上没有太多革命性的技术，这不过是各家巨头看准了在互联网上新的革命和洗牌机会。仔细想想HTML5为用户带来了什么？新的标签，也就是强制的展示方式标准；Drag &amp; Drop，也就是增强的类似Native App的交互方式；加入新的Canvas的绘图方式，能够直接访问GPU，这就是Native App使用所有的访问硬件资源的能力，再加入剩下的技术特性加起来，不就是之前流行的RIA吗? 不过是革了Flash和Sliverlight的命，让原先被这些公司垄断的标准被打破，产生新的平衡而已。这是业界在推动Web技术发生变革。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">这些技术的改变，意味着产业趋势、技术趋势，甚至是技术标准已经为Web App铺平了道路，也就是说在移动领域一样会出现像PC时代所出现的C/S往B/S转型的必然趋势。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>目前更专注于哪个市场（海外 VS. 国内）？未来呢？</strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">我们是支国际化的团队，之前一直面向海外市场，在美、日、韩都是当地Android平台上最受欢迎的手机浏览器。从7月开始，转战国内市场，以后是双边并重。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>你的应用更偏向哪类用户？白领还是三低人群？</strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">因为海豚的国际化背景以及不断推出更酷的创新特性，目前的用户主要是白领等中高端用户。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>产品方向是做游戏还是做应用？做大众消费还是面向企业市场？做平台基础应用，还是做垂直应用？</strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">浏览器算基础类工具，正如第一个问题中谈到的，移动领域也将出现像PC时代由C/S往B/S转型的必然趋势，承载这个未来的必将是移动浏览器，配合未来上百亿台移动终端，浏览器也将成为前景巨大的平台级产品，这也是海豚浏览器的未来。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>现在已经和哪个开放平台有合作？未来您怎么看？</strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">目前有合作的是新浪微博，在海豚浏览器中，可以很方便地浏览和发布微博。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>现在的收入模式是什么？你最看好的赢利模式是什么？未来赢利模式最大的机会是什么？ </strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">目前还不注重盈利，看好广告和增值服务等模式在移动应用中的采用。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong><span style="color: #000080;"><span style="font-size: larger;">刘铁锋的个人移动生活</span></span></strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>你有几部手机？最常用的是哪个手机？最常用的应用有什么？最喜欢和关注的应用是什么？</strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">现同时使用两款手机，一款是LG的双核Android手机，一款是iPhone。除了自己的应用，还常用的应用是新浪微博和Google Reader。</p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>Top30App移动大抉择下期预告：</strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><strong>&gt; 顽石互动创始人</strong><strong>吴刚：日收入过6万美金的移动游戏《二战风云》</strong></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;"><span style="color: #333399;"><span style="font-size: larger;"><strong>为什么2011中国移动开发者大会值得参与？</strong></span></span></p>
<p style="font-size: 14px; line-height: 25px; text-indent: 0px;">由CSDN、创新工场联合主办的”2011中国移动开发者大会”（CMDC，2011 China Mobile Developer Conference），将于2011年11月3~ 4日在北京国家会议中心召开。大会专注于产业链中最活跃的因素——应用软件的研发、创新与商业模式。除国外著名的开发团队代表外，将首次实现国内最优秀移动开发团队（Top 30）的大聚会，共有超过2000名移动开发者齐聚一堂，李开复、雷军、周鸿祎以及来自Google、华为、腾讯、百度、阿里的业界领袖云集，分享交流移动大时代的开发心得。</p>
<p></span></p>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/186.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>摩托罗拉发布RhoElements HTML5框架</title>
		<link>http://html5cn.net/archives/185.html</link>
		<comments>http://html5cn.net/archives/185.html#comments</comments>
		<pubDate>Tue, 11 Oct 2011 08:54:53 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[其他]]></category>
		<category><![CDATA[RhoElements]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=185</guid>
		<description><![CDATA[摩托罗拉今天发布了RhoElements这是一个Web的应用框架，基于摩托罗拉7月刚刚收购的Rhomobile平台。 摩托罗拉称有计划在未来几个月内为合作伙伴和客户发布一个跨平台的开发工具、企业集成组件以及基于云的服务。 RhoElements提供了一个 HTML5/JavaScript/CSS 应用框架，支持HTML5特性包括：缓存、Web存储等。该框架是摩托罗拉收购Rhomobile后发布的第一款产品。其企业客户可利用RhoElements轻松开发和发布基于摩托罗拉嵌入式设备以及最新发布的Motorola ET1 这个基于Android的企业平板。 RhoElements可从here下载。]]></description>
			<content:encoded><![CDATA[<p><span style="font-family: Arial, Tahoma, sans-serif; line-height: 18px; background-color: #f8fafd;"></p>
<p style="font-size: 14px; line-height: 25px;">摩托罗拉今天发布了<a style="color: #015fb6; text-decoration: none;" href="http://support.symbol.com/support/search.do?cmd=displayKC&amp;docType=kc&amp;externalId=13299&amp;sliceId=&amp;dialogID=248088261&amp;stateId=1%200%20248092050">RhoElements</a>这是一个Web的应用框架，基于摩托罗拉7月刚刚收购的<a style="color: #015fb6; text-decoration: none;" href="http://www.oschina.net/p/rhomobile">Rhomobile</a>平台。</p>
<p style="font-size: 14px; line-height: 25px;">摩托罗拉称有计划在未来几个月内为合作伙伴和客户发布一个跨平台的开发工具、企业集成组件以及基于云的服务。</p>
<p style="font-size: 14px; line-height: 25px;">RhoElements提供了一个 HTML5/JavaScript/CSS 应用框架，支持HTML5特性包括：缓存、Web存储等。该框架是摩托罗拉收购Rhomobile后发布的第一款产品。其企业客户可利用RhoElements轻松开发和发布基于摩托罗拉嵌入式设备以及最新发布的<a style="color: #015fb6; text-decoration: none;" href="http://www.oschina.net/news/22112/motorola-unveils-rugged-et1-android-tablet-for-enterprise-types">Motorola ET1</a> 这个基于Android的企业平板。</p>
<p style="font-size: 14px; line-height: 25px;">RhoElements可从<a style="color: #015fb6; text-decoration: none;" href="http://support.symbol.com/support/search.do?cmd=displayKC&amp;docType=kc&amp;externalId=13299&amp;sliceId=&amp;dialogID=248088261&amp;stateId=1%200%20248092050">here</a>下载。</p>
<p></span></p>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/185.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5：移动互联网的第二个苹果</title>
		<link>http://html5cn.net/archives/184.html</link>
		<comments>http://html5cn.net/archives/184.html#comments</comments>
		<pubDate>Thu, 22 Sep 2011 09:27:29 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[html5前景]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=184</guid>
		<description><![CDATA[乔布斯的苹果重新定义了移动互联网，HTML5有望成为第二个苹果。它被公认为下一代的Web语言。它被喻为终将改变移动互联网世界的幕后推手。 2010年2月，苹果发布iPad时，就表示已支持HTML5。今年1月，其新官网上线，已完全使用HTML5。7月，苹果更是收购了html5.com的域名。谷歌的Youtube已部分使用HTML5，Chrome浏览器率先宣布全面支持HTML5的浏览器之一。前不久，微软也投入HTML5的怀抱，IE9开始对其支持。至此，世界三大移动互联网巨头都支持了HTML5。Facebook则在加紧移动Web应用商店的探索步伐。而UCweb的俞永福(微博)坚定地认为HTML5的到来将为手机浏览器带来新生。 巨头们都对HTML5顶礼膜拜，我们有何理由说不呢？ HTML5为手机而生 HTML5是HTML语言的更新版，是W3C与WHATWG双方经过多年努力在2006年达成的合作结果。相对于以往的版本，HTML5增加了一些有趣的新特性，如：用于绘画的canvas元素；用于媒介回放的video和audio元素；对本地离线存储的更好的支持；新的特殊内容元素，比如article、footer、header、nav、section；新的表单控件，比如calendar、date、time、email、url、search。 因为上述的新增特性，HTML5有了富媒体技术的浏览平台之称。这些特性极适合移动终端的用户体验，因而得到了各大互联网巨头的垂青。目前，支持HTML5的移动终端浏览器包括了业界主流的Safari、Chrome和IE9三家。另外，Firefox与Opera也部分支持HTML5。 移动终端之所以代表着互联网界的未来，就在于它的便携性。对于大部分国人来讲，移动终端目前的用途无非就是娱乐，看电影、听歌、打游戏等。娱乐类的应用决定了用户体验是移动终端软硬件大战中的决胜关键。HTML5带给了移动终端用户前所未有的用户体验。 拿HTML5支持的视频功能来说，首先这一功能大大方便了用户，用户只要打开支持HTML5的浏览器，就可以直接播放视频，而无需通过安装flash插件。苹果最初就是因为痛恨flash插件下载安装以及打开速度极慢，而在去年首推iPad时坚定地站在HTML5的阵营，而毅然举起反flash大旗，甚至断言“将来没有人会用Flash，整个世界都要改用HTML5。”所有人都在热议HTML5如何“秒杀”Flash，事实上，尽管HTML还存在很多问题，但许是因为Flash的劣势太过明显，让舆论的声音有些一面倒的趋势，除了因为效率低下经常导致浏览崩溃之外，FlashPlayer版权为私有，swf文件的内容也相对封闭且搜索引擎不友好。 而Flash最终真正被HTML5击败的地点也许是在移动互联网，正如乔布斯所说：“Adobe一再反复宣称Apple的移动设备不能提供“完整的网络体验”，因为网络上75%的影片是Flash格式。但他们没有说这些影片几乎所有都属于一个更为先进的格式：H.264。” 值得一提的是，目前大多数视频仍是通过Flash显示的。而HTML5的标准尚未建立，这也成为各大巨头争夺的焦点。以谁家的专利作为业界标准，当然谁家说得算。当前，video元素支持的三种视频格式中的MP4，以苹果的H.264视频编码最为流行。 HTML5让移动云成为可能 云计算是今年的沸点话题。然而，云计算在移动终端上的落地，HTML5功不可没。 业界习惯将应用程序商店里的应用称为原生应用，HTML5应用称为Web应用。苹果与谷歌应用商店开放API，为开发者们提供了云开发平台。 众所周知，没有互联网，云无以托身。换言之，云依互联网而生。而原生应用则把用户与互联网隔离得越来越远，用户的行为渐渐地受控于各大巨头。就在移动终端原生应用大行其道、浏览器奄奄一息之际，HTML5成为力挽狂澜的中流砥柱。有业内人士分析：“从某种意义上说，HTML5拯救了手机浏览器。它不仅让许多应用可以回归于网页，更能将功能扩大，在手机网页上呈现更为多样的富媒体形式。”而在笔者看来，HTML5之所以代表未来，根本原因在于其技术能够承载云，实现云在移动终端上的落地。 这是一个什么概念呢？ 设想一下，你在公司的PC机上看了28.54分钟的《变形金刚》，下班后急于知道剧情的你，在地铁上打开手机，连上网，打开刚刚看电影的那家网站(当然要支持HTML5)，登陆你的账户，你就可以从28.55分开始继续享用《变形金刚》了。这就是云存储，明显的不同就是它能让你的电影在不同的终端上续播。 Web App Vs App 随着乔布斯的辞职，苹果将成为悬念最大的公司。随着移动互联网Web App的风生水起，原生App在经历着严峻的挑战。 首先，对于平台开发者而言，以往受限于各大操作系统，一款应用只能跑在一家操作系统下。除非开发者不厌其烦地研发出三个版本的应用来。而基于HTML5的Web App则不需要有此担心，因为该网页语言在大部分操作系统和浏览器中都兼容，所以开发者一个应用仅研发就足够了。而HTML5本身可以帮助开发者在移动终端上直接去调试和修改应用，版本更新起来也会更快更方便，从而大量节约成本。 其次，对于用户来说，移动终端的Web App相当于PC端的Web App，用户不需要费时费力地将原生应用下载到小小的手机后才能使用，而只需要打开浏览器，就可以在网页上看电影、玩游戏了。 第三，应用程序商店存在应用程序推广难的问题。几十万级的应用程序商店，一款新推出的应用肯定是会被淹没的。然而，如果是基于HTML5的Web App的话，那么基于PC互联网而发展起来的网络广告和网络营销就可以在移动互联网中派上用场了。 最后，国外的Facebook、Twitter、Google+等，国内的人人、新浪微博、腾讯开放平台等将成为Web App开发者所钟情的乐土。而未来的Web App也将朝着移动化与社交化的趋势发展。 对于Web App与原生App的未来发展，业界各执一词，各方都有支持者。鉴于移动终端的Web应用刚刚起步，各方面都还不完善，而已有成熟生态的原生App却又存在诸多问题，未来一段时期内，二者将会斗争并存。目前，能够将移动终端Web App转化成原生App的移动中间件已经诞生。这足以说明，二者之间并不存在非此即彼的关系，而是互补共生及融合斗争的关系。]]></description>
			<content:encoded><![CDATA[<p><span style="font-family: Arial, Tahoma, sans-serif; line-height: 18px; background-color: #f8fafd;"></p>
<p style="font-size: 14px; line-height: 25px;">乔布斯的苹果重新定义了移动互联网，HTML5有望成为第二个苹果。它被公认为下一代的Web语言。它被喻为终将改变移动互联网世界的幕后推手。</p>
<p style="font-size: 14px; line-height: 25px;">2010年2月，苹果发布iPad时，就表示已支持HTML5。今年1月，其新官网上线，已完全使用HTML5。7月，苹果更是收购了html5.com的域名。谷歌的Youtube已部分使用HTML5，Chrome浏览器率先宣布全面支持HTML5的浏览器之一。前不久，微软也投入HTML5的怀抱，IE9开始对其支持。至此，世界三大移动互联网巨头都支持了HTML5。Facebook则在加紧移动Web应用商店的探索步伐。而UCweb的俞永福(微博)坚定地认为HTML5的到来将为手机浏览器带来新生。</p>
<p style="font-size: 14px; line-height: 25px;">巨头们都对HTML5顶礼膜拜，我们有何理由说不呢？</p>
<p style="font-size: 14px; line-height: 25px;"><strong>HTML5为手机而生</strong></p>
<p style="font-size: 14px; line-height: 25px;">HTML5是HTML语言的更新版，是W3C与WHATWG双方经过多年努力在2006年达成的合作结果。相对于以往的版本，HTML5增加了一些有趣的新特性，如：用于绘画的canvas元素；用于媒介回放的video和audio元素；对本地离线存储的更好的支持；新的特殊内容元素，比如article、footer、header、nav、section；新的表单控件，比如calendar、date、time、email、url、search。</p>
<p style="font-size: 14px; line-height: 25px;">因为上述的新增特性，HTML5有了富媒体技术的浏览平台之称。这些特性极适合移动终端的用户体验，因而得到了各大互联网巨头的垂青。目前，支持HTML5的移动终端浏览器包括了业界主流的Safari、Chrome和IE9三家。另外，Firefox与Opera也部分支持HTML5。</p>
<p style="font-size: 14px; line-height: 25px;">移动终端之所以代表着互联网界的未来，就在于它的便携性。对于大部分国人来讲，移动终端目前的用途无非就是娱乐，看电影、听歌、打游戏等。娱乐类的应用决定了用户体验是移动终端软硬件大战中的决胜关键。HTML5带给了移动终端用户前所未有的用户体验。</p>
<p style="font-size: 14px; line-height: 25px;">拿HTML5支持的视频功能来说，首先这一功能大大方便了用户，用户只要打开支持HTML5的浏览器，就可以直接播放视频，而无需通过安装flash插件。苹果最初就是因为痛恨flash插件下载安装以及打开速度极慢，而在去年首推iPad时坚定地站在HTML5的阵营，而毅然举起反flash大旗，甚至断言“将来没有人会用Flash，整个世界都要改用HTML5。”所有人都在热议HTML5如何“秒杀”Flash，事实上，尽管HTML还存在很多问题，但许是因为Flash的劣势太过明显，让舆论的声音有些一面倒的趋势，除了因为效率低下经常导致浏览崩溃之外，FlashPlayer版权为私有，swf文件的内容也相对封闭且搜索引擎不友好。</p>
<p style="font-size: 14px; line-height: 25px;">而Flash最终真正被HTML5击败的地点也许是在移动互联网，正如乔布斯所说：“Adobe一再反复宣称Apple的移动设备不能提供“完整的网络体验”，因为网络上75%的影片是Flash格式。但他们没有说这些影片几乎所有都属于一个更为先进的格式：H.264。”</p>
<p style="font-size: 14px; line-height: 25px;">值得一提的是，目前大多数视频仍是通过Flash显示的。而HTML5的标准尚未建立，这也成为各大巨头争夺的焦点。以谁家的专利作为业界标准，当然谁家说得算。当前，video元素支持的三种视频格式中的MP4，以苹果的H.264视频编码最为流行。</p>
<p style="font-size: 14px; line-height: 25px;"><strong>HTML5让移动云成为可能</strong></p>
<p style="font-size: 14px; line-height: 25px;">云计算是今年的沸点话题。然而，云计算在移动终端上的落地，HTML5功不可没。</p>
<p style="font-size: 14px; line-height: 25px;">业界习惯将应用程序商店里的应用称为原生应用，HTML5应用称为Web应用。苹果与谷歌应用商店开放API，为开发者们提供了云开发平台。</p>
<p style="font-size: 14px; line-height: 25px;">众所周知，没有互联网，云无以托身。换言之，云依互联网而生。而原生应用则把用户与互联网隔离得越来越远，用户的行为渐渐地受控于各大巨头。就在移动终端原生应用大行其道、浏览器奄奄一息之际，HTML5成为力挽狂澜的中流砥柱。有业内人士分析：“从某种意义上说，HTML5拯救了手机浏览器。它不仅让许多应用可以回归于网页，更能将功能扩大，在手机网页上呈现更为多样的富媒体形式。”而在笔者看来，HTML5之所以代表未来，根本原因在于其技术能够承载云，实现云在移动终端上的落地。</p>
<p style="font-size: 14px; line-height: 25px;">这是一个什么概念呢？</p>
<p style="font-size: 14px; line-height: 25px;">设想一下，你在公司的PC机上看了28.54分钟的《变形金刚》，下班后急于知道剧情的你，在地铁上打开手机，连上网，打开刚刚看电影的那家网站(当然要支持HTML5)，登陆你的账户，你就可以从28.55分开始继续享用《变形金刚》了。这就是云存储，明显的不同就是它能让你的电影在不同的终端上续播。</p>
<p style="font-size: 14px; line-height: 25px;"><strong>Web App Vs App</strong></p>
<p style="font-size: 14px; line-height: 25px;">随着乔布斯的辞职，苹果将成为悬念最大的公司。随着移动互联网Web App的风生水起，原生App在经历着严峻的挑战。</p>
<p style="font-size: 14px; line-height: 25px;">首先，对于平台开发者而言，以往受限于各大操作系统，一款应用只能跑在一家操作系统下。除非开发者不厌其烦地研发出三个版本的应用来。而基于HTML5的Web App则不需要有此担心，因为该网页语言在大部分操作系统和浏览器中都兼容，所以开发者一个应用仅研发就足够了。而HTML5本身可以帮助开发者在移动终端上直接去调试和修改应用，版本更新起来也会更快更方便，从而大量节约成本。</p>
<p style="font-size: 14px; line-height: 25px;">其次，对于用户来说，移动终端的Web App相当于PC端的Web App，用户不需要费时费力地将原生应用下载到小小的手机后才能使用，而只需要打开浏览器，就可以在网页上看电影、玩游戏了。</p>
<p style="font-size: 14px; line-height: 25px;">第三，应用程序商店存在应用程序推广难的问题。几十万级的应用程序商店，一款新推出的应用肯定是会被淹没的。然而，如果是基于HTML5的Web App的话，那么基于PC互联网而发展起来的网络广告和网络营销就可以在移动互联网中派上用场了。</p>
<p style="font-size: 14px; line-height: 25px;">最后，国外的Facebook、Twitter、Google+等，国内的人人、新浪微博、腾讯开放平台等将成为Web App开发者所钟情的乐土。而未来的Web App也将朝着移动化与社交化的趋势发展。</p>
<p style="font-size: 14px; line-height: 25px;">对于Web App与原生App的未来发展，业界各执一词，各方都有支持者。鉴于移动终端的Web应用刚刚起步，各方面都还不完善，而已有成熟生态的原生App却又存在诸多问题，未来一段时期内，二者将会斗争并存。目前，能够将移动终端Web App转化成原生App的移动中间件已经诞生。这足以说明，二者之间并不存在非此即彼的关系，而是互补共生及融合斗争的关系。</p>
<p></span></p>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/184.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>19个基于HTML5和CSS3开发的优秀应用程序</title>
		<link>http://html5cn.net/archives/183.html</link>
		<comments>http://html5cn.net/archives/183.html#comments</comments>
		<pubDate>Thu, 22 Sep 2011 09:26:45 +0000</pubDate>
		<dc:creator>愿景</dc:creator>
				<category><![CDATA[html5演示]]></category>

		<guid isPermaLink="false">http://html5cn.net/?p=183</guid>
		<description><![CDATA[今天，本文向大家展示19个基于HTML5和CSS3开发的优秀应用程序。HTML5可以说是近十年来Web标准最巨大的飞跃，它的使命是将Web带入一个成熟的应用平台，而CSS3同样给Web开发带来了革命性的影响，以前很多需要JavaScript实现的复杂效果，现在使用简单的CSS3就能实现。一起看看这些优秀的应用示例。 DeviantART Muro HootSuite X-Worlds CSSWarp Flickr Browser CSS3.0 Maker Coolendar Twimbow Sketchpad CloudCanvas Lislis Painter Scribd Google Body Browser LucidChart Diagramo Ultimate CSS Gradient Generator Citicles Tiny Fluid Grid 文章出自：梦溪天空的博客]]></description>
			<content:encoded><![CDATA[<p><span style="font-family: Arial, Tahoma, sans-serif; line-height: 18px; background-color: #f8fafd;"> </span></p>
<p style="font-size: 14px; line-height: 25px;">今天，本文向大家展示19个基于HTML5和CSS3开发的优秀应用程序。HTML5可以说是近十年来Web标准最巨大的飞跃，它的使命是将Web带入一个成熟的应用平台，而CSS3同样给Web开发带来了革命性的影响，以前很多需要JavaScript实现的复杂效果，现在使用简单的CSS3就能实现。一起看看这些优秀的应用示例。<span id="more-183"></span></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://muro.deviantart.com/" target="_blank">DeviantART Muro</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956263624-0.jpg" alt="" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://hootsuite.com/" target="_blank">HootSuite</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/09562Aa1-1.jpg" alt="hootsuite HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="324" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://x-worlds.com/" target="_blank">X-Worlds</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956262b1-2.jpg" alt="x worlds HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="392" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://csswarp.eleqtriq.com/" target="_blank">CSSWarp</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956261S6-3.jpg" alt="csswarp HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="450" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.gabereiser.com/flickr/" target="_blank">Flickr Browser</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/09562B224-4.jpg" alt="flickr browser HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="350" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.css3maker.com/" target="_blank">CSS3.0 Maker</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/09562C423-5.jpg" alt="css3 maker HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="399" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.coolendar.com/" target="_blank">Coolendar</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956262147-6.jpg" alt="coolendar HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="369" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.twimbow.com/" target="_blank">Twimbow</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956263140-7.jpg" alt="twimbow HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="324" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://mugtug.com/sketchpad/" target="_blank">Sketchpad</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956263364-8.jpg" alt="sketchpad HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="426" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.cloud-canvas.com/" target="_blank">CloudCanvas</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956263928-9.jpg" alt="cloudcanvas HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="442" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://lislis.sakura.ne.jp/canvas/paint/paint.html" target="_blank">Lislis Painter</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/09562BY4-10.jpg" alt="lislis painter HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="335" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.scribd.com/doc/30964170/Scribd-in-HTML5" target="_blank">Scribd</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956262360-11.jpg" alt="scribd HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="435" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://bodybrowser.googlelabs.com/" target="_blank">Google Body Browser</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/09562B0I-12.jpg" alt="google body browser HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="296" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.lucidchart.com/" target="_blank">LucidChart</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/09562A646-13.jpg" alt="lucidchart HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="442" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://diagramo.com/" target="_blank">Diagramo</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/09562C320-14.jpg" alt="diagramo HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="367" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.colorzilla.com/gradient-editor/" target="_blank">Ultimate CSS Gradient Generator</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956263205-15.jpg" alt="ultimate css gradient generator HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="485" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.citicles.com/" target="_blank">Citicles</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956261U4-16.jpg" alt="citicles HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="258" /></p>
<h3 style="padding: 0px; margin: 0px;"><a style="color: #015fb6; text-decoration: none;" href="http://www.tinyfluidgrid.com/" target="_blank">Tiny Fluid Grid</a></h3>
<p style="font-size: 14px; line-height: 25px; text-align: center;"><img style="border-style: initial; border-color: initial;" src="http://articles.csdn.net/uploads/allimg/110922/0956261648-17.jpg" alt="tiny fluid grid HTML5 Powered Web Applications: 19 Early Adopters" width="600" height="258" /></p>
<p style="font-size: 14px; line-height: 25px; text-align: left;">文章出自：<a style="color: #015fb6; text-decoration: none;" href="http://www.cnblogs.com/lhb25/archive/2011/09/21/html5-web-applications.html" target="_blank">梦溪天空的博客</a></p>
]]></content:encoded>
			<wfw:commentRss>http://html5cn.net/archives/183.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

