2016年会成为HTML5的中国年吗?

作者: seedheart | 来源:发表于2016-01-15 11:31 被阅读1171次

    近日,H5研究院发布《2015年中国HTML5行业发展报告》。本文截取报告主要内容,解答三个问题:为什么是HTML5?不同HTML5平台的本质区别是什么?今年HTML5行业有哪四大发展趋势?

    一、引言

    2014年下半年,微信帮助捧火了HTML5小游戏,自此国内各行各业开始对HTML5保持持续高涨的关注。接着的2015年是国内HTML5行业迅速发展的一年,在媒体大肆渲染“互联网寒冬”之际,HTML5作品的生产数量和传播广度却居高不下,为寒冬增添一把柴火。

    根据百度指数对关键词“HTML5”搜索趋势结果,2015年“HTML5”的指数约是2014年的1.5倍;而HTML5的简单说法“H5”在2015年的检索量是前一年的2倍多,直逼“HTML5”。

    百度指数2014-2015年“HTML5”搜索趋势

    2015年,国内HTML5的传播仍以移动端为主,但简单的翻页这种低层次的设计已经不再适应大部分受众的需求,HTML5平台也开始由简单的工具应用逐步转型。其中,发展得比较快的是面向商企用户的iH5,自主研发引擎,并于2015年年底添加即时通讯功能和线上交易机制。

    为什么是HTML5?

    二、Web应用开发新标准

    HTML5,第五版超文本标记语言,于2014年10月由万维网联盟(W3C)发布为正式推荐标准。它是HTML自1991年问世以来,最具变革价值的技术规范,历经多年修订与完善才制定完成。

    过去,Web开发面临两种困境:

    (1)不少人质疑Flash的安全性等问题,却找不到替代它的合适插件;

    (2)工程师们抱怨PC端和移动端应用的多次开发,仍旧得为微软、苹果、安卓等系统设计不同方案。

    而HTML5提供了良好的解决方案。与JavaScript、CSS等紧密结合后,HTML5能使浏览器不需要类似Flash的插件也能实现桌面应用的交互效果,它的跨平台可用性更令应用的一次开发成为可能。

    Youtube在网页中使用HTML5技术实现视频播放

    如上图,Youtube使用HTML5的video元素进行标记后,网页不需要第三方插件就能播放音视频等。HTML5的兴起具有非常深远的意义,它已经从简单的标记语言化身为Web应用开发的先驱。

    三、HTML5应用现状

    从硬件角度来看,国内手机和平板两种移动设备应用最广,PC端次之,紧接着是电视和游戏设备。

    从软件角度来看,桌面浏览器对HTML5的支持高于移动浏览器,最高可达95%;而从整体上而言,移动浏览器对HTML5的支持却优于桌面浏览器。

    HTML5具有较好的浏览器向后兼容性,开发者能对浏览器不支持的情形设计各种各样的回退方案。因此,HTML5页面的实际显示性能与开发者、制作平台密切相关。

    2015年,越来越多公司在HTML5品牌推广上进行布局。6至7月份起,鸡汤、自媒体等个人作品呈下降趋势,商企用户作品则保持高速增长。在商业需求的驱动下,HTML5页面设计的目的性更强,获得最好传播效果的基本是经过一定时间策划,在团队操作下有针对性地进行投放的企业案例。

    相对应地,原有HTML5平台也进行了大面积升级。从平台性质而言,HTML5平台可分为轻营销模板类、功能引擎类和基础工具类三种,分别以易企秀、白鹭引擎和iH5为代表。

    2015年传播度较广的三个HTML5作品,分别是杜蕾斯展馆、吴亦凡入伍和网易娱乐头条

    三类HTML5平台的特点如下——

    (1)轻营销模板类:提供类似PPT页面切换的HTML5制作工具,通常面向C端(个人)用户,部分为B端(企业)用户。该类平台的数量较大,只适用于轻度营销,所能提供的页面动态效果局限于翻页。

    (2)功能引擎类:提供HTML5网页的开发引擎,通常面向B端用户。该类平台主要提供基于Canvas(画布)的游戏引擎,适用于轻游戏的开发,依赖于开发者。

    (3)基础工具类:提供用于页面交互的HTML5可视化编辑工具,主要面向B端用户,部分为C端用户。该类平台只有iH5,采用自主研发的闭源引擎,应用领域广泛,涵盖轻度营销、重度营销、媒体电商内容应用、视频、动画、游戏等方面。

    与浏览器多采用谷歌开源引擎的状况相近,国内HTML5平台基本使用国内外开源框架或引擎。但和浏览器面向网页内容显示,只需提供高性能的技术支持不同,HTML5平台面向的是HTML5制作或开发,需要对网页质量负责。因此,使用开源框架或引擎意味着这些HTML5平台进一步拓展业务会比较被动,容易面临同质化的困境。

    四、三类HTML5平台的对比

    因为整体上移动端浏览器对HTML5的支持优于PC端,2015年HTML5平台主要面向移动端网页的制作和开发。

    HTML5平台定位与工具特征对比

    如上表,三种HTML5平台以PC网站、APP和软件三种形式提供制作或开发工具,成品为网页或HTML5源码。由表可见:

    (1)轻营销模板类HTML5平台只能做轻度营销,能实现翻页等简单动效,分为场景展示、电子出版和动画制作三种。如下图为易企秀桌面编辑界面,该类平台最大的共同点在于工具结构以页面为基础,与软件PowerPoint架构相近,能通过增减页面、使用功能组件和点击快捷菜单来调整内容。

    易企秀的桌面编辑工具界面

    (2)功能引擎类HTML5平台的用户专指性很强,主要是有开发经验的技术人员。下图为Egret Wing软件设计师视图下的基本架构,使用HTML5引擎把基础代码流程化,再借助第三方集成开发环境Adobe Air构建可视化工具,就能通过让用户使用软件组件来简化开发过程。

    Egret Wing的桌面编辑工具界面

    (3)基础工具类HTML5平台提供底层交互型产品,开发目的、设计原理和实现思路都以交互为基础,国内只有iH5。iH5于2015年9月上线,提供HTML5制作工具、工具培训和作品交易等服务。它本质上封装了DOM(文档对象模型)引擎的一个集成开发环境,使用者以设计师为主,适合广告公司、大型媒体公司和公司市场部等使用。

    iH5的桌面编辑工具界面

    如上图,iH5提供的是舞台、屏幕、页面、多媒体素材、事件、数据库等对象组件,而不是构建好的模块组件。在提供可视化编辑的前提上,它最大程度还原了HTML5页面的开发过程,具有较高的拓展性。由于提供底层交互功能,它的应用领域较广泛,能用于微信推广、网站建设、轻游戏设计、轻APP开发和视频交互等多个方面。

    同样是HTML5规范,对HTML5技术与性能的取舍成为国内HTML5平台工具定位和提供服务的差别所在。

    五、HTML5行业发展的趋势

    伴随着HTML5兴起的是Flash的没落,HTML5能打败在多媒体领域称霸多年的Flash,除了移动设备的跨平台性和较好的多媒体支持外,它的应用范围也广于Flash。比如,Flash动画作品的复用性极低,基本没有模板市场,而HTML5却能作为基础填充材料,用来制作报纸图文等模板。

    参考Flash发展的演化路径并结合HTML5的新特性,HTML5近几年会在重度内容、网页游戏、垂直领域解决方案和内容直接填充四个方面有所突破。

    (1)内容往重度化方向发展。

    重度营销并不完全意味着大项目、高预算、长周期、大团队,而是相对轻度营销以用户生产内容为主,它更注重专业内容的生产。在用户对页面交互能力和HTML5拓展功能的要求提高之际,轻度营销的市场份额会逐渐降低,往重度营销内容转化。

    (2)网页游戏往交互游戏方向发展。

    尽管HTML5游戏具备无需下载、包含社交属性、开发成本低等优势,但如果没有充分利用HTML5的新特性,加强移动游戏的交互能力,它很难在游戏市场中异军突起。由此,网页游戏未来更有可能结合HTML5优良的通信功能,往跨屏互动等交互特征更明显的形式发展。

    (3)垂直领域解决方案往在线应用方向发展。

    与HTML5行业密切相关的垂直行业主要包括在线教育、电商和流媒体三种类型。

    以世界最大的在线课程平台Coursera为例,授课视频即使用HTML5实现“课间小测”。如下图,在Coursera网站上,当视频播放到特定节点时会出现与课程相关的问题,提供用户选择答案,记录答题情况并反馈答题结果。

    Coursera教学视频播放部分的课间测试

    (4)传媒业往内容直接填充方向发展。

    国内HTML5制作工具基本都提供模板服务,这与HTML5网页较强的复用性有关。网页基础架构设计完成后,修改源码中各元素的参数便能替换素材、改变对象属性,因此HTML5网页能用于制作基础填充材料。在HTML5模板的帮助下,新媒体内容能通过应用母版进行编辑,用户只需后期进行图文内容的替换,因此很有可能成为传媒业转型的契机。

    反观国内不同类型的HTML5平台,只有以HTML5提供的新特性为根本,着眼于底层交互才可能适应各行各业对网页开发的需求。因此,基于HTML5元素和属性进行设计的基础工具,未来更有机会占领尽可能多的市场份额。

    +++完整报告对以上截取内容做了更完善的说明,免费获取完整报告,请点击本链接+++

    相关文章

      网友评论

        本文标题:2016年会成为HTML5的中国年吗?

        本文链接:https://www.haomeiwen.com/subject/sxszhttx.html