HTML 5 应用的手机应用用户体验报告能达到本地应用那么好吗

移动开发中HTML5能否替代本地程序?
  随着移动设备越来越先进,对HTML5的支持度越来越高,我们进军移动领域的时候,都会遇到一个问题,是选择HTML5和还是Native(用原生代码编写的本地程序)?HTML5的前景无疑是诱人的,一句&Write once, run anywhere&就可以秒杀一切。笔者最近两年来对HTML5与Native有较为深入的研究,觉得两者之间不能仅仅是二分法来选择,还要根据企业自身的情况、团队的构成、公司的战略以及产品的特点来综合选择。  HTML5的发展前景我无疑是非常看好的,各大公司也不遗余力的推动,目前主流的三大智能机操作系统iOS、Android和WIndows Phone都已经支持大部分的HTML5特性。而移动设备硬件军备竞赛也为HTML5扫清硬件障碍。按照现在的发展速度,我判断是在三年以内甚至更快,移动设备运行HTML5将会完全没有压力,无论是标准还是硬件。现在主流的智能机已经配置双核处理器(之前笔误为浏览器)和1G及以上的内存,今年再出智能机没这个配置你都不好意思发布了。  谈谈HTML5  1.HTML5可以让你摆脱对平台的依赖,用户打开浏览器,直接就可以访问你的应用,而不需要经过各种Store的审核。  2.实时更新,通常平台的审核都需要七个工作日左右的时间,如果你发布之后发现问题怎么办?Web方式就不存在这种问题。  3.Write once, run anywhere?  这是多少程序员的梦想,也曾经是Java让人心动的地方,但真正做过跨平台解决方案的人都知道,这只是一句口号而已,跨平台没那么容易玩转的。没错,HTML5可以实现Write once, run anywhere,但我们总不能写一个Hello World来run anywhere吧。不同平台有自己的特性,不同平台用户也有自己的操作习惯,如果你想讨好所有人,也就意味着你无法讨好任何人。  4.减少开发工作量或者让开发变得更简单?  对老板来说,这是一个非常诱人话题,因为工作量的减少就意味着节省更多的钱,没有老板不喜欢用更少的钱办更多的事。而且目前一个非常大的问题是,移动设备开发人员特别是iOS开发人员非常不好找,因为技术好的都自己做应用了,人家自己也能赚个月薪上万甚至更多,为什么要进你的公司?怎么说也是自己的事业,拥有无限可能,还可以充分享受自由。但如果可以充分利用HTML5,那么我们就可以招聘Web前端的开发人员来构建移动应用,这样就不愁招人的有问题。因为在许多人的眼里,HTML5/CSS/Javascript都是没多大技术含量的东西,实在找不到人,找些实习生学学也就会了。  但问题是,工作量真的会减少吗?技术门槛真的那么低么?答案是NO!  我曾经花了半年的时间去开发一个基于HTML5的移动框架,用来模拟Native应用,让HTML5应用看起来尽可能看起来像本地应用,注意:是像。这有点像jTouch,但不一样的是,它能和Native程序很好地交互,并且能调用本地资源等等特性。但最后结果确不是那么令人满意,比如HTML5在动画切换的时候,有时候候会有一些莫名其妙的问题,当然你可以告诉我把动画效果关了,但这看起来很死板,最后我不得不关闭某些动画。而用Objective-c编写程序就没这么多事了,几句简单的代码可以实现很酷的动画,用HTML5需要更多的代码,甚至根本无法实现。  而且移动设备上的HTML5开发对开发人员的技术有非常高的要求,不是一般的Web前端人员能解决的,通常拥有这样技术的人才,工资水平也不会比Native开发人员低多少。如果你仅仅是要开发一个移动设备上的网站,这会简单很多,但如果你希望模拟Native应用,并且拥有较高的效率和优雅的用户体验,这就很有技术含量了。不要小看Javascript这类Web开发语言,通常我的看法是越简单的语言越会体现出技术人员的水平,特别是规划设计能力。  5.其它问题,资源调用的限制,比如说在iOS中有Javascript运行不能超过15秒的限制,不能调用本地硬件设备(如相机等),无法使用推送服务等。  如何选择?  是否这样,我们就不要选择HTML5了呢?我在前面说过:&要根据企业自身的情况、团队的构成、公司的战略以及产品的特点来综合选择&,我最近在关于HTML5讨论的微博上也有谈到:&HTML5是战略性方向,Facebook和Google已经布局,Google Mobile在iPhone上的体验可以媲美Native。基本上Native+Web App可以秒杀多数应用,如果不愿意受制于各种Store,单独的Web App也是一个不错的方向。对于游戏类和对硬件环境依赖严重的应用,只能是是Native&。仅管有这样那样的问题,但HTML5是一种趋势,在未来三至五年,HTML5将会取代很多本地应用,但就像多年前我们一直在谈B/S架构取代C/S架构一样,这需要一个过程。  通常在HTML与Native之间,我们有三种选择&&HTML5、Native App以及HTML5+Native,HTML5就是指纯Web的移动应用,用户需要打开浏览器,然后输入应用的网址访问。Native指的是基于特定平台开发的应用。Native+HTML5实际上是一种加壳的方式,将HTML5用和浏览器封装起来,但这对用户是不可见的,用户没有任何异物感,和Store上下载的App没有什么两样。  就我个人而言,我是比较推崇HTML5+Native的,这种加壳的方式,可以让你享受Native与HTML5的双重好处,但缺点是对技术含量要求较高。当然我这里指的不是简单地把HTML5封装到一个浏览器里面,Native与HTML5会有许多的交互,实际上这有点像混合硬盘,我们即便享受SSD的快速,但我们又想获得机械硬盘的高性价比。我认为在5-10年内,这都会是一种不错的解决方案,当HTML5和硬件发展到一定水平之后,我们再完全转向HTML5成本也会非常低的。  如何做?  假定现有一个对本地环境依赖不那么严重的项目,如微博客户端,各种社交美食甚至LBS应用,我们都可以采用HTML5+Native。如图所示,我们可以将核心的代码Core层用封装起来,这个代码和平台无关,主要是业务逻辑以及和Shell的交互,代码用Web语言编写。在Core层上我们再根据不同的移动平台制作不同的UI。最后我们将上述两层放到各平台的Shell中,这个Shell主要是由浏览器来完成工作,当然还包括一些硬件操作和读取本地资源,如GPS、重力感应、相机调用、地图、推送通知或者IAP等。  我们可以把Web的升级部分部署到服务器上,用户运行App后,App会向服务器讲求获取最新的Web程序并下载运行,这样可以达到跳过各种Store的更新审核,达到快速更新的目的。而且假如用户无法访问互联网,我们可以让用户使用上一个版本的程序,不会像纯Web App那样要求用户一定要联网  好处  1.用户可以离线使用  2.更新下载量及少,可以全部更新,也可以选择替换部分文件  3.代码很安全安全,众所周知Web应用有一个很大的问题就是代码安全的问题,但现在我们可以将Web代码全部加密,本地应用解密后再运行,大大的提供了代码的安全性。  4.可以通过浏览器作为中介充分利用Native的好处,比如说可以使用GPS、照相机、本地相册、读取本地联系人,也可以使用推送功能等,最重要的是,某些Web无法实现的功能,我们可以利用Native来实现。  5.跨平台,多数核心代码不用重写,Javascript的代码用得好的话,在许多地方都可以用到,包括移动应用、移动网站、PC网站、各种浏览器插件,甚至可以用WebKit封装作为跨平台的应用程序。诚然,这种方式并非完全跨平台,但这样也足以减少很多工作量了,特别是后期的维护。而且完全的跨平台是没有意义的,不同平台有自己的风格,为了更好的用户体验,界面层还是需要针对性开发的。  坏处  我觉得最大的坏处是技术难度高,如果仅仅是简单的浏览器封装几个HTML文件,那没什么技术难度,但如果要打造一个系统级的东西,这就很有技术难度了。这要求有人要了解三个主流平台的浏览器特性,通晓Native程序的开发,要精通HTML5/CSS3/Javascript,最重要的是,要有较强的架构设计能力。  如果要再找一个坏处的话,就是它不能满足所有的需要,它并不能代替Native,但我认为他可以替代大部的Native。  适合我们吗?  首先从产品的角度考虑,你的产品是否严重依赖于本地环境,比如说图像处理和华丽的游戏之类的。第二要考虑的是你的技术团队的构成,如果你们的团队有一个能解决这些问题的牛人,并且有一些清通Web前端的人,那我觉得你可以考虑用这种方式。技术选型非常重要,稍有不慎,后患无穷。第三个要考虑你们公司的战略,对HTML5未来发展的看法,愿意在移动互联网上付出多少代价,是否愿意做前瞻性的事,是否愿意在前期投入较多的资源,是否允许试错等等。  本文来自涂雅,。
  除非注明,文章均为原创,转载请以链接形式标明本文地址
  本文地址:
努力学习中。。。。。。。
.满天红石头
全都云端,全跨平台,现在干啥都不考虑cpu计算能力吗?还有带宽等等?都是硬件厂商的托?
adobe air呢?
我来了 支持下你!
.o0_路人甲_0o
Native原生代码的速度是无可替代的 HTML5外壳配上Native内核应该可以兼顾速度的方便
很多项目都指望成为所有App的核心,好像东方不败似的一统江湖。其实这想法几乎被证明了就是个笑话,就拿“著名”的java来说,低下的效率,永远都是Beta版本的稳定性,根本就统不了。其实,跨平台的最佳解决方案就是:只用一个平台,除此之外,别无他法。因为这根本不是个技术问题,而是个利益问题。
Native+HTML5的混搭式应用是趋势,但HTML5的性能还是有待提升
web app的适用性无疑是最诱人的
还是有可能的,而且很可能是JavaScript来担负此重任。无为无不为,前端后台、WebApp,通吃!
html5确实是夜个值得深入的技术!不一定要取代,多元混合更完美!
.Android-阿蛋
肯定可以流行,但是不能替代本地。
Native+壳的方式+1
.Ciscogeek
试了一下中移动HTML5的手机阅读,2分钟后就删掉了。让iPhone 有安卓的体验。
同意,HTML5还是有局限性的。
就拿WEB开发的框架来说,框架功能越强大,性能越地下,效率最快的永远是最原始的方式,文中也提到,这需要具体问题具体分析。性能问题始终存在,因为硬件提升始的同时终伴随着软件功能的开销提升。html5 native 以及混合 ,还应该算上跨平台框架,都将存在。
说是代替本地程序有点痴人说梦,但是绝对可以带来新的用户体验。
HTML5标准需要完善到一定程度浏览器对标准支持需要达到一定程度JS引擎执行效率需要达到一定程度这是移动开发中HTML5面临的最大问题我想开发工作量,开发难度并不是大问题,未来javascript框架会越来越好,开发会越来越便捷。
.移动互联网kevin
html5是趋势,但目前效率还是不太友好,特别对一些较低端设备来说
不妨看看“36氪”网站的这篇文章:Mozilla的移动操作系统Boot2Gecko和Gaia UI首次曝光注:没法提供链接,因为链接中的单词被误判而xxx,请自搜索
对新技术保持观望,未来如何,实在难说。
目前 native的体验还是好
html5,支持一个吧.
这个趋势趋了很久了。所有人都看到的趋势究竟能不能算趋势?以此来指导工作靠谱吗?
要看JS引擎了, 现在chrome的js速度远非IE4.0能及的.
性能始终还是个问题。
最近正在研究HTML5
拜读native+html5。。。
.欧阳工作室
可能没那么块成熟
.waiting的无限博客
这个有好处也有坏处,看各人喜好了
我只知道要是html5真打败了native,那么未来的应用层的移动开发人员将越来 越便宜
不管怎样,都要支持!
程序猿必备一门脚本语言防身啊!
web app是跨平台适用性是最诱人的,但也是最不切实际的。如果你想讨好所有人,也就意味着你无法讨好任何人。
暂时先不用,完善后应该会更好些。。
试了一下中移动HTML5的手机阅读,秒就删掉了。让iPhone 有安卓的体验。
暂时还不那么好用吧,起码要等它成熟之后再用
这篇文章写的很好
.抓老鼠的大黄
welcome HTML5
IT新技术新概念层出不穷,风潮一变,就成过眼烟云,云计算与分布式计算是统和分的较量,两者最终会处于相安无事的状态,不可能灭掉一方。
我就不信HTML5结合JS和CSS的执行效率会很高。早年我用JS+CSS1写的DHTML,直接把IE4.0给拖到死机
赞助商广告
本站采用创作共用版权协议, 要求署名、非商业用途和相同方式共享. 转载本站内容必须也遵循“署名-非商业用途-相同方式共享”的创作共用协议.HTML5对移动应用的影响_百度文库
两大类热门资源免费畅读
续费一年阅读会员,立省24元!
HTML5对移动应用的影响
上传于||文档简介
&&H​T​M​L,​移​动​应​用
阅读已结束,如果下载本文需要使用1下载券
想免费下载本文?
定制HR最喜欢的简历
下载文档到电脑,查找使用更方便
还剩2页未读,继续阅读
定制HR最喜欢的简历
你可能喜欢HTML5技术的调研以及应用总结
作者:韩欣&&&&
来源:DATATOM&&&&
14:12:10&&&&
本文对HTML5的技术调研进行总结,尽可能客观的分析解答对HTML5技术的一些疑问,给出产品、技术上的一些决策建议。
对于文中的内容以及表述,也热切希望能得到大家进一步的指正和交流。
1. HTML5的发展现状及趋势
1.1 HTML5简介
HTML5是一套技术标准、规范,它定义了一系列的API编程接口和HTML规范(本文中将CSS3也默认涵盖到HTML5的技术范畴);HTML5的运用和推广,需要依赖于各个浏览器厂商对HTML5的支持力度。
详细介绍请参看百度百科:
/view/951383.htm
1.2 HTML5规范的发展现状
HTML 5的第一份正式草案已于日公布。HTML5的正式规范还未发布,HTML5规范仍处于不断发展完善中,许多新技术特性仍在不断的补充到HTML5的规范里。
1.2.1 HTML5规范什么时候正式发布?
HTML5规范的正式版的发布时间还无法确定,也许2012,也许2014。但是很多浏览器厂商已经参考2008年的草案,不断的在各自浏览器中对HTML5进行支持了。
有一些新特性,也往往是先由某些浏览器创新实现的,然后才被收录到HTML5的工作小组收录到HTML5规范里。
也即是说,不需要等待HTML5规范的正式发布,现在就可以使用HTML5技术来丰富、优化产品功能和用户体验了。
HTML5官方规范文档:
http://www.w3.org/TR/html5/
随着HTML5在移动领域的兴起,通常将关于移动设备的本地设备访问的规范也纳入到HTML5规范的范畴里:
http://www.w3.org/2009/dap/
1.2.2 HTML5规范与HTML4有什么差别?
HTML5是在现有HTML4的规范基础上,去除一些不好的特性,补充一些新的东西(例如:本地存储、画布Canvas、视频、音频支持等)。
详细规范差异请参看文档:
http://www.w3.org/TR/html5-diff/
/doc/tieba/tech/share/html5/topic/语义化/html5_tag_diff.html
1.2.3 HTML5有什么优势?
HTML5的主要优势:加强了浏览器的能力,使web网页程序可以具备更强大的能力,可以支持很多传统web技术无法实现的功能。
详细请参考:
/htmlcssdiv/HTML5dysyls_19043.html
1.3 HTML5的浏览器支持情况
1.3.1 现在可以使用HTML5了吗?
在PC桌面端,在国内,IE6/IE7/IE8浏览器仍占据约50%的市场占有率,它们不支持HTML5;其他浏览器(例如IE9、火狐、chrome、safari、opera等高级浏览器)则都已支持HTML5。
在无线端,android/iphone/webos/windowphone7等操作系统自带的浏览器都已支持大部分的HTML5特性。
总之,在无线端,已经可以在智能手机上较大范围的开始使用HTML5技术了;而在PC端,则HTML5的使用还很受限,只能差别式的利用HTML5技术(例如:使用高端浏览器的用户能够使用地理信息定位功能,而使用IE6浏览器的用户则无法使用)。
1.3.2 遨游、360等外壳浏览器支持HTML5吗?
对于搜狗、360、QQ、百度、遨游这5类浏览器,通常都已是双内核的浏览器:
在极速(或高速)内核(webkit内核)模式下,是支持HTML5的;而在普通内核(IE内核)模式下则不支持HTML5。
1.3.3 PC桌面端的主流浏览器对HTML5的支持情况
下表列出PC桌面端主流浏览器对HTML5的支持情况,数据取自HTML5权威网站:
第1列代表浏览器名称,第2列代表浏览器版本,第3列代表得分(分数越高,表示对HTML5的支持情况更好;得分在100以下的,可以认为其不支持HTML5)。
从上图(取自2012年1月)可知:除了IE6/IE7/IE8之外的其他浏览器都已支持HTML5;但是国内大部分普通网民仍在使用IE6/IE7/IE8浏览器。
所以,在PC端,HTML5在国内的大范围推广,仍不是短期内可以实现的;然而在国外,IE6的市场占有率远低于10%,HTML5在国外的应用比国内迅猛很多。
浏览器PC端的市场占有率统计请参考:/~ua2
1.3.4 无线移动端的主流浏览器对HTML5的支持情况
在无线移动领域,各主流智能机的浏览器都对HTML5进行了广泛的支持。
塞班系统的智能机对HTML5支持很差,但android/iphone则对HTML5支持得很好;同时,在国内分别占据了10~20%市场占有率的第3方浏览器(QQ手机浏览器和UC手机浏览器)的最新版本,也都已经开始支持HTML5(老版本的QQ和UC不支持HTML5)。
下表列出无线移动端主流浏览器对HTML5的支持情况,数据(2012年1月)取自HTML5权威网站:
1.4 HTML5的发展趋势
1.4.1 HTML5的技术发展趋势
HTML5技术目前在PC端发展迅猛,很多新特性新技术都是现在PC端涌现,然后发展到无线移动浏览器上。而反过来,无线移动设备上率先出现的一些特殊技术(例如操作各类传感器),也会反过来刺激桌面端浏览器的不断发展。
下表列出无线移动设备上的主流浏览器对HTML5技术的详细支持情况:
/doc/tieba/tech/research/webapp/htmt5supportlist.JPG
从上表可以看到,HTML5包含许多领域的一系列技术,绿色方块的代表浏览器已实现支持,红色方块代表浏览器未支持。
无线移动端的浏览器的HTML5得分,大多在300分以下,而对于PC端来说,大多数主流的新型浏览器的得分都已经在300分以上了。
特别指出,chorme浏览器16版,已经得分达到374分,目前只剩下访问摄像头和微数据(搜索引擎支持)两个特性未支持,其他HTML5特性都已经得到比较全面的支持。
也即是说:
首先,目前的HTML5规范范畴内的约80%(粗略估计)的技术,都已经得到PC桌面端浏览器的支持。
其次,由于移动互联网的兴起,一些与移动设备相关的规范也扩展到HTML5规范中,例如:手机通讯录、手机发短信、移动设备传感器、震动、铃声提醒等;这些规范仍在发展中,目前大多数移动设备相关的规范还未被移动浏览器实现(目前只有地理信息定位技术受到了较广泛的浏览器厂商支持)。
总之,移动领域会是未来1~2年HTML5技术发展的一个非常重要的方向。
HTML5关于移动设备的相关规范请查看:http://www.w3.org/2009/dap/
1.4.2 HTML5的浏览器市场普及趋势
在PC领域,HTML5的市场普及情况,主要依赖于新型浏览器的市场占有率,因为新型浏览器都已经支持或开始支持HTML5技术。
下表列出国内PC端浏览器市场分布的占比情况:
(上表数据取自CNZZ公开的统计数据:/articles/168045.htm)
将支持HTML5的浏览器进行汇总统计(不包括IE6/IE7/IE8、360安全浏览器),目前用户PC上只有10%~20%的浏览器支持HTML5。
从目前的发展趋势来看,支持HTML5技术的浏览器PC端市场占比,预计在未来2年仍很难超过50%。因为国内约30%的用户仍在使用IE6浏览器(而在美国,只有1%的用户仍在使用IE6浏览器);随着windows7的普及,大多数国内低端用户开始转向使用windows7操作系统自带的IE8浏览器,少部分用户开始使用最新的IE9浏览器。
在无线移动端,android手机(其手机自带浏览器支持HTML5)发展迅猛,且诺基亚转投windowPhone7,这几类智能手机(含ios,webOS系统的手机)的自带浏览器也都支持HTML5;可以认为,除了诺基亚的塞班系统的智能手机不支持HTML5,其他的绝大多数的智能手机都支持HTML5。可以预计,未来1~2年内,HTML5将在无线移动领域得到广泛的普及。
1.4.3 HTML5的产品应用的发展趋势
在PC端,目前已有部分网站开始采用部分的HTML5技术,例如新浪微博的图片浏览(canvas实现),网易邮箱的拖拽图片上传(HTML5的拖拽api)等。
进一步的介绍可以参看调研文档:/doc/tieba/tech/share/html5/topic/调研报告_业界html5应用.pptx
在PC端,目前通常只能通过差别式对待的方式来应用HTML5技术,从产品设计的角度,可以将更丰富的产品功能或特性,提供给使用高端新型浏览器的用户;对于使用低端浏览器的用户则提供一些退化的替代功能或特性。未来1~2年,HTML5的技术应用在PC端仍难得到较大范围的推广,因为要做到HTML5的浏览器差别式对待,是需要一定的技术开发、维护成本的。
在移动领域,HTML5的技术近期已经随着移动web app的发展,开始在android/ios智能移动设备(手机和平版电脑)上得到推广使用。例如:百度iphone地图/mobile/(地理信息定位)、新浪微博(离线存储等)、(本地存储)等。
随着国内塞班系统的市场份额的持续下滑,预计未来1~2年,在90%(粗略估计)的智能手机上都可以运用HTML5技术,并出现更多web app形式的移动互联网产品。
关于移动web app,详情请查阅调研文档:
/doc/tieba/tech/research/webapp/贴吧web_app调研.docx
2 HTML5技术规范解析
2.1 已经发展较成熟的HTML5技术
HTML5规范中仍有一些技术规范还在不断补充完善,有一些规范则已经较趋于稳定;
下表列出那些技术规范已经制定得较为全面或者浏览器支持范围已经较广泛的技术:
移动浏览器支持
技术复杂度
SVG(可缩放矢量图形)
webapp cache(应用缓存)
Canvas(画布)
Layout Element
History(访问历史、导航)
Geolocation(定位)
Cross-document messaging(跨文档消息)
Session Storage(会话存储)
LocalStorage(本地存储)
Web SQL DB(本地SQL数据库)
2.2 仍处于完善阶段的HTML5技术
技术复杂度
移动浏览器支持
Video(视频)
Audio(音频)
MathML(数学标记语言)
Form(表单)
Drag and drop(拖拽)
HTML editing(富文本)
(安全iframe/seamless)
WebGL(3D渲染)
Server-Sent Events(服务器端事件)
涉及与服务器端配合
WebSocket(网络套接字)
涉及与服务器端配合
IndexedDB(本地索引数据库)
Web/Share Workers(并行执行)
datalist,meter,progress元素
等待浏览器支持
2.3 仍发展较缓慢的HTML5技术
下表列出那些技术规范制定较粗糙或浏览器支持仍较滞后的技术:
技术复杂度
移动浏览器支持
Microdata(微数据)
提供搜索引擎优化
Files(文件读写)
涉及数据安全问题
访问摄像头
web Notifications
(web桌面消息提醒)
手机通讯录
振铃、震动
2.4 一些经常受关注的HTML5技术以及疑问
(1)&&声音播放&、&录音&、&语音识别为汉字&是3个不同的功能特性:目前HTML5支持声音播放,对于录音的支持还很缺乏,部分浏览器(例如chrome的pc版)支持语音识别为汉字进行输入。
(2)&HTML5支持视频播放,但还不支持视频录制(这个功能仍需等待),对于视频编辑功能,则更无法支持。
(3)&手机通讯录,目前有读取通讯录的HTML5规范,但是对于修改、编辑通讯录的API,则还未提供。还未有浏览器支持手机通讯录功能。
(4)&能否收发短信?
目前有发送短信的HTML5规范,但是仍未有浏览器支持。
当然,如果只是想发短信,可以不借助HTML5,而是考虑采用其他的间接手段来实现,例如利用服务器端程序来帮助转发短信。对于接收短信,目前HTML5规范里没有,也只能通过其他间接手段来实现。
(5)&能否读写本地文件?
HTML5规范中有较详细的读取文件的API规范,对于&写文件&的规范短期内还很难等到。由于安全和隐私的问题,浏览器的支持还很弱。利用javascript来编辑文件的内容,从编程角度看,是挺麻烦的一件事,尤其是处理二进制文件。
(6)&本地缓存能存多少内容?
对于移动设备,本地存储通常的存储空间是5~10MB;用web本地数据库时,可以存50MB左右;也有一些浏览器是不做阀值限制的。
(7)&可以访问摄像头吗?
HTML5规范有,可以调用摄像头进行拍照、摄像,但目前还没有浏览器可以支持。
(8)&可以在浏览器端裁剪、缩放、旋转、过滤图片吗?
可以,利用canvas来编辑图片。但目前还无法直接利用javascript来保存图片到浏览器本地,如果在编辑图片之后,未能成功上传图片到服务器端(例如:网络断了),则这张图片有一定的丢失风险。总体上来说,是技术可行的。
(9) 地理信息定位功能。
业界很多产品都已经有应用,不再重复细说。
(10)&是不是HTML5不支持某个特性,这个特性就肯定无法实现?
当然不是,还是具体问题具体分析比较合适。一些HTML5不支持的特性,也是有可能通过其它技术手段来间接实现的。
2.5 HTML5核心技术的调研和DEMO
请参看此处相关文档,对HTML5技术进行了较丰富全面的梳理:
/doc/tieba/tech/share/html5/
3 HTML5对PC前端技术的影响
3.1 HTML5的技术难度
HTML5的技术范畴很广,要全盘掌握是比较困难的事情。
有一些技术的API很多,文档很厚,例如Canvas绘图,可以做得很精很深,也可以简单快速跟进,迅速做出产品。
有一些技术的API很少,例如地理信息定位和加速器的API,总共只有不超过10个API函数,这一类HTML5技术就比较易于上手。
再例如webGL,做3D动画、游戏,它就可以非常复杂。
总之,快速的利用HTML5技术做出产品的原型DEMO,技术的难度倒不是太大;但是会比较繁琐,因为业界成功案例相对较少、遇到问题时可供参考的资料较少,通常需要技术人员摸索前进。
3.2 HTML5产品的开发、维护成本
HTML5的技术难度本身并不大,困扰技术人员的往往是HTML5的一些浏览器兼容性问题。
在PC端,往往需要针对不同浏览器,开发完全不同的两套代码,从而提供两套功能和服务给用户。
从产品的设计到产品的开发和维护,都需要额外增加不少投入,甚至是成倍的技术开发成本。
3.3 PC端使用HTML5,我们需要做出哪些改变
首先,需要前端技术人员来引导产品设计人员,将更多的新技术的信息传递给产品设计人员;
其次,需要前端技术人员自身自发的主动做技术革新和推进。因为只有前端技术人员自身才更清楚的知道HTML5到底能做什么。
最后,也是最重要的:&消灭IE6&。
4 HTML5对移动前端技术的影响
4.1 移动HTML5的技术难度
在移动领域,是HTML5最容易发力的领域,因为大多数的智能手机都支持HTML5。相比于PC端,移动领域需要面对更多的浏览器兼容性问题,这种兼容性问题主要集中在对各种手机上的不同浏览器,以及同一类型浏览器的不同版本上。
从技术难度来说,移动领域在下面几方面,是加大了的:
浏览器种类繁多
屏幕尺寸、大小
横屏、竖屏浏览模式
需要考虑节省网络流量
各种类型的传感器
减少复杂运算
触屏操作优化(多点触控等)
动画特效的性能优化
4.2 移动HTML5产品的开发、维护成本
移动前端的开发维护成本比传统的站点要复杂,尤其是后期的兼容性问题解决和展现调优,需要花费更多的成本:
测试需覆盖更多类型的终端和浏览器版本。
问题追查、复现困难
网络环境复杂,追查问题的干扰因素大
开发调试工具较简陋、调试困难
遇到的浏览器兼容问题比较繁杂,往往业界无可供参考的资料
4.3 移动领域使用HTML5,我们需要做出哪些改变
在移动领域使用HTML5,由于技术还相对比较新,很多&坑&需要一个一个去试。
单纯的做技术调研,往往容易浮于表面,更好的方式还是只能在实践中去摸索。
而从移动web app来入手,就是一个很好的切入点。
关于移动web app的更多分析调研,请查看文档:
/doc/tieba/tech/research/webapp/贴吧web_app调研.docx
4.4 主流移动领域的web app开发框架简介
4.4.1 基础库
移动领域在业界常用的javascript基础库有jquery,zepto.js;对于dojo/YUI等,也都有相应的移动版本;百度有tangram mobile。
这些库,往往只提供一些基本的API,对于开发完成一个web app,则还需要做更多额外的工作才行。例如,在基础库之上,通常还可能需要这样的库或框架:MVC框架、UI组件库、前端模板引擎等。
Tangram mobile: /doc/ge/mobile/
Zepto.js(可能需要翻墙):&/
4.4.2 框架
移动领域有一些较为成熟且功能全面的框架,例如:jqtouch, jquery mobile, sencha touch。运用这些框架,往往可以方便、快速的搭建起一个web app应用,因为框架内部往往已经提供了很多UI组件、页面跳转控制、缓存策略的工具,甚至于集成了一些前端模板引擎和MVC框架。
主流移动框架的介绍:
Jqtouch:&http://www.oschina.net/p/jqtouch
jquery mobile:&/
sencha touch:&/view/3800552.htm
前端模板引擎调研文档:
/doc/fis/template_front/front-template-research.text
Backbone:&/backbone/
4.4.3 框架调研分析
调研文档:
zepto和jquery在手机上面执行效率对比:
/doc/tieba/tech/share/wise/zepto_VS_jquery.html
Sencha 与 jqurey mobile框架的简单对比分析:
/doc/tieba/tech/share/wise/sencha_vs_jqmobile.html
4.4.4 移动web开发框架发展现状
最近两年(),移动web开发随着web app的逐渐兴起,得到了较大的发展,但仍处于发展阶段,大部分框架还未完全成熟(不少框架处于beta版,或近期半年才刚发布了正式版的状态),还有较大的成长、发展空间。
5 贴吧运用HTML5的方式和建议
5.1 贴吧PC端的HTML5运用
(1) 目前线上贴吧已经运用的HTML5技术有:本地存储(发贴草稿)、语义化布局标签、Canvas绘图涂鸦。
(2) 可以考虑进一步运用的HTML5技术有:拖拽、本地图片编辑上传、ipad支持video标签视频播放、CSS3(圆角、动画等)。
5.2 贴吧移动端的HTML5运用
(1) 目前线上移动贴吧已经运用的HTML5技术:canvas,CSS3动画、圆角。
(2) 可以考虑进一步运用的HTML5技术有:本地存储、离线存储、canvas、CSS3、视频、音频播放等。
5.3 贴吧对待HTML5技术的方式
5.3.1 PC端的HTML5运用
因为需要考虑差别式的产品设计,兼容性问题处理成本、难度会较大,建议后续PC端的开展方式是:针对某个具体技术点,从产品应用的某个具体功能出发,进行专门的设计和优化,从而来运用HTML5技术。例如:拖拽图片上传、ipad下的mp4格式的视频播放。
5.3.2 无线移动端的HTML5运用
因为移动设备(智能手机)往往可以较好的支持HTML5,同时可以借助HTML5来设计、实现用户体验较优秀的web app,HTML5在无线移动领域的应用场景比较广泛,建议无线移动端的后续开展方式是:
(1)首先,以web app的设计、优化为中心,将已经可广泛使用的HTML5通用技术(例如本地存储、history的api、CSS3动画等)直接运用到web app中;
(2)其次,再考虑针对产品的具体功能特性增加特殊的定制化HTML5特性(例如一些手机设备访问的API、地理信息定位、摄像头等)。
(3)Hybrid app的应用也是HTML5的一个重要发展方向。需要较多篇幅,在本文暂不展开讨论。
phonegap目前是开发混合式应用较成熟的主流框架之一,进一步了解可以查看:/
5.3.3 对HTML5的技术跟进方式
在无线移动端进行具体的应用实践,积累实践经验;通过无线端的HTML5技术应用,来带动贴吧在HTML5方面的技术进展,同步推动、扩展PC端的HTML5的产品应用思路。
经过一系列的调研,贴吧对HTML5技术的全貌已经有了较清晰的了解;后续的工作,主要是需要解决一些实际应用中的特定场景下的特殊问题。这些问题需要在实践中来解决,单纯的调研是很难做得很深入的。
5.4 一些可以继续深入开展的工作
(1)&建立浏览器统计平台,更细致的了解浏览器占比情况(含手机类型、浏览器种类和版本等)。
目标:将更多支持HTML5技术的手机适配到贴吧的移动智能版贴吧上。
(2)&建立浏览器对HTML5的能力检测平台,了解各款具体浏览器对HTML5的支持情况。
目标:更好的设计、优化产品,利用HTML5来改善产品功能和品质。
(3) 建立HTML5的一些javascript基础库,封装一些更友好的API供产品线使用。
目标:降低HTML5的技术使用成本。
(4)&完善web app的框架设计、开发调试工具支持。
(5) 在特定复杂技术领域继续深化调研:web socket, webGL, canvas, web worker等。
(6)&Web app的hybrid app形式。
这会是无线上一个非常重要的领域,hybrid app能够实现在客户端对HTML5技术进行增强支持,同时能兼顾本地native app和web app的一些实际应用需求。
本文出自 DATATOM 官方技术博客,转载时请注明出处及相应链接。
评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)
中国国际广播电视信息网络展览会
北京·中国国际展览中心
展位号:5号馆5105
全美广播电视展
美国·拉斯维加斯
展位号:SL15110
中国国防信息化装备技术展
北京·中国国际展览中心
展位号:6/7号馆D30
DATATOM@微信
DATATOM@微博}

我要回帖

更多关于 路老膏方 用户体验 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信