从HTML5移动应⽤现状谈发展趋势
时光如梭,⾃2008年HTML5诞⽣以来已经过去了5年的时间,作为新⼀代的Web标准,它⾃问世以来就受到⽅⽅⾯⾯的强烈关注,也引起了许多争议,⽀持者因其开放强⼤的特点⽽⿎吹它的美好前景,质疑者因其迟迟不能很好落地⽽怀疑它的实际作⽤。现在我们从现状⼊⼿,以提问的⽅式针对HTML5在移动平台的发展趋势做⼀个剖析,使得⼤家能够从纷繁复杂的信息中对HTML5的未来有更清晰的了解和认识。
针对移动平台,采⽤HTML5开发Web App(或者Hybrid App)有哪些优势?
使⽤HTML5开发的页⾯更具有现代⽹页的特性:界⾯华丽、⼈机交互出⾊、功能强⼤,现在我们已经很难单纯⽤传统的表现⽅式满⾜⽤户多种多样的需求,实现时也很难将HTML5与之前的版本割裂开来,所以我们可以认为在移动平台上绝⼤部分的现代Web App(或者Hybrid App)都将会采⽤HTML5开发。那么这样做究竟有哪些好处呢?
跨平台:⼀次开发,到处使⽤,不需要考虑兼容性。这可以极⼤减少跨平台开发⼈员数量和成本。如果反过来思考,现在移动平台⽇新⽉异,除了Android和iOS两强独⼤,还有Windows Phone、Blackberry、Bada等多个系统参与竞争,各⾃覆盖⼀部分⽤户,⽽⼀个应⽤要想覆盖这么多的平台,除了采⽤Web App的⽅式,⼏乎不可能解决这个现实的问题。
云端升级:在移动开发中最痛苦的是每次发布。发布时需要涉及多个应⽤商店和渠道,另外还要⾮常的谨慎。如果出现重⼤bug或者质量问题,通过新版本修复是极其⿇烦的事情,在这个过程中苹果App Store的审核期也让很多开发者⾮常头疼。⽽云端升级可以⼀次性覆盖所有⽤户,不需要⽤户⼿动升级和安装;有任何问题可以随时及时修复,不需要经过应⽤商店和⽤户⼿动更新,⼤⼤减少了风险和⼯作量。
与云计算平台结合,解决移动设备运算能⼒有限的问题:如果将Web App存放在云端的服务器上,可以很好的利⽤云计算平台强⼤的服务器和运算资源,完成很多受移动设备硬件能⼒限制难以完成的复杂⼯作。
能够更好的被搜索引擎索引和检索,并形成可量化的⼤数据:Native形式本⾝是封闭的,封闭、⽆序的数据对于信息流动来说是⼀种阻碍,很容易造成信息孤岛;Web本⾝的精神就是开放,同时HTML5提供的语义化标签能够更好的被识别和组织。如果我们能够通过Web App获取更多开放的信息与数据结构,才能更好的迎接和拥抱⼤数据时代。
⼈才储备巨⼤:传统的Web⼯程师都是潜在的HTML5⼯程师,转型相对来说更为容易。
绕过严苛的应⽤商店:应⽤商店对于应⽤过于严格的控制是⼀把双刃剑,对于许多开发者和应⽤开发商来说Web App的形式是绕过传统⼿机应⽤商店模式的最佳途径。
HTML5发展的现状如何?
1、HTML5标准进度
W3C规范在成为正式标准前通常需要历经5个阶段:⼯作草案(Working Draft)、最后修订(Last Call)、候选推荐(Candidate Recommendation)、建议推荐(Proposed Recommendation)和推荐(Recommendation)。
2012年12⽉17⽇,W3C宣布HTML5规范制定完成并发布了HTML5候选推荐规范,这代表HTML5规范已经稳定,今后只会对漏洞进⾏修正,企业和开发者有了稳定的实施⽬标,可以开展试验性实施。W3C将会开始致⼒于HTML5标准化的互⽤性测试和性能优化,并预计到2014年底发布HTML5推荐规范。
截⾄⽬前的HTML5标准进度
W3C计划把后继的技术升级汇总到2016年底发布的HTML 5.1中,例如改进视频字幕、响应式图⽚、更好的表单⽀持、新⼀代的iFrame 等。这种类似于迭代开发的⽅式让HTML5可以更快更好的落地,⽽不会⽆限期的推迟。
总结⼀下,HTML5标准的进度是规范已完成,正在逐步成熟和落地。
2、移动浏览器⽀持情况
和桌⾯端IE占有率持续下跌、Chrome迅速崛起的现状不同,移动平台的主流浏览器包括Safari、Android Browser、Opera Mobile、Chrome都较好的⽀持HTML5,同时它们的份额还在不断扩⼤。主流移动浏览器的⽀持让HTML5的平台更加普及,同时对HTML5的良好⽀持也让这些浏览器获得了更多⽤户的选择。
移动设备上HTML5访问系统硬件的能⼒还在落地中,同时移动浏览器对于基本HTML5标准的⽀持不是⼤问题,但是性能和速度还有待提⾼。⽤户移动设备和移动平台硬件的快速更新会解决⼀部分问题,例如2011年到2013年我就曾经使⽤过单核528M频率的G8、单核1G的Nexus One、双核1.2G的Galaxy SII,现在则是4核1.6G的NoteII。
3、各种开源或收费的框架、⼯具和平台如⾬后春笋般不断出现和完善
除了⽼牌的Sencha Touch、jQuery Mobile、PhoneGap、LungoJS外,还出现了例如像EaselJS、Construct2、GameMaker、limeJS、Impact、Crafty、Cocos2d-html5等游戏开发引擎或⼯具,GroundworkCSS、Skeleton、Gumby、Wirefy、Base等响应式设计框架,以及⼤量⼯具平台。需求是拉动技术进步的催化剂,⼤量⼯具的涌现证明了在HTML5开发⽅⾯有强烈需求的存在。
⽽⼤公司也纷纷推出各种HTML5⼯具和平台,例如百度的Web App平台西⽶露、Opera的游戏引擎Sphinx、Firefox的HTML5根平台Firefox OS、Intel的应⽤移植⼯具App Porter、任天堂的应⽤开发框架
NintendoWeb Framework等等。⽽Adobe在放弃移动端Flash的情况下,迅速发布了⼀系列HTML5开发⼯具,其中包括HTML5动画制作⼯具Adobe Edge Animate和类似于Flash编辑器的可视化HTML5响应式
网页app
设计⼯具Adobe Edge Reflow。
总体来看,HTML5⼯具和框架在经历了摸索的阶段后,正在逐步成熟和完善,有望进⼀步普及。
3、开发者继续保持很⾼的开发意愿
根据HTML5开发框架Kendo UI的调查显⽰,73%的受访者仍然对HTML5充满信⼼,超过94%的受访者正在或者将要使⽤HTML5来进⾏应⽤的开发,Appcelerator的相关调查也得出了相似的结论。同时国内的HTML5社区仍然保持很⾼的⼈⽓和关注度,社区活动也⾮常活跃。
4、应⽤发展情况
不知不觉中,HTML5正在⼤量进⼊我们的实际⽣活。其中⼀种应⽤⽅式是传统桌⾯⽹站的移动化,例如百度地图WAP版就使⽤了地理定位API和⼤量HTML5新特性,其它有代表性的应⽤还包括YouTube、新浪微博、携程、淘宝等等。
第⼆种应⽤的场景是纯移动Web App,例如记账应⽤DailyCost、天⽓应⽤Sun、阅读应⽤美阅等等,它们和Native App⾮常相似,在性能和体验上都有很好的表现。
记账应⽤DailyCost风格简单⼤⽅
还有⼀种⽅式是在Hybrid App⾥使⽤HTML5技术,现在许多应⽤都通过内置WebView来展⽰内容,例如下⾯要提到的LinkedIniPad 版。
⽽⽬前HTML5在移动平台上落地的实际阻碍都有哪些?
1、性能
HTML5的性能已经是⽼⽣常谈的问题了。问题的因素有多个,包括硬件、浏览器以及实现⽅式。硬件会随着移动设备的快速更新⽽得到改进,甚⾄在硬件层⾯,设备有可能针对HTML5进⾏特殊的⽀持。浏览器的性能在不断改进中,⽽应⽤的实现⽅式取决于开发者的编程模型和技能,这⼀部分是可以随着⼯具、框架的进步和开发⽔平提升⽽改进的。
2、移动设备的碎⽚化、浏览器的分裂
不同设备、不同浏览器对于HTML5的⽀持程度是不⼀致的,另外不同的⼿机分辨率也给WebApp的开发带来了挑战。
业界对于第⼀个问题的解决⽅案是优雅降级,⽽第⼆个问题就需要采⽤响应式设计(Responsive Desig
n)。响应式设计让我们应对设备碎⽚化有了更灵活的⽅式,⽽且它不仅仅只包括CSS3 Media Queries技术的应⽤,还包括响应式图⽚(ResponsiveImages)、响应式视频等多种技术,我们更应该将其视作⼀整套的现代⽹页设计⽅式。
响应式设计是解决移动设备碎⽚化问题的基⽯
3、缺少统⼀实现标准
某种程度上,当前阻碍HTML5迅速普及的最主要问题不是技术实现⽅式和⽅法少,也不是性能差,⽽是太分裂、缺少统⼀的实现标准。
例如,Sench Touch、jQuery Mobile、limeJS、Kendo UI、Impact,以及easeljs、GameMaker、Construct2,你能搞清楚它们的特点、都有哪些不同的适⽤场景以及各⾃的优劣吗?
⽽像Google和Apple为Android、iOS平台各⾃提供了⼀套标准的开发⼯具和框架,帮助开发者只需要专注在实现上,就能够快速⾼效的开发出最终产品。⽽HTML5太开放所带来的结果就是没有统⼀的实现⽅式和标准,这⼀⽅⾯导致开发者需要经历选型的痛苦,另⼀⽅⾯不能保证其实现的正确性和⾼效性。
W3C更多只关注标准,不过它们也在针对HTML5的表现和性能进⾏测试,⽽从标准到技术到应⽤有距离,是现实存在的问题,这个过程需要⼀段时间来完善和改进。
4、⽤户习惯
⽤户在移动设备上⽬前⼤多数时候习惯于通过单个App来满⾜需求,所以标准的Web App对⽤户来说认知度不如Native App。但是⽤户习惯是逐渐培养出来的,当Web App的性能、表现和易⽤性上逼近或者等同于Native App的时候,⽤户会有⼀个逐步认知,逐步向Web App 迁移的过程。
针对HTML5移动平台,开发的最佳实践有哪些?
1、开发者应当意识到,在移动端,HTML5应⽤有适合它的特别的表现⽅式,⽽不应专注和原⽣应⽤做的完全⼀致。这才能发挥出HTML5的优势和避免陷⼊⽆尽的痛苦。事实上如果要开发与原⽣应⽤性能相当的HTML5应⽤,所投⼊的精⼒、测试和资源远远超过原⽣应⽤。
这⼀⽅⾯⽐较有代表性要数Linkedin iPad版,它95%以上都采⽤HTML5开发,性能和界⾯都⾮常优秀,⽽为了保证良好的性能体验,设计时特意去掉了许多不必要的设计元素,例如所有的渐变背景和圆⾓,因为这会造成渲染性能降低。
LinkedIn iPad版是有代表性的HTML5应⽤之⼀
2、有针对性的根据HTML5的特性对应⽤进⾏设计。HTML5有它的适⽤场景,不是放之四海⽽皆准,虽然这个场景正在变得越来越⼴阔和丰富。Web App不会完全取代Native App,Native App也不会战胜We
b App。共⽣共赢,各擅胜场,它们有各⾃适合的场景和⽤途,会逐渐并存下去。所以我们需要做的是不要⽤Native App的思维来设计Web App,⽽应该着⼒于发挥HTML5的长处,做出特⾊。
以百度相册iPad版为例来进⾏说明,除了保证良好的流畅性和交互外,我们还通过HTML5尝试了许多有趣和酷炫的创新功能。其中包括:
1)利⽤传感器来展⽰图⽚的移动和渐变效果:当iPad⽔平倾斜的时候,封⾯图⽚会向同样⾓度的慢慢移动,通过视差展现出⼀种美轮美奂的效果。
2)⽀持图⽚⼿势操作:⽤过iPad的朋友都对相册⽅便快捷的⼿势操作赞不绝⼝。⽽由于HTML5对于⼿势的⽀持也已经⽐较完善,所以这次我们在百度相册iPad版本⾥尝试添加了对绝⼤多数⼿势的⽀持来贴近⽤户习惯和⽅便⽤户操作,例如展开相册、关闭单张图⽚、旋转图⽚等等。
百度相册iPad版尝试了多种HTML5创新功能
3、开发者覆盖全平台的最佳实践是OnePlatform+ HTML5,即关键平台(可以是Android,也可以是iOS)采⽤Native App,⽽剩下的所有平台采⽤HTML5的Web App来适配。考虑到成本和效率问题,这种⽅式会变得越来越普遍。
移动App产业化趋势越来越明显,那么HTML5发展的趋势和所带来的机会会有哪些呢?
1、桌⾯端IE逐步衰落,⽀持HTML5的现代浏览器逐步占领市场已经是显⽽易见的事情。⽽移动平台更为乐观,据估计2013年⽤户对于智能终端更新换代的⽐例会在50%以上,设备的迅猛更新会让⽀持HTML5的现代浏览器轻松获取80%以上的市场份额。
2、2012年HTML5已经正式发布,标准趋于稳定,2013年标准会更成熟,更加便于普及和应⽤。HTML5规范将逐步落地,随着WebGL、Device API的成熟,HTML5能实现的界⾯效果和功能会更加⼴阔。当基于HTML5的移动App性能和表现上⾮常趋近于Native App,⽽且有成熟的开发标准时,会出现⼀个App⼤量向HTML5迁移的浪潮,导致的结果是⽤户也⼤量向HTML5应⽤转移。
同时⽬前智能终端美国和中国的渗透率在50%以上,随着它们的逐渐普及,会出现⼀波应⽤从桌⾯端向移动端迁移的过程,⽽在这个过程中,HTML5将会成为很⼤⼀部分应⽤的技术选择。
HTML5应⽤⼤量的出现会导致移动端有可能诞⽣HTML5应⽤的showcase,极有可能产⽣类似于韩国Anipang这样的成功游戏应⽤。        3、基于HTML5的⼿机⽹页游戏、资讯新闻类应⽤将会蓬勃发展。
现在,桌⾯端的HTML5游戏已经出现了像Disney的魔境仙踪游戏《Find Your Way to OZ》、EA的《命令与征服》、Rocket Pack的《Warimals:Cats vs. Dogs》等优秀作品,那么在移动平台上呢?
韩国Kakao Talk和⽇本Line平台在移动游戏⽅⾯已经取得了初步的成功,中国移动游戏的发展趋势将和
韩国⾮常类似,会出现⼀个迅猛增长的态势。⽽游戏在桌⾯端的发展历程是从单机桌⾯客户端、联⽹桌⾯客户端再到⽹页游戏,因为⽹页游戏迎合了当今⽤户时间碎⽚化和追求简单易上⼿的需求,⽽移动平台上随时随地的碎⽚化时间正好切合⽹页游戏的特质,所以HTML5⼿机⽹页游戏有可能出现爆发性增长的态势,尤其是在平台上,⽬前可以看到许多⼤公司和创业公司都在进⾏这⽅⾯的努⼒。
另外⼀类有代表性的资讯新闻类应⽤重在内容,⽽处理内容正是Web的专长,⽽更⾃由的分发形式、更便捷的搜索引擎检索、更⼴泛的跨端需求是这类应⽤的最⼤需求。现在国外《⾦融时报》、《纽约时报》等传统媒体都已经尝试⽤HTML5的⽅式来分发移动应⽤。
4、HTML5⽣态链上相关平台和⼯具的缺乏是潜在的机会,例如安全、测试、开发、系统等多个⽅⾯。
HTML5移动应⽤产业链上的必需品包括两类:平台类产品,例如统计平台、⽀付平台、⼴告平台、游戏引擎等;以及基本以开源和免费为主的⼯具类产品。这⼀⽅⾯⼤公司、创业公司以及个⼈开发者都在开始尝试。
5、企业移动化这个⽅向对于HTML5来说也有很⼤潜⼒。对企业级应⽤来说,⽤户体验和⽤户界⾯要求不像消费类应⽤那么⾼,例如丰富多彩的产品界⾯、快速流畅的滑动体验、千变万化的⼿势操作,所以更适于发挥HTML5的长处⽽避免其劣势。
例如,Path、FlipBoard、iPhoto这样界⾯华丽、动画绚丽的应⽤其实在企业级来说并没有太多的实际意义,也不会要求性能像切⽔果、Real Racing那样流畅和⽀持多点触摸。在桌⾯端,传统的OA已经可以很好的满⾜企业的需求,⽽在移动端,企业更关注的是服务的稳定性以及随时随地办公的便捷性。
企业应⽤不需要像Real Racing这样界⾯华丽、体现苹果新特性

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。