H5+时代：如何做一个有温度的H5？
扫描,分享朋友圈
移动互联网的时代，H5已经不仅仅只是一个展示工具。
H5+游戏=互动
H5+图片=移动海报
H5+动画+音乐=微电影 从早期的单屏滚动，到后期的立体交互，H5+时代已经来了，几乎所有的创意表现，都可以通过H5来展现。随着H5模版开发的快速更迭，人人都可以制作优质的H5，如何才能脱颖而出，一鸣惊人？
2014年的某一天，一款名为《测测你的帐号价值》的H5风靡了整个朋友圈。在那段时间里，原本低调的好友纷纷开始炫富：“我的QQ居然价值18栋海边别墅”“我的QQ价值3800个王思聪同款电脑桌”……
2015年的春节，在红包漫天飞的朋友圈里，又杀出一款《任性派发年终奖》的H5，好友们在大晒自己上百万的“年终奖”同时，还很豪气的给老板也发一份，博个新年好彩头。
这两款浏览量和参与量均破千万的H5都由电脑管家出品，旨在表现蕴藏了关系和情怀的QQ帐号价值的重要性，从而提升帐号宝这款产品的品牌效应。娱乐性的H5，总是昙花一现，热闹过了就消失不见，至多作为“经典案例”给后来人参考。
很少有H5会像《帐号价值》一样，前后跨度近半年，参与人数达到1400万，总PV数更是达到4000万之多，即便是半年后的今天，每天的参与人数依然数以万计。不用奖品诱导分享，仅仅只是虚拟货币带来的虚拟价值，就足以活跃整个朋友圈。一、参与
微信是一个与众不同的关系平台，它和QQ一样，把朋友、同事、亲人、爱人，构成了关系稳定的朋友圈，有可以同步展现所有与我相关的动态，因此，在这里所分享的东西，大多也是与我有关的，或者有我参与其中，又或者让我觉得有趣。
于是，H5的互动性就成了用户参与的重要因素。场景化的H5能让人们有代入感。例如在《帐号价值》的H5中，就能让人们很好的置身其中，为自己找到一种角色定位。H5的技术不断在发展，如今的HTML5能轻松实现绘图、擦除、摇一摇、重力感应、擦除、3D视图等互动效果。
但并不是只要有交互效果就能引发参与。擦一擦或许能诱发受众动手，但并不能进一步引发用户的兴趣。交互只是一种表现形式，真正吸引人的是与人们相关的场景化体验。二、情怀
随着互联网的发展，每个人都有了自己的判断力，怎样的内容谓之好，怎样的内容值得分享，每个人的心里都有自己的评判标准，而情怀正是这标准之一。讲个好故事，容易引发受众的情感共鸣。这个故事，就是H5的灵魂，如何讲好一个故事？这就要求我们赋予H5情怀。情怀这个互联网热词已经被提及太多次了。但是，依然不能丢弃。在一个H5中如果只有品牌输出或者只有交互，那么这个H5定然是缺乏灵魂的。一个好的H5能在情感上引发共鸣，揣摩之后，人们能够延伸到生活中。
《任性派发年终奖》H5很恰当的在年终奖大热的时期，率先引发一种自我意识觉醒的潮流。受众可以主动给别人派发年终奖，这让人们不由得进行自我价值的肯定，且又不失趣味性。所以说让受众感觉有情怀的最好办法，是站在受众的角度去思考。三、背景
互联网时代，受追捧和被冷落有时候是无厘头的，比如《我的滑板鞋》、比如“张全蛋”、再比如“duang”。但没有任何一个受追捧的内容是无背景的，质朴平实造就了滑板鞋，成就了张全蛋，而成龙本人就duang的一下成了背景。
H5也是一样。2014年，一款《家和万事兴》的H5在朋友圈掀起了一波行动的浪潮，也开启了指纹互动的先河，亲情，就是它的背景。
大众点评出品的《你我之间只有一个字》，紧张高压的社会环境和人与人之间的距离，就是它的背景。同样，腾讯电脑管家《帐号价值》的H5，也同样有它的背景——大数据。基于QQ的大数据，基于安全的大数据，在产品经理的打磨下，成就了一款生动的H5。这一切，并非偶然。四、温度
温度这个词似乎有些虚化，但它却可以刚好反映出一个H5制作者的态度。温度可能炽烈，也可能清冷，但不可能一成不变。一个成功的H5，必定是会随着时间，随着热点，甚至随着情绪变化不停在变。
没有一个H5是能永存，每个产品、每个H5都有它的生命周期，但是我们可以尽可能的延长一个H5的寿命。《帐号价值》和《任性派发年终奖》不是跟风的H5，也不是在H5风靡之时大众化的H5。这样的H5能更好的传递品牌价值，引发品牌联想。一个有温度的H5才能历久弥新。
互动性让人们有参与欲望，情怀让人们有感同身受，最终因为温度，让人们乐于分享给身边的朋友。由名表豪车，到星际旅行，再到大家都关注的年终奖，《帐号价值》H5所幻化而成的价值不停在变，随着热点在变，随着时间在变，让参与其中的人每次分享都会获得不同的关注。互联网+时代下的H5，在收获浏览量和口碑的同时还能收获温度，这可能是下一个进击的方向吧。
数英转载规范*文章为作者独立观点，不代表数英网立场
1.在转载文章开头与结尾标注“文章作者”、“来源：数英网”并附上本文在数英网的链接；2.在文章结尾加上介绍：数英网()是中国顶级数字业界平台，探讨品牌营销、市场传播、广告创意设计等；3.如果作者注明不能转载及需要授权的，请联系作者本人！
扫描,分享朋友圈
|后参与评论
该用户邮箱不存在,请重试！
请输入密码！
资料更新成功！
还可以输入300字
您为什么要举报此信息？
请输入举报内容
关注微信，一起数字进行时
手机扫一扫，下载数英APP
手机扫一扫，下载数英APPH5页面制作 没你想象的那么简单
　　不知道从什么时候起，H5页面宣传册成了万千企业争相使用的工具。H5页面的叫法有很多，也会称为翻翻看、手机微杂志、广告页、场景应用、海报\画报(动态海报、指尖海报、掌中海报、动画海报、微画报、微海报)等等，但大体上指的是这类应用：
　　目前初页App、Maka和易启秀在低端H5制作市场使用人数最多，传播范围最广。其实除了这三个网站外，还有很多网站可以选择：
中低端（需求简单）：
点点客海报
中高端（需求多样）
epub360意派
专业工作室：包括但不限于[腾讯 ISUX]、[ treedom]为代表的专业制作团队
　　围住神经猫、一页N次郎、有道云笔记学霸测试，都是码农的作品，需要懂得相应编程语言。
　　H5页面的需求分为三种，相应的注意事项也为三类，今天主要与大家讨论制作中低端类H5页面需要注意的事项:
1.你可以使用PNG
少用JPG，多用PNG&& PNG格式的透明背景是做成一个特效绚丽H5页面必不可少的元素
一个合格的H5页面& 大多数要采用PNG格式的图像
2.分解分解再分解
　　我们分析一下这个页面的组成
　　一个透明三胖：
　　一个透明对话：
　　一个透明对话的对话：
　　一个底板：
　　一个右上角标：
　　这是非常简单的H5页面分解，还有更麻烦的动画H5
一个比较复杂的H5页面需要的PNG
3.注意图片大小
　　第一次接触H5页面时，我跟你们一样使用JPG图像，还初生牛犊不怕虎的选择&高清保存&，直到有次客户反馈问题，才发现打开过慢问题的存在。
每张图片都要200K+
　　从那次后我将保存的质量调整为3~4，画质损失不多，空间急剧下降！
透明图片大小25K左右
4.想一个好的标题
　　好的标题能在0.1秒的时间让客户点击你的链接。所以我推荐可以适当降低H5页面的华丽度，去取一个好的标题吧！比你埋头苦干强多了。
5.请使用PS/Adobe Audition/GIF Maker/Chrome等工具制作
　　常常看到有人使用初页App制作H5页面，出来的效果可以说是惨不忍睹&&
典型的粗制滥造
　　我不是说初页APP不好，而是手机APP的局限性使它不适合制作H5页面：你听说过谁用手机写长篇小说的？手机端只适合观看阅览，根本就不适合制作。
　　正确的做法是，下载PS/Chrome/ Adobe Audition，这三个玩意保证你做出效果不错的H5页面。
　　实在不行美图秀秀/360极速浏览器也行，凑合用呗。
PS必不可少
　　最后，一颗想要求知探索的心是你做好H5页面的根本。
　　当你觉得易启秀不能满足你的要求了，Vxplo是你学习的对象
　　当你觉得Vxplo不能满足你的要求了，Html5语言是你学习的对象
　　不要当伸手党，能百度到的东西还让我告诉你，要点脸好吗？
　　不要认为自己不会，没有学就说自己不会，你是Loser吗？
　　分享给大家一句话：装逼得逼，装豆得豆；念念不忘，必有回响。
　　谢谢。
技术支持：【教程】如何制作一个朋友圈刷屏的H5宣传？史上最详细！！
【有赞教程】如何制作一个朋友圈刷屏的H5宣传？史上最详细！！！
大家在有赞开设了店铺后,对于如何传播，推广以及粉丝互动应该都有一些困惑，比如：
如何增加产品曝光量？如何增加客源？如何讲好关于品牌的故事？如何多方面展示产品以及店铺的独特性？怎样才能让更多人了解到我的品牌，我的店铺以及商品？怎样更好跟粉丝进行互动？怎样可以第一时间收到用户的反馈？
有赞为解决大家的需求，和免费的H5制作神器MAKA进行合作，共同为有赞店家解决相关的传播需求问题。MAKA专门为有赞的商家提供了各种类型的模板。可以帮助店主进行店铺展示，新品推荐预售，促销活动推广，粉丝互动，招募代理等等不同的微场景展示；不需要懂代码，也不需要会设计PS，套用一个合适的模板场景，几分钟就可以轻松制作出精美的互动页面进行分享传播啦。
那么今天有赞小编要教大家如何套用模板制作H5，给你的产品加大曝光率，提高潜在客户。 一个优质的H5作品，通过创意的图文展示可以让你的品牌形象以及产品功能生动起来，再引导用户进入有赞小店直接进行购买。并且可以轻松转发在微信公众号，社区，QQ空间，部落，各大门户网站的地方，或者制作成二维码印在产品上，宣传单上，以及海报横幅上，通过不同的方式来增加产品曝光率。这样比单纯在朋友圈发九宫格图片效果要好得多。
第一步：登录有赞官网，打开店铺管理，在【应用和营销】板块可以迅速找到MAKA；（或者在有赞拍档里面也可以找到MAKA的QQ以及电话联系方式哦）第二步：进入有赞-MAKA模板商店页面，你可以看到，在其中有相当多种不同场景的模板可以选择。【产品推广】【活动促销】【企业招聘】【生活服务】这几个标签一般来说是符合有赞的店主需求的。这里我们选择【产品推广】标签，【天然成分的美妆护肤产品模板】。第三步：点击【马上使用】，我们一起进入编辑页面。第四步：首先进行封面页的编辑。1、修改文字。点击文字，在右侧文本内容输入内容，如果你觉得字体太小、颜色太深你可以自行调适。2、替换图片。点击图片，点击右侧【更换图片】按钮，上传你的图片，并选择。PS：每张图片（支持jpg、png、gif）不大于2M哦~第五步：内容页制作。可以按照模板原有逻辑顺序进行编辑，也可以自己自行调整。1、替换模板的品牌信息、产品信息、换掉logo以及图片2、复制/增加页面。如果你觉得自己的产品很多，需要更多的页面。你可以点击右侧的【复制页面】，可复制当前模板页面，或者左侧的【+】的按钮，自由添加普通模板或者特效模板。 第六步，添加表单。增加与顾客的互动，除了试用新品，还可以设置免费领小礼品、免费体验店内产品等。表单内容也可以自行删减或调整，按钮反馈也可以根据个人风格，比如“谢谢亲的配合，试用小样会在明天送出哦~”之类的。第七步，在尾页添加按钮，可以加入有赞**链接或者促销活动的链接，直接跳转到有赞相关页面，让顾客到店一键下单购买。第八步，保存项目。点击页面右上角【保存】左侧的【预览】按钮，进行对项目的预览，以保证信息的准确，特别是价格等数字，需要反复确认！PS：制作过程中也要经常保存项目，避免因为网络或者手误等问题丢失项目。 第八步，更改封面、标题、描述。更改后点击【完成】。第九步，推广分享1.有赞平台、微信、微博、QQ部落等都是很好的宣传平台，通过图文群发或者增加自身平台的链接入口来推广H5无疑是最重要的方式。商家们可从产品干货、品牌故事、用户交流、福利活动等方面撰写能打动用户的软文， 再推广H5都是不错之选。2.在微信扫一扫打开后，可以直接分享给朋友、微群里面或者朋友圈里面进行传播；如果有公众号的话，也可以放在公众号【阅读原文】里面，或者设置在菜单栏里面；3.线下二维码也是一个非常好的推广方式，可以把二维码放在产品，海报，实体店铺上面，通过有奖激励的方式引导用户扫描观看并发布朋友圈。4.把握投放时机：通常H5页面上线推广第一天是访问顶峰，第三天后的数据就会趋于平稳。尽量集中优质资源在一两天内进行大范围推广，争取短时间内得到强曝光。5.监控实时数据：商家们还需要监控数据情况，要能准确知道H5的打开率、转发率、转化率等，进而指导营销策略的调整。 除此，商家之间、与媒体之间、与平台之间都可尝试资源互换、商务活动等合作方式为H5增加流量。目前有赞商城和MAKA平台也强强联手，只要商家利用MAKA创作优质的H5营销场景，便有机会被MAKA免费推荐到平台资源位，几百万的流量入口即可轻松获取，快来制作吧。 观看完整作品，请点击》 我想看看其他姐妹的H5作品：OUMYCA&&请点击》 金盏花能量水&&请点击》 金花茯砖茶免费赠送活动&&请点击》&&生态美眼霜&&请点击》&&
Q&A小贴士：1.& &Q：MAKA能提供什么模板使用？A：MAKA为你提供海量的H5海报模板，其中包括场景模板和单页模板。场景模板：应用于不同行业场景。登陆平台后，点击【模板】可查看所有场景模板，挑选并购买后，回到项目列表-已购模板，点击即可使用；单页模板：MAKA提供了丰富的普通模板，统计模板，特效模板；在场景编辑页面，点击界面左下角“+”符号，即可选择和添加单页模板；2.& &Q：付费版本提供什么服务？A：MAKA项目制作发布功能都是免费使用的，MAKA付费版本提供去除H5微场景画报尾页MAKA版权LOGO、提供专属顾问指导、更多动态模板等众多功能。你可在电脑登陆MAKA平台（），点击网站顶部-付费服务，查看付费版更多详情。3.& &Q：如何查看MAKA H5作品访问数据？A：H5海报发布后，你可登陆进入MAKA平台-我的项目，把鼠标移到项目封面点击【统计】，即可查看你的H5海报详细访问数据。4.& &联系MAKA:电话：400-996-9916QQ：邮箱：support@maka.im
发表于 16:09&&|&&
Maka,我用过，挺赞的，你们也在有赞开店了吗？
品牌策划 | 店铺运营+装修 | 商城定制
微信：&&邀请码:30
发表于 16:13&&|&&
快递助手专业打单发货
可以多店铺关联
有赞快递助手qq交流群哦：
有问题随时来问后使用快捷导航没有帐号？
说不定很多人觉得你有一股乡土气息