品牌H5营销完全实战指南

据美国的调查数据显示,我们每天要查看手机150次,44%的人睡觉都把手机放在身边,9%的美国人承认他们在嘿咻时使用手机……毫无疑问,手机是有史以来最强大的媒介,从早上醒来到临睡前的一秒,这个几英寸的屏幕都在和我们“交流”。

什么是H5?

经常有朋友找我咨询H5的问题,但是在和他们沟通的过程中,我发现很多人对H5的理解都是停留在用户层面,邀请函、小游戏、品牌展示、抽奖等等。其实如果上升到营销层面的话,仅在用户层面去思考是远远不够的,因为任何传播都要考虑有效性的问题,如果100wpv带来的只是刷屏效果,而对品牌带不来任何有效转化,这样的传播显然是不成功的。

简单来说,H5就是一种高级网页技术,我们平时看到那些邀请函、小游戏都是H5网页,确切来说叫HTML5(国外目前没有H5的叫法),它跟我们平时上网看到的那些网页本质上没有任何区别,只不过大家普遍接受的那个网页技术版本是HTML4,而这个版本是在1997年发布的。

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

比如当A要把图文的标题传给B的时候,最终给B的表达是这样的:

品牌H5营销完全实战指南

如果设计HTML语言的人是中国人,那表达就会是这样的:

No.1绘图功能(Canvas、SVG)

为了方便理解,你可以将H5的绘图功能类比为Flash,但是唯一的决定性区别是,Flash做出来的动画无法在移动端的浏览器中浏览,因为Adobe早已在2012年就停止了对移动端flash的开发。毫无疑问,未来的移动网页游戏和动画会是H5的天下。

以下这个网站是H5绘图功能的典型例子,非常强大。你可以选择不同型号的毛笔、笔触半径以及墨水的颜色,整个绘图过程非常顺畅,而且还有一个模拟手握毛笔的人性化设计。

No.2三维效果(CSS33D)

H5的华丽效果离不开一种叫CSS的技术,形象的说,如果把HTML5比作**的素描稿,CSS就是上色用的,相当于word界面上方的格式工具栏,如果没有CSS我们看到的H5网页就只能以“素颜”见人了。如果你熟悉互联网技术的命名规则你应该能知道CSS3就是CSS的升级版本。

下面这两个网页游戏就是用H5+CSS33D做的,第一个是俄罗斯方块的3D版,想象一下在三维的空间里玩俄罗斯方块是什么感觉,喜欢挑战空间想象力的朋友可以试一下;第二个游戏是3D版坦克大战,非常精致耐玩的游戏,一句话评价就是“根本停不下来”。

PS:以上提到这些网站都需要在PC浏览器中打开,虽然麻烦一些,但绝对是值得的。

No.3离线存储(HTML5WebStorage)

技术细节大家可以忽略,但是关于离线存储这个功能,大家可以发挥想象——假设离线存储的容量是100个G甚至更多,浏览器就变成了一个超级应用入口,所有网页应用都具备离线存储和在线浏览的功能,这时候在线Office、在线记事本甚至在线PhotoShop都可以实现,我们的电脑只需要装一个程序——浏览器。在这个假设中,浏览器将干掉Windows,一切用户操作都在云端进行!稍微有点难理解,大家可以仔细体会。

以下是运用离线存储的一个例子,这个提供在线便签功能的网站无论有没有网络都可以访问,并且你记录的所有便签都会保存下来,很实用的网站,有兴趣可以试一下。

科普先告一段落,虽然H5有很多特性,但因为篇幅有限,本文只能介绍跟营销有关的内容,其他的特性很多是程序猿的事,如果大家反馈还要了解更多,我可以再写一篇具体介绍。

H5能怎么玩?

在了解完H5的一些基础知识后,相信大家最关心的还是应用层面的问题——H5能做什么,有哪些玩法?接下来我将列举一些典型的例子和大家探讨:

1幻灯片式玩法

这是H5最早期也是最典型的玩法,因为简单、实用,所以至今还很流行。其效果就是简单的图片展示&翻页交互,最终整体的表现很像幻灯片展示。

其实幻灯片式的H5现在已经出现了很多在线制作软件供大家使用,所以制作成本在现在看来几乎是等于零的,而在之前这样一个应用的开发可能要将近一万(再一次**了互联网思维的破坏力)。当然啦,这对于品牌主来说是一个好事,因为很多时候这种简单的展示已经能满足需求了,不需要花不必要的钱。

★应用场景

由于制作简单,周期短,这种H5展现形式适用于频繁、小型的需求。用在线编辑器的话,不需要任何开发,你只需要要配备一名设计和文案。(老规矩,需要在线H5编辑器推荐的,可以在后台留言)

总结得不全,幻灯片式H5可能有以下的应用场景:

2、结合热点的营销,周期极短。这种情况下,时效性是非常重要的,如果开发一个H5用了半个月,热点想必也结冰了。所以,应该以最快的速度推出才是明智的选择,而这时候引起广泛传播的关键就在于文案和设计。

此外,大家不要轻视这种短频快的传播,有时候它要比很多大投入的传播来得有效。没有人能完全掌握受众的兴趣点,所以一次大投入的传播不一定就能出效果,但是多次热点传播出效果的概率从统计学的角度也要高一些。如上文所述,我们可以实现用户在H5中所有交互行为的监测,因此,如果短频快的传播能配合有效的数据监测,便可以进行持续优化,降低不确定性。

2交互式动画

其实除了这种叙事型的H5动画,我们能看到的大多数H5游戏也都都属于这一类,比如神经猫、打企鹅、2048等等。最近也有一个比较火的H5游戏叫“财务包子铺”,在这个游戏中用户扮演包子铺的创业老板,在事业发展的不同阶段做出经营决策,最终登上人生巅峰。虽然游戏中植入了赤裸裸的产品推广(知乎的一本新书),但最后还是取得了3天破300万PV的成绩。

以下是该网站上几个示例的截图:

抓绵羊:你可以在奔跑的羊群中随意抓取并放到任意位置

种树:在屏幕任意地方点击都会在相应的地方种一颗树,你可以看到树的生长过程。

3D罐头:CSS33D的完美展示,你可以看到三维罐头的任意角度

照片处理:你可以把照片艺术化,图示为处理过程截图

交互式动画类型的H5制作周期和成本比较高,需要提前规划。除了创意、文案、设计这些以外,开发周期较长,优质的H5大约在两周到4周左右,也有可能更长。

以下是总结的应用场景:

1、中小型活动/品牌事件的传播,预算不多、周期较短。这种情况一般就是某些新品发布、企业招聘、**事件、中型会议等的传播。此时你需要权衡周期和成本的因素。

3功能型H5

个人觉得web应用肯定是未来发展的方向,就像上文所说的,很有可能未来的操作系统将被浏览器所取代,服务和应用将进入完全的云世界。当然距离这种假设还比较远,但唯一大家可以放心遵守的原则,就是聚焦于用户需求。

我所说的功能型H5,是同时聚焦于用户需求并且注重传播性的H5轻应用,也就是在设计H5的时候除了考虑传播的问题以外,也要思考如何把它变成一个持续运营的产品。这里面其实是思考角度的问题,从“我要传播什么”到“我希望用户传播什么”的转变。

轻交互重功能的功能型H5制作周期较短、成本也不高,成功的关键不在于酷炫的交互,而在于用户需求的把握以及后续的运营。

2、结合热点内容的品牌传播。这种类型的传播是最常见的,但是往往很多结合热点的H5传播都是一次性娱乐消费,大家看过就忘了。其实如果能从用户需求挖掘和产品运营的角度去思考,许多针对热点的H5传播都有很大提升的空间。

H5如何推广?

实际上H5可以推广的渠道有限,不像App的推广有各类应用商店的流量。关于这个问题可以说的不多,我仅针对性的提出几点建议:

1、从用户角度挖掘H5的价值点,写一篇软文。通过图文群发来推广H5无疑是最重要的方式,但是如果只是简单硬性推广,比如宣布今天我们上线了一个高大上云云的H5,然后就让用户点击“阅读原文”自己看,显然这种新闻通稿式的推广不会有太好的效果。

一个好的H5一定具备打动用户的价值点,从一个角度切入写一篇软文,无论通过投稿的方式还是大号转发都能给你带来意想不到的传播效果。投入再大再精彩的H5,如果没有好的推广就只能孤芳自赏,所以哪怕是留点推广预算也是值得的。

不要浪费每一篇图文的“阅读原文”,可能的话对于每一篇图文用不同的文案引导点击;

通过字体或者颜色的视觉跳跃引起读者的注意,而且不要长期使用同一个格式,因为当用户习惯了固定的格式之后会不自觉的忽略这些内容。

THE END
1.H5最新案例探索,前沿应用与发展趋势武夷山岩茶随着移动互联网的普及,电商行业对H5技术的需求日益增加,通过H5页面,电商企业可以实现快速搭建轻量级商城,提高用户体验,某知名电商平台利用H5技术打造了一系列富有创意的营销活动页面,实现了良好的营销效果。 2、社交媒体 社交媒体平台借助H5技术,为用户提供了丰富的互动体验,通过H5页面,用户可以轻松分享内容、参与活动,提http://fjsxsf.com/post/33290.html
2.商城html5模板,仿京东商城门户html5模板下载电商在当今数字化时代,商城HTML5模板以其先进的技术特性和跨平台兼容性,成为电商领域的首选。本文将深入探讨HTML5模板的优势、设计要点以及如何优化用户体验,帮助您构建一个高效、美观且功能强大的在线商城。 精品网站模板:https://www.91084.com/ (已发布1000+款) https://www.163.com/dy/article/JJ9V913T05568SD1.html
3.h5互动游戏开发今天,我们就来深入探讨H5互动游戏的耐玩性和长期吸引力,以及它是如何成为企业营销战略中的一张王牌。H5互动游戏的耐玩性首先体现在其内容的丰富性和多样性上。与传统的游戏相比,H5游戏通常设计有多个关卡或挑战,每个关卡都有不同的任务和难度设置,这样的设计可以满足不同玩家的需求,无论是新手还是资深玩家都能https://baijiahao.baidu.com/s?id=1818115032451587651&wfr=spider&for=pc
4.哪些网站可以免费做h5/搜索引擎营销成功的案例哪些网站可以免费做h5,搜索引擎营销成功的案例,响应式网站开发方案,wordpress主题上的字怎么移动写于 2016.07.14 项目地址:github.com/jrainlau/fi… 开发环境node版本为5.4.1 简介 作为一个经常写博客的人,在介绍自己的项目的时候往往需要介绍文件目录结构。在以往的情况下,要么一行一行手动码字输入,要么简单粗暴地http://www.llbn.cn/news/220627.html
5.h5营销推广(H5活动营销:三个关键,七种表现形式)H5营销主要是通过策划有趣的活动,激励用户转发分享,以获得曝光转化。本文作者通过研究H5活动案例,提炼出三个活动设计的关键要素,并总结了七种常见的H5活动营销形式,一起来看一下吧。 笔者通过研究大量的H5活动案例,提炼出三个活动设计的关键要素,并总结了七种常见的H5活动营销形式,我们可以根据业务需要,选择合适的营https://www.niaogebiji.com/article-613521-1.html
6.万字干货深度解析!H5营销设计的流量密码优设网在日常产品运营活动中,运营的视觉设计是不可或缺的一部分,尤其是 2c 领域的互联网企业对运营设计的需求量也是不断。本文将从运营视觉设计师的角度,讲解如何在运营活动中学习一些设计技巧,解锁私域运营设计的流量密码。*文章中出现的工具名单以及网址出处,我将会汇总到https://www.uisdc.com/h5-operation-design
7.将“H5”应用于营销,不光能刷爆朋友圈,还能赚到钱举个例子:你们还记得这张图吗? 这是当时一副度刷爆朋友圈的“回顾你的十年”,从开发者的角度他深度挖掘出了H5的价值点,一定程度上掌握了用户的心里需求和对过去发生事情总结的新鲜度。 下面跟大家分享一下,我所收集到的常用的H5网站 ①初页 初页pc版 https://www.jianshu.com/p/a029ef0f7058
8.《英雄联盟》H5营销的背后:一场瞄准年轻用户市场的“魔术”以90后和00后为代表的游戏玩家群体极具互联网思维,对营销行为自带免疫力,难以产生化学反应。即使是作为新生技术的H5,也难以保证效果,触礁极多。前不久,英雄联盟六周年活动所打造的“周杰伦读心术”H5宣传活动不仅影响了游戏玩家社区,更吸引了社会舆论的关注便是一个很好的例子。当然,这也于《英雄联盟》本身的玩家http://news.candou.com/769853.shtml
9.H5案例分析和嘲应用网站应用类h5案例前面几个例子都是“专业人才”,在技术的运用上各精一道,或是触屏,或是多媒体,或是重力感应。当然还有集各项技术于一身的“全才”,这里最有名的要数巴宝莉“从伦敦到上海”的旅程。 产品介绍型 聚焦于产品功能介绍,运用 H5 的互动技术优势尽情展示产品特性,吸引用户买买买。 https://blog.csdn.net/weixin_44934844/article/details/115496062
10.2016年营销人应该关注的5大领域知识库如果能利用好微信本身的社交属性,H5新一轮营销热潮将很有可能伴随游戏而生。 多屏 WebSocket对不懂技术的人会比较陌生,但相信这个HTML5的独有技术特性,将在未来影响很多人在移动Web端的体验。 举个例子,A和B通话,在早期电话刚出现时,需要有人工交换机实现信息的传递,而现在A和B可以直接通话、即时交流。 https://www.shichangbu.com/know_info/26585.html
11.24好玩首页免费制作微信互动营销H5小游戏活动对数组的key排序(ref: PHP默认ksort函数), 然后使用join函数连接数组的value. 具体查看下面例子。 token = MD5(raw_str) 验证码 注意事项 一旦游戏识别到存在APPID参数,与微信相关功能将不被支持,具体不兼容功能清单如下: 分享设置模块。 营销接口:分享后获奖。(在活动规则处自动隐藏) http://shanyou001.com/
12.24好玩首页免费制作微信互动营销H5小游戏活动ksort($data);//对数组的key排序(ref: PHP默认ksort函数), 然后使用join函数连接数组的value. 具体查看下面例子。 $raw_str = ""; foreach($data as $key => $item){ $raw_str .= $item; } $private_token = ""; string 私钥(工作台中已自动生成)固定在最后 http://www.fanqiehui.com/
13.H5H5营销经典小例子中,摇一摇、抽签、摇签和红包是常见的营销互动方式。通过HTML5技术,可以实现这些互动形式,吸引用户参与并提升品牌曝光度。比如,利用摇一摇的互动方式,用户可以通过手机传感器产生随机抽奖结果,增加用户参与感和趣味性;抽签活动则可以模拟传统的抽奖环节,让用户感受到丰富多彩的线上互动体验;摇签则可以结合https://www.coder100.com/index/index/content/id/3221189
14.阿里开源的H5游戏引擎Hilo,打造轻巧无依赖的营销互动小游戏Hilo是阿里团队推出的开源H5游戏引擎,对非游戏从业的前端开发者非常友好,轻量无依赖,特别适合开发营销小游戏。 Hilo官网 阿里团队内部使用的游戏引擎,Hilo活跃在电商节日和活动中,比如双十一狂欢城、手机淘宝的打年兽互动等游戏均基于Hilo开发。 Hilo作品例子 https://www.hxsd.com/information/21320/
15.48种企业IP化营销方法大全陈格雷?IP化营销,指的是企业将IP文创的众多方法,注入到企业营销中,对网络化、碎片化、圈层化的市场非常有用。 如图所示,共分为八大类型,分别是:品牌IP化6种、产品IP化7种、渠道IP化7种、个人IP化4种、活动IP化5种、内容化营销10种、发展衍生品3种、未来的场景6种,合计48种。 https://www.haoad123.com/article/1254.html
16.浏览那些经典出圈的古风h5,着实是仙气满满~各大品牌也纷纷通过在营销活动中融入古风元素的方式来激发消费者们的情感认同,古风h5就是一种常见的形式。先来看看几支经典的古风h5例子。https://www.canva.cn/learn/antique-h5/
17.2019年的新媒体从业者,必须要掌握的10个技能!我从事互联网7年,其中6年为新媒体行业,一开始入行的时候,是作为网络MarketUP营销自动化存在的,那个时候做编辑很简单,有一定的文字功底,懂得文案的一些技巧即可。 慢慢地,需要会访谈、会拍摄精美的图片,之后就需要能够进行线上线下的活动策划(在不花公司一分钱的情况下)…… https://www.marketup.cn/marketupblog/newmedia/11290.html
18.惠州短视频内容营销,短视频营销怎么做做好视频营销的是制定内容策略,举个简单的例子:推广女性化妆品的视频,应该以女性的话题为主。比方说,融入娱乐八卦的素,以明星化妆后的照片与生活照作比较,引出化妆品如何选择的问题。或者以幽默、搞笑的方式介绍某款化妆品的功效,这种方式更容易吸引用户点击,再加上一个有内涵的标题,不愁没有用户愿意点击。只要http://www.pzhseo.com/article/sghgog.html
19.数据分析20大基本分析方法技术总结分析目的分析案例分析4、政策方面分析例子 四、多维度拆解分析法(维度+拆解) 1、概念 多维度拆解法就是从不同的角度看待问题。维度就是观察的角度,拆解就是在多个维度进行加法,也就是多个维度构成一个答案。 2、举例 评价一个公司好坏需要从多个维度出发: 1)加班强度 2)通勤时间 https://blog.51cto.com/u_15738244/5536077
20.抖音风剪辑师xooo(抖音风剪辑师视频合集)抖音发布了《世界名画抖抖抖抖抖起来了》H5作品,据悉这款H5的制作发布团队包括了奥美、IMAD及微博等企业,可见此举是抖音倾力打造的重要推广环节,如图3-6所示。最终,这款H5取得了高口碑,刷爆了抖音粉丝的朋友圈。 专家提醒 H5是一种娱乐化社会营销新模式,它的制作流程非常简单快捷,却能呈现出奢华多变的画面形式https://edu.xinpianchang.com/article/wenku-763206.html