10个H5页面制作工具

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了10个H5页面制作工具相关的知识,希望对你有一定的参考价值。

目前市面上各种H5页面制作工具,其中既有滥竽充数的,也有真材实料的。但是怎么区分呢?其实最简单的办法就是看案例,也就是用这些H5页面制作工具能做出哪些类型的H5。

技术分享

笔者在创作H5的路上走过很多坑,基本国内外所有的H5页面制作工具都用了一遍,这篇文章也是希望能让大家在H5页面制作工具的选择上少走点弯路。

以下是笔者浏览了近万个优质案例后,总结出来的各大H5页面制作工具对H5种类的支持分析,以及付费情况。

1. 易企秀

http://www.eqxiu.com/

百度指数:★★★★★

技术分享

易企秀界面

作 为百度指数最热的易企秀其实很容易定义,就是移动版PPT的H5页面制作工具,用来在手机上做简单动态演示。所以它各方面的组件,比如文本、按钮、图表、 动效这些都和微软的PowerPoint非常相像,用于问卷类型的表单采集,但不能自主设计。总的来说,使用难度比较低,主要面向对H5没有太高要求的用 户。

支持的——

素材:图片、视频、音乐、文本、中文字体、幻灯片

动画:平移、缩放、淡隐等动效(跟PPT类似)

交互:点击(可以触发元素显示/隐藏)、滑动翻页、摇一摇

H5:微信邀请函、个人电子贺卡、手机相册等微场景

典型案例——

技术分享

易企秀的H5页面

付费情况——

免费版:提供基础编辑,有在线教程和人工客服

增值版:能去除广告尾页、底标和加载LOGO、外链添加、数据统计等高级功能,有专属客服

2. iH5

http://www.ih5.cn/

百度指数:★★★★

技术分享

iH5界面

iH5 定位于取代html5网页编程的可视化工具,是H5页面制作工具里比较标新立异的产品,因为功能很完善,笔者用的时间比较长。客观来说iH5完全取代编程 目前还达不到,不过确实几乎所有能想到的H5类型iH5都能实现,而且好像用的知名企业和官方媒体很多。学习难度算中等,笔者是文科专业出身,大概三四天 看教程学习能做个H5小游戏吧。

支持的——

素材:图片、视频、音乐、文本、中文字体、图片序列、幻灯片、GIF、富文本、嵌入网页、全景图、PSD、画板(就是带涂鸦功能的东东)、文件(PDF、Word)

动画:轨迹动画(简单来说就是复杂动画),动效(跟PPT动效类似),物理运动,滑动时间轴动画(这个比较难懂,就是可以通过手指滑动控制的动画)

交互:点击、手指按下/离开、滑动、鼠标移上/移下(PC案例会用到)、滚轮滚动、键盘按键、摇一摇、重力感应、擦一擦、图片上传与合成、视频交互、微信红包发放、自定义转发标题/描述/缩略图、微信昵称/头像获取、数据库增删查改、外部数据调用

H5:H5动画、互动广告、小游戏(支持重力感应和物理引擎)、全景、交互视频、照片合成、电商支付、微信红包、评论弹幕、电子杂志、微信邀请函等

典型案例——

技术分享

技术分享

iH5的H5页面

付费情况——

免费版:功能没有限制,有在线教程和人工客服

增值版:针对企业用户,能修改加载LOGO和广告底标,有专门的数据服务,有一对一技术支持和线下培训,支持外部数据通信,开发者外调JS函数

3. 兔展

http://www.rabbitpre.com/

百度指数:★★★☆

技术分享

兔展界面

兔展和易企秀很像,属于能生产翻页、可以对文字和图片进行排版的H5页面制作工具,不过感觉功能会比易企秀少一两个。做出来的H5基本是用在微场景上,比如微海报、微邀请函、微信相册这些。

支持的——

素材:图片、视频、音乐、文本、中文字体

动画:平移、缩放、淡隐等动效(跟PPT类似)

交互:点击 滑动切换

H5:微信邀请函、微海报、手机相册等微场景

典型案例——

技术分享

兔展的H5页面

付费情况——

免费版:功能没有限制,有广告底标,有加载LOGO,有在线教程和人工客服

增值版:有共享模板,能申请举办活动,有专属客服

4. MAKA

http://www.maka.im/

百度指数:★★★

技术分享

MAKA界面

MAKA属于低能版H5页面制作工具,有很多模板套件,直接往里面填东西就行。笔者使用MAKA的时间比较早,当时用的是APP,做出来的页面比较卡。虽然功能不多,但对只想发发文字、照片合辑的人来说,还是比较方便的。

支持的——

素材:图片、视频、音乐、文本、中文字体

动画:平移、缩放、淡隐等动效(跟PPT类似)

交互:点击,滑动切换,模板(点赞,倒计时)

H5:手机相册、小测试等微场景

典型案例——

技术分享

MAKA的H5页面

付费情况——

免费版:数据统计有限制,有在线教程和人工客服

增值版:能去除广告尾页,有专属客服

5. 初页

http://www.chuye.cloud7.com.cn/

百度指数:★★☆

技术分享

初页界面

严格意义上,初页不能算是H5页面制作工具,有一个非常贴切的比喻是傻瓜相机,零门槛,小学生也能用。它本身就像一个照片合成器类型的H5,提供现成的模板版式,往里面换一下照片就行。

支持的——

素材:图片、视频、音乐、文本、中文字体

动画:平移、缩放、淡隐等动效(跟PPT类似)

交互:点击 滑动切换

H5:手机相册

典型案例——

技术分享

初页的H5页面

付费情况——

6. 搜狐快站

http://www.kuaizhan.com/

百度指数:★★

技术分享

搜狐快站用来做移动网站比较方便,是面向建站的H5页面制作工具,有很多固定样式的框架,可以直接往里面填内容。不过有利也有弊,网站的布局等如果要改动,必须使用代码才行。有搜狐自媒体号的话,还可以直接生成一个移动主页。

支持的——

素材:图片、视频、音乐、文本、中文字体,幻灯片

动画:平移、缩放、淡隐等动效(跟PPT类似)

交互:点击 滑动切换

H5:移动网站、电商支付,和微海报等微场景

典型案例——

技术分享

搜狐快站制作

付费情况——

7. 咫尺微页

http://www.zhichiwangluo.com/

百度指数:★☆

技术分享

咫尺微页的界面

微页的广告非常复杂,而且界面、性能也不怎么样,算是这些H5页面制作工具里给我印象比较差的。只用过一次,我很难想象真的会有人花钱去掉各种各样的广告。

支持的——

素材:图片、视频、音乐、文本、中文字体,幻灯片

动画:平移、缩放、淡隐等动效(跟PPT类似)

交互:点击 滑动切换

H5:移动网站、电商支付,和微海报等微场景

典型案例——

技术分享

咫尺微页的H5页面

付费情况——

免费版:能进行基础编辑

增值版:能去除尾部链接、加载LOGO、广告底标、侧边栏等广告,有评论弹幕等高级功能,可以互推

8. Epub360

http://www.epub360.com/

百度指数:★☆

技术分享

Epub360的界面

Epub360的功能比易企秀多一些,又没有iH5那么多,应该是面向个人设计师的H5页面制作工具吧,处于没那么个人、也没那么商业化的模糊地带。

支持的——

素材:图片、视频、音乐、文本、中文字体,幻灯片

动画:平移、缩放、淡隐等动效(跟PPT类似)

交互:点击,滑动切换,摇一摇,微信分享成功后

H5:移动网站、电子杂志,和微信邀请函等微场景

典型案例——

技术分享

Epub360的H5页面

付费情况——

免费版:支持基础编辑,有在线教程和人工客服

增值版:去除加载LOGO,有高级表单等,有专门的技术支持服务

9. Wix

http://www.wix.com/

百度指数:★

技术分享

Wix的界面

Wix是国外的H5页面制作工具,用来建PC端网站很方便,因为模板很丰富,现套现用。不过根据我之前使用的情况,它的网页在国内稳定性不是很强。

支持的——

素材:图片、视频、音乐、文本、中文字体

动画:平移、缩放、淡隐等动效(跟PPT类似)

交互:点击 ,鼠标划入划出

H5:电子相册、微信邀请函等微场景

典型案例——

技术分享

Wix的H5页面

付费情况——

免费版:功能没有限制

增值版:去除广告,购买网站

10. 最酷网

http://www.zuiku.com/

百度指数:★

技术分享

最酷网界面

最酷网和上面大部分H5页面制作工具差不了多少,不过名气小一点。

支持的——

素材:图片、视频、音乐、文本、中文字体,幻灯片

动画:平移、缩放、淡隐等动效(跟PPT类似)

交互:点击 滑动切换,摇一摇

H5:微信邀请函、个人电子贺卡、手机相册等微场景

典型案例——

技术分享

最酷网的H5页面

付费情况——

免费版:功能没有限制

增值版:能去除广告尾页、加载LOGO,购买网站流量

上面H5页面制作工具的排行依据是百度搜索热度,数据比较公开透明,具体通过结合百度指数和各个品牌词在百度的日均检索量得出。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持网管之家。


本文出自 “RichyLu____记录” 博客,请务必保留此出处http://richylu.blog.51cto.com/1481674/1893327

以上是关于10个H5页面制作工具的主要内容,如果未能解决你的问题,请参考以下文章

用h5页面制作工具制作的东西怎么得到源代码

微信H5页面制作流程?

国内几款比较好用的html5页面制作工具都有哪些?

微信h5页面有哪几种制作方法?

全景梦境般的H5如何制作

如何制作关于测试的H5页面