职业经理人周刊 >> 商业评论

在用户看来，朋友圈已不再只是信息获取平台，还可以在这个平台上越玩越炫、越玩越酷。而在业内人士看来，这却是HTML5的再爆发，几年的预热之后，在2014年终于大面积向移动互联网袭来。

　　2014年7月，一只表情贱贱的神经猫，几乎一夜之间刷了大家的朋友圈，玩家纷纷炫耀自己用了更少的步数就将此猫围住。这就是HTML5游戏发展的里程碑式产品——《围住神经猫》，其创造了3天点击量过亿的成绩。随后，《在柯少中找房祖名》、《一个都不能死》等众多HTML5小游戏在微信朋友圈中疯转。

　　在用户看来，朋友圈已不再只是信息获取平台，还可以在这个平台上越玩越炫、越玩越酷。而在业内人士看来，这却是HTML5的再爆发——它在几年的预热之后，2014年终于大面积向移动互联网袭来。

　　随着玩法不断变多、变新，HTML5也正在被认可和使用，并且逐渐形成了移动营销的一个新热点。

　　移动营销多数的做法都是：硬广投放，投开屏广告或是插屏广告等；软性投放如开设品牌微信公共号等。而HTML5使广告主找到了移动营销的突破口。在移动+社交的传播时代，HTML5营销简单、快捷、灵活、有效，炫酷能够吸引用户关注、甚至参与，进而进行价值转化，不仅是互联网公司和移动互联网公司，越来越多的传统企业也开始关注到HTML5营销的价值。

　　HTML5温故知新

　　要想知道什么是HTML5，绕不开的是：什么是HTML？

　　想象一下两个计算机在沟通的场景，A如果要把一个图文信息传给B的时候，交流过程中B肯定会产生这样的问题：你给了我那么多信息，哪些是网页标题、哪些是正文、哪些又是图片呢？于是，A和B商量了一个办法，用一些符号来标记不同类型的内容，而这些标记的一整套规范就是HTML。

　　简单说，HTML就是一种网络通用语言，这套语言普通用户未必懂，但对于开发者来说却是简洁适用，这就可以了，开发者用这种语言制作的页面可以跨越不同硬件设备以及不同浏览器，被任何用户浏览到。

　　而从HTML1到HTML5就代表着这套规范的发展进程。按照定义来讲，HTML5是一系列制作网页互动效果的技术集合，它能在移动端做出Flash做不出的动画效果，即HTML5就是移动端的web页面。但如果仅仅将HTML5看作是替代Flash的一个技术，就过于低估了其真正的能力，对于移动互联网来讲，它更像一个“技术阀门”，一旦拧开，想象空间很大。

　　我们第一次谈论HTML5要改变世界大概是因为乔布斯，他坚持在iOS上不兼容Flash，在Adobe统治多媒体开发的那个年代，这需要付出极大的勇气。这么多年过去了，虽然所有人都在谈论HTML5，但是大部分人甚至都忘了它还是一个仍在完善中的体系，这种完善也直接决定了HTML5在2014年的再爆发。

　　Q&A：为何HTML5会在2014年再爆发？

　　2007年W3C（万维网联盟）立项HTML5，直至2014年10月底，这个长达八年的规范终于正式定稿，W3C小组表示终于完成了HTML5标准的制定工作。此举将基本的Web技术在移动和云互联网时代统一起来，有助于开发人员采用统一标准进行网页应用开发。

　　HTML语言的上一个版本HTML 4.01还是在1999年12月发布的，也就是说用了15年才迎来一次大的版本更新。W3C小组表示，在过去多年时间里，他们联合了全球60多家公司，共同完善HTML5标准，其中解决了4000多个BUG。HTML5将会取代1999年制定的HTML 4.01、XHTML 1.0标准，期望能在互联网应用迅速发展的时候，使网络标准达到符合当代的网络需求，为桌面和移动平台带来无缝衔接的丰富内容。

　　【相关链接】

　　HTML5与微信的那些事儿

　　2014年10月HTML5规范标准的定稿，是对HTML5营销再出发的技术支持，如果这算是“天时”，那么2014年微信朋友圈的火热绝对算是“地利”了。

　　HTML5营销为何能够在微信朋友圈中迅速崛起？微信营销服务商微信海CEO程小永表示：“与淘宝和百度的营销不同，微信公众号更强调去中心化。而用HTML5做营销活动，通过微信的口碑传播出去，实际上就是把每个人当成向外传播辐射的基点和传播的弧线，传递给更多的人，传播效果非常好。”可以说，微信朋友圈分享让HTML5产生了盘活移动互联网流量的巨大价值。

　　HTML5营销 跟我看

　　进入移动互联网时代，人们的碎片化时间越来越多，但注意力却越来越挑剔，“不好玩不成活”，内容平实、形式简单就想得到关注？难于上青天。

　　而HTML5和轻应用开发，正好使营销手段更多样化，也使移动平台上的营销花样层出不穷。而HTML5到底能如何提升移动营销的level呢？

　　感官更丰富

　　绘图功能强是HTML5的一个非常重要的特征，很多我们在HTML5中看到的动画效果就是用其绘图功能完成的，从技术实现角度，可以做出任何二维动画。同时，HTML5还可以做出很好的三维效果，试想一下在三维立体空间中玩俄罗斯方块和坦克大战，是不是可以带给用户更身临其境的体验感。

　　可以说，在技术层面上HTML5可以做到画面更美观，感官更为丰富，这方面的例子也很多。如为配合上市，特斯拉在2014年推出过一组幻灯片式广告，这是HTML5较为早期和典型的玩法，效果为简单的图片展示+翻页交互，整体上很像幻灯片展示，简单、实用。如奢侈品品牌Burberry为配合上海嘉里中心旗舰店开业，推出“从伦敦到上海的旅程”为主题的HTML5页面，要进入这个浑身上下散发着浓浓文艺气息的HTML5，第一步，得先“摇一摇”；第二步，点击屏幕进入油画般的伦敦清晨；第三步，摩擦屏幕使晨雾散去；第四步，点击“河面”，河水泛起涟漪；最后点击屏幕上的白点，到达终点站上海。结合各种感官体验，Burberry全力带动用户参与互动，增加了体验性与趣味性，使得体验者更为深入体认品牌文化。

　　互动性更强

　　Burberry的例子其实已经对HTML5的互动性做出了很好的佐证，文章开头也提到小游戏成为了最终引爆HTML5的有效导火索，互动性强就是重要原因之一。移动端硬件正在沿着“人机互动”的方向一路走下去，而用户更希望在互动中获得乐趣，而HTML5正好作为技术纽带，将二者对接。以HTML5邀请函为例，涟拓网络品牌运营总监张永昶就谈道：“纸质邀请函有很多年历史，拿到手里的那种兴奋度很难被取代。而HTML5邀请函要想成功，第一要打开速度快，第二要打开整个过程流畅，第三就是要让整个体验互动。”如目前很多HTML5邀请函都会涵盖报名、支付、表单等互动功能。HTML5做的邀请函与其他方式（邮件、印刷品等）相比生动了很多，可以做到图文并茂声色俱备，还可以和诸如位置服务等应用相结合，未来可能还会有许多新功能推出。

　　场景更实用

　　解决了场景应用，就好比点通了移动营销的穴位。对于HTML5营销如何能够获得更好的传播，HTML5民间开发者张东表示，首先要了解用户在空闲的时候会拿手机干什么，分析不同用户的需求。最重要的是用户体验，要研究如何在极短的时间内完成他需要做的事情。

　　小游戏为什么能够成为HTML5实操的先行军？正是因为很多用户选择玩游戏来填补碎片化时间，游戏满足了碎片化时间这一场景需求。邀请函同样也是因为具备实用功能，代替纸质邀请函。与炫酷的形式感相比，用户更在乎HTML5能够带来的实际功用，有效解决场景需求。

　　传播性更好

　　HTML5再次爆发于微信，与微信朋友圈的传播力不无关系。注重用户需求与注重传播其实是相辅相成的，满足用户需求的信息自然能够得到有效传播，这里面其实也是思考角度的问题，从“我要传播什么”到“我希望用户传播什么”的转变。还是以游戏《围住神经猫》为例，在微信朋友圈引爆话题，微信用户不但自己玩得不亦乐乎，还不断将自己的成绩分享在朋友圈，进行刷屏式传播，三天时间内游戏访问量超过一个亿。

　　［词语辨析］

　　HTML5与APP

　　移动互联网江湖，APP派和Web派的斗争由来已久，而HTML5又作为Web派的主力先锋，更有人出言：HTML5将会颠覆APP。HTML5与APP之间到底是怎样的关系呢？

　　HTML的优势是技术简单，迭代快，渗透能力强。把一个HTML5的内容嵌入到任何APP中，技术工作量都很小，启动webview就可以实现应用嵌套，这些都是HTML5渗透力强的表现，透过HTML5将服务轻松落地到APP中。“将内容从一个APP快速、完整、高效的传输到另外一个APP，是HTML5最擅长的部分。在去中心化的用户设备桌面上，HTML5像血管一样连接了一个个的独立的APP器官并且输送血液到不同的APP中。这就是HTML5快速融入生态的表现之一，并且发挥自由流量的价值加速和逐步改造原生生态。”移动云服务APICloud创始人兼CEO刘鑫一语点出了HTML5基于移动互联网的核心生态价值，也是其更利于传播的根本。

　　HTML5营销 跟我学

　　通过以上的学习，我们看到HTML5满足了广告主对移动营销的大部分需求，从形式到功用、到传播，有人观望，更有人已抢了鲜，在2014年HTML5营销案例也层出不穷。大到可口可乐、维多利亚的秘密这种敢于尝鲜的大牌，小到知乎推出的一本新书，各种品牌和产品都在尝试利用HTML5进行营销。

　　主题派

　　主题传播永远是品牌的重要传播诉求，但无论是新闻稿还是软文拿到社交媒体上来，与其他形式纷繁的讯息进行PK，总是感觉弱弱的，这个时候HTML5就可以华丽丽出场了。在原有专题的基础上，加之互动以及其他适配小屏幕的素材，一个声情并茂的HTML5主题就可以制作完成。可以预期的是，将有越来越多的媒体和企业会采用此种形式推介某个主题或是亮点。可口可乐已先行使用HTML5形式传播品牌主题：如用一条红线重现一个品牌经历的岁月，在简洁的线条世界里，可口可乐描绘了一段历史，整个时间轴随着用户向上滑动页面“绘制”而成。“我们在乎”——可口可乐中国可持续发展报告，一份枯燥的报告也可以变身轻盈，适应移动端观看及分享的需求，以更活泼的形式在朋友圈被热转。

　　【案例链接】

　　腾讯大会邀请函

　　2014年11月8日，腾讯就在世人面前高调地玩了一把科技感。在WE大会现场中，不但有唯美的星空画风和首页由远及近的宇宙效果，还增加了指纹识别的科技互动元素。最重要的是游戏规则：将应用邀请发给好友，300秒之内，双方在各自手机上同时按下指纹，验明正身后获得邀请码。这种手机端接连现场的技术十分抢眼，可以让与会者享受到被重视的礼遇，还有瞬间通电的感觉。这款邀请函不只是实现了人机互动，更是实现了双屏互动，运用了一次社群思维。

　　游戏派

　　爱玩是人类的天性，好游戏吸引用户参与没有问题，但当游戏遇上营销，就难免生死未卜了，弄不好就破坏了游戏体验，引火上身。像《围住神经猫》只是因为接入了广告文字链，就结束了一款游戏绚烂而又短暂的生命，于朋友圈销声匿迹。

　　所以想要利用游戏进行营销一定要做到谨慎、巧妙。目前HTML5游戏营销主要是两种形式，一种是品牌推出游戏，游戏依附于品牌，一般为知名品牌；另一种为游戏先行，产品藏匿于游戏之中，这种则是一些新产品或是新品牌。像杜蕾斯、维多利亚的秘密就属于前者，推出符合品牌特点的一些小游戏，将品牌与游戏进行深度融合，如将经典游戏中的元素换为品牌标识或是产品，使用户在玩游戏的过程中加深对品牌的认知。而《财务包子铺》则是后者的典型代表，成为HTML5小游戏中的一匹黑马。

　　【案例链接】

　　《财务包子铺》背后的那本书

　　测试一下自己的创业成功指数？在这个人人吵着要创业的年代，大多数人都会对这个测试跃跃欲试吧，心里想着：我的创业天赋可不能就此埋没。于是由知乎制作的小游戏《财务包子铺》在微信朋友圈里迅速流传，玩家以创业老板的身份，对自己的包子铺的日常经营做出决策。听上去没什么特别，但游戏中专门设置了机制，比如用户如果决策失误，就会收到破产警告，需要选择一本救命书——就是知乎要借此推广的《金钱有术》。续命之后可以继续游戏，让玩家对新书留下初步印象，又不会中断游戏。游戏上线三天后，《金钱有术》这本书成为亚马逊图书销售总榜冠军，同时还是预售冠军、新书冠军、经济类冠军，仅在游戏里点击“购买秘籍”这一选项的独立用户数就有55万。怎么样，设计得如此天衣无缝，就算有人知道是“软游戏”了，但还是愿意为这本书买单。

　　活动派

　　有粉丝的地方就有活动，社交媒体风行后，品牌活动大规模转移到微博、微信上来，真实的社交关系链，对于有奖活动来说是最好的人气资源。相对于微博上的关注和转发有礼，以及微信朋友圈转发集赞等，使用HTML5开发出的有奖互动活动形式会更新颖和多变，同时也可以发挥HTML5的多项营销优势，如互动性强，在活动中开发出各种与用户的互动形式；功用性好，奖品对于用户来说就是最实际的刺激和诱惑；传播性广，独乐乐不如众乐乐，发现了既好玩又有奖品拿的好事，当然要好朋友一起分享。

　　【案例链接】

　　索尼七夕送“小青心”

　　在2014年七夕期间，索尼就用HTML5开发了活动页面，强力推出一款新品——清新范儿十足的小青心索尼C3手机。在活动期间，只要关注索尼Xperia官方微信进入游戏，将在页面“邂逅”专属幸运四叶草，分享活动到微信朋友圈，邀请4位好友帮助拆开礼盒，点亮小青心幸运四叶草，即可获得抽奖资格，索尼为此一共准备了77台小青心索尼C3智能手机。七夕是年轻人的节日，整个活动将小青心标签与七夕相结合，踩准节日营销的时间点，同时环节中设置需要4位好友帮助，也使社交传播链得到了几何式铺开。

　　功能派

　　在前文中已经提到，想用户之所想才能够有效“黏住”用户，使得HTML5营销得到转化，不论什么时候，只要实用，总会有人点击、有人转发，这也是HTML5营销最需要的推动力。在功能性HTML5开发方面，百度可谓屡试不爽，如先后推出iBreath智呼吸、手机告全体主人书、北京地铁计算器等产品，这几款产品无一不是戳中了用户的“痛点”：健康、手机使用、地铁涨价，这都是实实在在的需求点。以手机告全体主人书为例，你是否已经看够了那些枯燥的文字叙述，也厌烦了毫无新意的小互动，这组页面几乎每页都根据要表现的内容增加了趣味十足的动画效果，将说明书变成了“动画片”。

　　【案例链接】

　　百度iBreath智呼吸

　　这款HTML5的slogan为：人呼出的气体和指纹一样独一无二。此语一出，就让人对自己的呼吸充满了好奇，具体操作也很简单：手机水平放好，然后深呼吸，对着手机下方吹气。几秒钟之后，通过大数据分析，你的健康值就会被测算出来，会列出用户的呼吸气体成分详细数据，还会分析出用户的健康情况，如肺部感染症状以及相应的健康改善建议等等。

　　【支招】

　　HTML5营销四原则

　　形式：内容展示尽量把信息视觉化。

　　主题：创意要有新鲜感，少抄袭、多原创。

　　内容：要做优质内容，创建具有分享价值的内容，再由“社交达人”进行分享。

　　传播：要集中传播，HTML5上线的前5天是黄金传播期。

　　【课后思考】

　　作为广告主，你怎么想？

　　社交网络尤其是微信上的热闹人气，以及几个成功的HTML5传播案例，都使广告主兴趣大增，但说到底，抛去HTML5的技术制作层面，广告主最关心的还是后台传播数据的问题，但再深推一层，后台传播数据又取决于内容的创意和推广的机制，否则再炫酷的页面也无用武之地。好创意，可遇不可求，既要好玩又要品牌产品寓于其中，而不露声色，至少不引起反感；好传播，无外乎KOL朋友圈分享和微信公众号推广两种常规思路，此外再无通用的传播秘籍。所以，在尝试HTML5前再好好想想，你的品牌适合做HTML5吗？你有好的创意么？你又想好如何传播了吗？

　　本文部分内容参考、引用自《品牌H 5营销完全实战指南》（作者Social Talent@Whales）、《HTML5火烧移动营销已成微信朋友圈潮叹》（原载艾瑞专栏，作者赵勇）、《微信圈养下，国内的H T M L 5生态可能成为下一个Zynga》（原载36氪，作者刘鑫）、《揭秘微信HTML5营销：互动游戏受热捧制作成本最高30万元》（原载TechWeb.com.cn，作者肖芳）、《H T M L 5营销背后的4大原则、7个案例和12张图》（原载网易科技，作者互联网八先生）、《依托微信的“H 5”，解不了S o c i a lMarketing的垓下之围》（原载虎嗅网，作者默尔索）等文章。