不会代码也可以做H5页面了，H5制作工具大全来看吧！

这篇文章总结了目前所有的H5工具，做了分类，比较了收费模式，划分了详细内容属性，写的比较详细，大家可以仔细阅读学习：

H5是超文本标记语言（HTML）的第五次重大修改，基于HTML5开发的网页APP拥有更短的启动时间，更快的联网速度。通俗的讲，使用H5制作的微页面，在微信的宣传中，重点突出、目标明确、交互更具吸引力。

那要制作H5页面是不是只能去学代码呢？

当然不是！

自从H5爆红后，制作H5页面的工具层出不穷，已经多到叫人目不暇接了，不信？往下看：

epub360、vxplo互动大师、码卡MAKA、易企秀、兔展、初页、易传单、未来应用、品趣、点点客海报、秀制作、微杂志（有赞商城，原口袋通）、云来（LiveApp）、最酷轻应用、COOLAPP、我傲、木疙瘩、居高互动刊、调用等等等等......

如果只能做请帖或邀请函也算的话，还有：

快邀约，微喜帖、维斗喜帖、聚喜......

如果国外的也算的话，听（英）说（语）还（不）有（好）：

Wix、Google Web Designer、Weebly、Ceilfire、Jimdo、Mixeek......

反正已经多的让我眼花缭乱了，当然肯定还有没有统计到的。

一、分类

在详细介绍这些H5工具之前，我们先把它们做个简单的分类，按照这些H5工具的自主定制空间及使用方式等，将它们分为以下三类：

• 完全自主定制： epub360、vxplo互动大师

• 模板一样快捷：码卡MAKA、易企秀、兔展、易传单、未来应用、品趣、点点客海报、秀制作、微杂志（有赞商城，原口袋通）、云来（LiveApp）、最酷轻应用、COOLAPP、木疙瘩、居高互动刊、调用等等（其实模板更好理解一些，但是遭到了众多朋友反对，强烈声明不是模板，那就改成“像模板一样快捷”吧）

• APP：vxplo互动大师、初页、聚喜、我傲、易企秀等（vxplo以网页端为主,用户主要面向企业级，推出的APP主要是为了满足相对非专业的用户的需求）

不同类型H5工具的对比：

• 自主定制类：

优势：完全自主定制、可操作性强

劣势：功能较多，学习时间成本较大

• 非自主定制类：

优势：操作简单、随学随用

劣势：只能选择使用，不能定制功能和交互效果。

一句话来描述“自主定制类”和“非自主定制类”H5工具的区别：就是Photoshop和美图秀秀的区别。

至于孰优孰劣，那就看使用者的需求，仁者见仁智者见智了！

二、收费模式

在给这些H5工具做了简单分类之后，我们来谈谈最现实的问题：钱的问题，收费模式的问题。

据不完全统计（窥斑见豹，本次抽样统计的样本为：epub360、vxplo互动大师、maka、兔展、易企秀等），H5工具收费模式主要有：

1）免费（含广告）版

大多数的H5工具，都采用增值付费的模式。即提供含广告的免费版，如果需要去除广告，则需要支付相关费用。广告形式主要有两种：一种是在加载页显示对应LOGO和“由XX提供技术支持”字样；另一种是在最后一页显示“免费创建这样的展示”'点击制作我的XX'等。

2）付费版(价格从单两块钱一次到每年59999不等)

免费的版本大抵相同，付费的版本各有各的理（jie）由（kou）:

a.按时间和次数，导出一次的价格、多次“团购”价格，以及月付费价格、年付费价格等，价格最低的应该是秀制作

价格最高的应该是epub360,人民币59999元每年，不过功能也是最全面的，期待更高的价格

b.作品数量限制，站内存储空间、站外数据流量

选择不同的价格套餐，会有相应的作品数量限制，也有的H5工具限制站内存储空间或是站外的数据流量。如上图，epub360免费版最多可创建10个H5页面，相应存储空间只有2G；而站外数据流量，是像vxplo这样，通过获取作品的js、div、html代码,嵌入自己的网站，在分享的时候用户看到的事你自己的域名，这样就会产生站外数据流量。

c.数据监测功能：PV、UV、访问地址、手机型号

通过划分不同的付费标准，提供用户数据监测的权限，包括用户访问的PV、UV、访问来源、使用的手机型号等等。

d.访问加速、作品优化等

通过技术手段对作品进行优化，加快作品打开速度等，当然了，会有加速程度的划分和作品优化次数的限制。

e.客服支持

每一种H5都有技术支持、帮助的方式，如通过论坛、邮件、电话、QQ群等方式进行咨询，而高级VIP用户，更是可以获得专属客服顾问服务。

f.HTML文件导出、专用域名

可自主定制的epub360，可以通过导出HTML文件发布到自己的网站上，也可以通过绑定到专用的域名来进行发布；而对于同样类型的vxplo，可通过代码嵌套的形式达到显示用户自己域名的目的。

g.其他增值功能

微信的规则不断变化，各个H5工具也是紧随其后。而高级VIP用户，肯定会在第一时间尝到甜头。如微信拍照功能、摇一摇、点赞等等。

三、重要元素

• 背景图
  炫酷的画面，离不开背景的衬托，能否快速更换背景图，相信是考验一个H5页面能否快速完成的准则之一。
  
  

• 文本
  微信交互H5页面更重交互，重视觉效果，在酷炫的背景衬托之下，突出重点的文字往往是点睛之笔。
  
  

• 音乐
  炫酷的背景下，配以提纲挈领式的文字，如果能够再来一段能够引起共鸣的音乐，那是何等的应景，此时，我百度了下“H5页面背景音乐”，试听之下，心潮澎湃！激情四射！
  
  
  

• 图片
  背景之外，重点图片之间的交互、与文字的配合正是H5页面能够调动用户感官的重要方式！光速的定义是光在1秒内行驶距离的299792458分之一，所以光速比声速快，比打字速度更快。那为什么不用图片呢？
  
  

• 视频
  如果炫酷的背景、精炼的文字、应景的音乐，还不能够让你感到震撼的话，那就来段视频吧！一目了然！

• 按钮（点击跳转链接）
  H5页面在微信展示的优势是交互效果好，观赏性强，但是归根结底，还是要回到营销的目的上来。或用于宣传，需要链接到更为详尽的介绍页面；或用户收集信息，需要链接到指定的信息收集页面。如此一来，是否具有点击跳转功能就成为判断一个H5工具是否可供选择的硬性标准之一。当然，也有个别H5工具对“点击按钮”这样的功能，用付费与免费做了区分，在对比了众多工具之后，我认为这是很没有必要的。当然了，如果它的用户对H5工具所知甚少，又疏于使用搜索引擎查找的话，这样的做法也不失为一个不错的盈利点。

• 输入框
  在微信H5页面中，除宣传类外，大部分都是以收集信息为目的的。除了使用麦客表单、金数据、问卷星等第三方表单收集工具外，各个H5工具内置的输入框功能也不失为一个很好的选择。这样，在对应的后台，不仅可以看到访问信息（如已有查看权限），还可查看详细报名数据。

• 其他
  微信规则处于动态平衡、不断变化中，各家H5工具也会随着相应变化。每一个新功能的出现，都足以成为一个亮点，迅速火爆朋友圈。如图片替换功能，用你自己的图片替换掉作品中名人的图片；摇一摇参加互动等等。

四、常见交互效果

对于定制类H5工具如vxplo互动大师、epub360,交互效果完全可定制，只有想不到、没有做不到！对于非定制类的H5工具，也都提供了足够多的可供选择的交互方式。

据不完全统计，主要交互效果有：

• 飞入，从上下左右不同方向飞入页面。

• 淡出，透明度由弱变强，带用户进入画面。

• 旋转，2D旋转和3D旋转，增强观赏性。

• 大小，从小到大，从大到小，重点突出。

• 跳跃和抖动，跳跃、抖动的元素，活泼可爱。

• 擦除效果，用手擦一擦，见证惊奇的时刻。

• 指纹识别，就是长按功能，加上指纹识别的概念，瞬间高大上。

• 其他，加上“雨滴”“烟花”“闪烁”“粒子化”等特效，档次立马就不一样。

五、其他

任何一个效果的完善，都足以让用户充满敬意；

任何一个细节的优化，都足以让用户感受到认真和品质；

任何一个功能的改进，都足以让用户在使用与放弃之间做出选择；

也许，选择使用一种H5工具，只是因为它更换图片比其它工具都要快；

也许，选择使用一种H5工具，只是因为它复制案例比其它工具更轻松；

也许，选择使用一种H5工具，只是因为它的编辑器布局更加容易记忆；

您觉得呢？

总而言之，工具毕竟是工具。页面做的再精美，交互做的再有吸引力，没有微信这样的超级平台，没有微信开放的态度，没有微信连接一切的野心，恐怕都很难如此迅速的传播开去！

本文来自创业邦Demo8