H5 是什么？
前一段时间很火的 吴亦凡入伍的广告你看静态新闻的时候，是在加载后面两个视频，加载完成之后，吴亦凡就蹦出来了所以你们看到吴亦凡从画面里面出来的时候脑海里的台词是：卧槽，这是怎么做到的！而我的内心台词是：卧槽，我知道是怎么做到的，你把流量还给我好么！================================更新一张之前和甲方之间的聊天记录，在整个minisite已经交付上线以后，甲方突然问了这么一句，大家感受一下。这就是为什么我很反感别人跟我说H5，我特么知道你到底什么意思。。。这就是为什么我很反感别人跟我说H5，我特么知道你到底什么意思。。。===================================================先科普一下，HTML5并不是一项技术，而是一个标准。标准的意思就是：学生准则手册。你可以按照准则做，甚至可以超出准则更加严格的要求自己，也可以不按照准则来，但是会被老师训斥小伙伴讨厌，别人都不找你玩，就像IE6一样。那HTML5这些标准浏览器厂商到底姿持不姿持呢？这要看他们各自的尿性了。像chrome这种不仅在很多标准上支持的非常好，还积极上进很多地方超出了标准，支持一些标准中还是草案的部分。所以其实要么我们是作为理论派讨论HTML5标准，要么是作为实践派讨论HTML5标准在某浏览器的应用。但是实际上我们在说到H5的时候，并不是指标准，也不是指标准的应用，而是一个硬生生造出来的奇怪概念合集，所以我是旗帜鲜明的反对这个称呼的。最近一年的时间，我主要靠这个东西养家（并没有家）糊口。所以我是懂得甲方打电话过来询问，“你是不是会做H5开发？”的时候，我知道他们要的是那种可以在朋友圈分享的，看起来很酷炫的小页面，他们实际要的东西拆开来看大概包括以下技术点;1. 页面素材预加载技术，可以使用createJS之中的preloadJS。我没有看preloadJS的源码，不过预加载并不是HTML5标准中更新的方法。2. 音乐加载播放技术，createJS中同样有soundJS可以实现，而且这部分说起来确实是HTML5标准支持的内容，在上个时代并没有audio这样的标签。3.可以滑动的页面，大多数是用了swiper.js这个Jquery插件，也有一些是手写的swipe，比较拙劣的手写版页面是不会跟手滑动的，其中touchstart等四个touch系列的事件是HTML5标准中的事件4.可以涂抹擦除，多半是canvas叠加层，canvas是HTML5标准里面的标签，是代表了先进生产力的标签。5.有动态的文字和图片，常见的是使用了css3或者直接使用js动画。很多时候提到HTML5多半还会带上CSS3，而CSS的分级又是另外的一个问题了，在不同的项目标准上，CSS会独立定级，以后应该不会有CSS4这个东西，所以大家也不用担心在H5以后又冒出来了C4（不过真是想用C4炸死那些每天把H5挂在嘴上的人）6.可以填表报名，这是最基本的表单，是有网页以来就有的东西。7.可以支持分享自定义的文案和图片，这个是用到了微信的jssdk，和HTML标准半毛钱关系都没有。8.还有其他我想起来再补充的。所以我们在谈论H5的时候，实际上是一个解决方案，一个看起来酷炫的移动端onepage网站的解决方案。而这个解决方案不仅包含了HTML5新增的audio标签，canvas，拖拽特性，本地存储，websocket通信，同时也包括了盒模型，包括绝对定位，包括一切前端的基本知识。有学弟来问我说，学长我想学H5，应该从哪里开始？我说HTML5新增特性在W3C上都可以查得到的。学弟说，不，我想学的是H5，想做H5的页面。于是我猜测他所指的就是上面论述的这种酷炫小页面，我就说，那你要先学习HTML，包括HTML5的新标准和之前的全部标准，然后学CSS以及CSS3，了解它们在浏览器的实现情况，原生JS了解一点就可以，大多的操作可以用Jquery，了解常用的几个Jquery插件的用法，应该就差不多了。如果想要做更酷炫的的，学一下egret或者cocos2d更好。如果要优化加载速度，还要学一下grunt一类的自动化工具。微信的sdk有很多坑，至少nodejs或者php一类的后端语言要会一点。学弟说，那这不就是前端了么？我只是想学H5啊。所以你看，当我们对一个概念的内涵无法统一的时候，我们根本不知道彼此之间在谈论的是什么。”H5“本应是一个技术合集，却被意会成了一项技术，变成可以在质上而不是量上描述的概念。对于营销来说，我们只要讲我们可以做H5或者不能做，这种定性的描述就够了。但是对于技术上，这是定量的事情，只能在具体某个技术项上是否，无法对这个本不存在的概念说是否。就比如我遇到过有甲方说，我们之前找了一个人做H5，做的还不错，但是这个case他又说做不了，我也搞不懂H5和H5之间也有那么大差别吗？我只能笑笑和他说，世界这么大，各种各样的H5都是有的。这就是为什么我反对H5，因为这个名词和它表示的内涵是严重不符的，这让我们难以沟通，让营销人和技术人之间产生误解，让浑水摸鱼的培训师们赚的盆满钵满，让技术新人不踏踏实实的学习技术。每当有人问我，”你是不是做H5的？“我的内心都很想咆哮一句，”你才是做H5的，你全家都是做H5的“
不应该是这个东西么。。
╮(╯▽╰)╭哎。。。
H5是一种用在微信上的PPT。
注意注意： H5 != HTML5H5 是一个产品名词HTML5 是一个技术名词对于知乎多个相关问题里批判H5的叫法，我只想说：图样图森破，上台拿衣服打个比方，如果有个人跟你说：“我要做个网站，H5的”。那TA是想让你用header、footer、nav、section等标签？让你用Geolocation、localStorage、Web Worker等API？都不是，TA们想要的功能你用HTML4就都能做出来了。更别说还得兼容老IE浏览器呢。所以年轻人，你们要用心理解客户的需求，不要沉迷于技术。人家一定不是让你去用一种不被所有浏览器兼容的技术。所以，H5指的不是HTML5，而是某种在微信等移动端看上去酷炫能够提升公司格调顺便亮瞎访问者氪金狗眼顿升膜拜之心就算没有内容也能被广泛转发分享的一种东西。------PS: 上面回答偏玩笑，感谢各位赞同。在此再从另一个角度分析下为什么技术人员也这么说：为什么大家喜欢说H5而不是HTML5？去一场技术会议，或者自己做一个相关演讲就知道了。不讲缩写嘴会抽筋的。
欢迎关注微信公众号“老猫观”H5到底是什么？你的H5技能树点歪了吗？求不被喷，我从营销人员角度去解释H5，技术大神可以无视我虽然现在互联网圈开口闭口就谈H5，前段时间去了一个昆明本地的一个读书沙龙，和大家聊天的时候很自然的就和大家谈到了H5？ 然后就有人问我H5到底是什么？我一下子也懵了，不知道该怎么向他们解释。说是HTML第五代标准么？这种解释太性冷淡了吧！而且和我要说的内容也不符合。然后我想“微场景”这个词会不会准确一些呢？这样的词说出来其他人就更不知所云了。我当时只能给他们解释，你们还记得在朋友圈里那些打开后的动态页面吧？那就用H5技术实现的，所以简称H5了。我就想了一下，我们平时在工作中微信里跳转的链接大概分为两类：一种我们会叫它web页面，虽然也是用H5写的；另一种我们才会把它叫做H5。实在是水平不够，没找到合适的文字进行描述，所以直接上图大家感受一下吧！我也给不了大家对于H5的明确定义，既然定义下不了，那么就用举例法来搞定这个事情吧！也算是给大家科普和整理下现有的H5形式啦！初阶：幻灯片玩法实现难度：★开发周期：1-2天用户参与指数：★分享指数：★所需资源：一枚活动策划，一枚设计师，第三方H5制作工具（易企秀、MAKA等等等）H5的初阶形式就是幻灯片，基本上就是把PPT移到了手机上来。有很多的第三方制作工具都能够完成这个工作，百度一下全都有。PPT移到手机屏幕上会发生什么呢？和PPT行业一样的，全靠制作者的设计感。高逼格性冷淡的有，无所畏惧弹弹弹的也有，满屏文字不考虑用户体验的也有。不管怎样，H5行业点亮了“视觉设计”的技能树。对于企业来说，利用这种H5去迎合热点。因为制作成本低，能够做到快速反应。如果有清晰的策划，熟练的设计师从设计到制作完成，差不多一天时间就能搞定。但是因为只是像PPT一样去简单叙事，用户的参与感极低，带来的转发量和转化率也相对较低。进阶：交互式H5实现难度：★★开发周期：2-3day用户参与指数：★★分享指数：★★所需资源：一枚H5策划；一枚视觉设计师；一枚交互设计师；一枚前端工程师；一台服务器进阶第一级，在大家对H5的不断尝试过程中，一些公司率先将丰富的交互效果加入到了H5页面中，点亮了“交互设计”的技能树。H5页面不再是呆板的一页一页切换了，不再需要你去等待一个个特效加载完。用户体验开始进入H5页面的设计过程中。因为对用户体验的挖掘和交互效果的实现，H5从体验上开始让用户有了参与感，因为参与感的提升，用户的分享指数也带来了进一步提升。最典型的一个例子就是神州专车的“史上最长加班夜！”测试/答题类，提交表单H5实现难度：★★开发周期：2-3天用户参与指数：★★用户分析指数：★★所需资源：一枚H5策划；一枚视觉设计师；一枚前端工程师；一枚后端工程师；服务器进阶第一级，除了交互设计方向，有人想到了是不是该点亮“数据库”技能树了。所以我们愉快的添加了一枚后端工程师，开始搭建测试类和答题类的H5。可能有人会疑惑小测试什么的不是前端工程师就能搞定了么？原因是这样的，从企业对获取用户数据的欲望是与生俱来的，你以为你做测试的时候真的只是做测试么？当你填下你的选择之后，你提交的数据开始输入企业的数据处理中心，分析你的喜好、分析你的需求、分析你的消费水平、分析你的消费态度，确定你是不是目标受众。所以点亮“数据库”技能树之后，你会发现H5变得更聪明了，当然企业也能收集到用户的更多数据了。而且这个时候，我们就可以实现报名等等表单收集的功能了，有种连上世界的感觉了呢！动态小游戏开发难度：★★★★开发周期：1-2个周用户参与指数：★★★★用户分享指数：★★★★所需资源：一枚H5策划；一枚视觉设计师；一枚交互设计师；一枚游戏开发工程师；一枚后端工程师；一颗游戏引擎；服务器在点亮“交互设计”和“数据库”的技能树之后，H5得到了快速的发展，这时候黑科技“游戏引擎”被点亮了。标志性事件就是火到没有朋友的“围住神经猫 ”。一个简单的小游戏带来的传播效果实在是惊人，也让大家看到了H5游戏的火热前景，很多公司前赴后继投入了H5游戏的开发。但是由于H5游戏的开发成本较高，很多小公司可望而不可及，这个时候一些微信营销工具开始进入这个市场。在很多的微信营销工具上也出现了很多可以修改的游戏模板，但是这些游戏重复率太高，仅仅是简单的修改了一个UI，最后导致用户视觉疲劳，已经激发不起用户的参与感了。动态小游戏要激起用户的热情已经没有那么简单了；需要策划、创意、设计、游戏制作以及激励手段的紧密配合。功能型H5开发难度：★★★开发周期： 1-2周用户参与指数： ★★★★用户分享指数： ★★★所需资源： 一枚H5策划；一枚视觉设计师；一枚交互设计师；一枚前端工程师；一枚后端工程师；一台服务器；在还有一个从H5诞生就被赋予极大想象空间的技能树，“H5轻应用”的技能树也开始被点亮。在微信还没有撑起H5这个市场的时候，“轻应用”这个概念就被广泛提及，百度还有一些浏览器厂商都想建立起来相关的生态链，但是都不算成功。对于用户来说：功能性的H5能提供一些使用频次较高的功能，免除下载App的麻烦，比如查快递、房间预订等功能。对于企业来说，需要将功能型的H5当作一个产品来对待，不断的迭代，满足用户需求。上面提到的只是常见的一些H5的形式，在H5这个大树上，还有更多的技能等待被点亮；在做H5的时候可以根据不同的需求选择不同的技能叠加，会给你的H5带来意想象不到的buff加持。关注“老猫观”，从产品角度去分享小知识，希望有更多新收获。
刚写的文章，或许能解答一二什么是HTML？通俗易懂版：HTML就是你跟浏览器下达命令的语言。比如要把一篇文章显示在浏览器上，文章既有图片又有文字，你要告诉它哪些是文字，哪些是图片，并且分别都放在哪个地方，需要用什么样式（颜色、大小、对齐……），我们把浏览器显示的页面叫做网页。举个例子，要让下面这个简单的文字+图片显示在浏览器上：翻译成浏览器懂的语言就是：&title style=”text-align:center”&
最简洁易懂的“H5”技术科普
&title&&img src=”/img/h5教学” /&如果HTML是中国人发明的，那么表达方式就是：&标题 格式=”文字对齐:居中”&
最简洁易懂的“H5”技术科普
&标题&&图片 图片地址=”/img/h5教学” /&专业装逼版：HTML（HyperText Mark-up Language）即超文本标记语言或超文本链接标示语言，是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。什么是HTML5？HTML5是HTML的第五个版本，上一个版本是HTML4，于1997年发布。HTML5本质上不是什么新的技术，但是由于其在功能特性上有了极大的丰富，在加上各大浏览器性能上的支持，HTML5相对以前的HTML4有着更广泛的应用。HTML5主要的新特性：语义特性（Class：Semantic）HTML5赋予网页更好的意义和结构。简单来说就是程序猿更方便跟浏览器沟通。本地存储特性（Class: OFFLINE & STORAGE）基于HTML5开发的网页APP拥有更短的启动时间，更快的联网速度，因为可以将一些常用、不常更新的内容存储在本地。设备兼容特性 (Class: DEVICE ACCESS)HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以直接与浏览器内部的数据直接相连，例如视频影音可直接与microphones及摄像头相联。连接特性（Class: CONNECTIVITY）HTML5拥有更有效的服务器推送技术，Server-SentEvent和WebSockets就是其中的两个特性，这两个特性能够帮助实现服务器将数据“推送”到客户端的功能。更有效的连接工作效率，可以实现基于页面的实时聊天，更快速的网页游戏体验，更优化的在线交流。网页多媒体特性(Class: MULTIMEDIA)支持网页端的Audio、Video等多媒体功能。三维、图形及特效特性（Class: 3D, Graphics & Effects）基于SVG、Canvas、WebGL及CSS3的3D功能，视觉效果将大大增强，在线3D网游就是最典型的例子。性能与集成特性（Class: Performance & Integration）HTML5会通过XMLHttpRequest2等技术，帮助Web应用和网站在多样化的环境中更快速的工作。最直观的就是加载会更快。CSS3特性(Class: CSS3)如果把网页比喻成舞台，文字图片视频这些比喻成演员，那么CSS3就是化妆师和舞美，它控制着网页所有元素的视觉和动作效果。相对于旧的CSS版本，HTML5所支持的CSS3中提供了更多的风格和更强的效果，也提供了更高的灵活性和控制性。基于以上的功能特性，HTML5将有着极大的想象空间，最典型的应用前景是谷歌的浏览器OS概念——既浏览器取代操作系统，所有软件、APP都运行在云端，用户通过浏览器获取软件服务；在此假设下，Chrome浏览器相当于Windows操作系统，电脑软件（比如Office、Photoshop等等）界面就是Chrome上不同网址的一个个新建窗口，而软件操作界面就是HTML5网页。技术科普到此，有意了解更多HTML知识的同学，可以看一下Julie Meloni的《HTML与CSS入门经典》。下面讲讲商业应用。H5又是什么鬼？HyperText Mark-up Language 5.0
→ HTML5 → H5当然，HTML5是英文规范简称，但H5就完全是国内特定人群的叫法。目前的事实是，H5已经成为微信HTML5网页的专有名词。以现在的定义，H5特指基于HTML5技术的交互网页应用，以商业用途为主。以下列举一些H5商业应用场景，供参考：1、微信H5目前HTML5应用最多的形式，因为移动端完全不支持Flash，而HTML5在动画展现和交互上基本可以满足企业需求，同时也因为微信的大力支持，HTML5网页作为一种营销的形式被广泛应用，营销圈简称H5。案例：H5动画（品牌/产品推广）Uber卡通优惠码微官网中贸广场小游戏CCTV创意答题游戏H5弹幕港囧吐槽大会节日贺卡中秋贺卡……2、交互视频HTML5对于多媒体的支持，让丰富的视频应用成为可能。iH5的交互视频技术可以将视频、动画、多屏通信等有机结合，极大地丰富了内容的表达方式。案例：3、户外大屏交互解决方案传统的户外大屏交互需要复杂的软件实施，不仅成本极高，并且灵活度低。基于HTML5技术，不需软件实施，内容更新方便快捷。iH5的智墙技术提供了户外大屏交互的解决方案，支持多屏拼接和多点触摸。案例：4、PC HTML5广告即苹果浏览器不支持Flash之后，谷歌浏览器已在2015年9月不再支持Flash自动播放，在可预见的未来，HTML5将取代Flash作为网页动画广告的首选。案例：
H5 是中国人制造的一个专有名词，是一种用来替代 Adobe Flash，实现与之相同或相似网页特效的产品。换句话说，只要可以让不支持 Flash 的 iPhone 显示类似 Flash 的效果，我才不管你用什么办法实现的。因此，所谓 H5 产品可以不要求使用 HTML5 语法（尽管这个词源出于此），只是使用浏览器可以兼容的 JS 特效或者一部分 CSS3 效果就可以。甚至可以在带宽足够的情况下直接用占满网页的视频顶上。换做几年前的我，还会认为 H5 是国内对 HTML5 的缩略，就像 Starbucks 被日本人简称为“四大巴”或者国内称呼“苹果6”或者“肾6”一样。然而现在我已经不这么认为了。上面几个例子的简称和原来全称所指的是同一个产品，而 H5 这个概念早就不指代 HTML5 了。推算起来，这个概念的缘起可能就是 iPhone 的出现。当时包括我们自己在内的 IT 新闻民工，概括性的说 iPhone 不支持 Flash ，打算推广 HTML5 技术取而代之。这属于我们自己的误解，对读者也造成了深深的误导。然而，不管乔大爷怎么想，人们对 Flash 这种省带宽又华丽丽的网页特效的需求，是一种刚性需求。所以还是我上面那句话：不管困难有多少，只要效果最后一样就行，我才不管你是怎么实现的。幸亏中国人做成了，否则库克说不准会把 Flash 请回 iOS。今年春节前，我跟着百度去了一趟旧金山，百度把苹果原来二当家的沃兹尼亚克请来跟大家交流。台下是一堆国内记者，包括纸媒跑财经科技口儿的。某位女士就问到：如今 H5 已经成为各大厂商的趋势，你们认为它能否取代原生应用商店？本来这位女士指的严格来说应该是 WebApps，翻译不懂 WebApps 也不懂 Native Apps 也不懂 HTML5，直接给翻译成了“H Five”。我在传说中的互联网博物馆三楼的会议室里旁听，感觉死的心都有了。结果翻译翻成了 HTML5，沃兹对这个问题感到一头雾水，只说App Store模式很成功。
为何不要用「h5」这个简称？（以下内容转载自 @JS小组 微信公众号。）最近发现好多人喜欢将 HTML5 说成 h5，甚至是代指移动端的 Web Page 或者 Web App。虽然说起来朗朗上口，但是小编真的不建议这样来使用。小编很早之前做过一个关于「h5 这个说法你的感受」的调查，总共有 552 位粉丝参与，最终结果是：有 16.7% 的人认为「很好」，37.5% 的认为「无所谓」，有 45.8% 的人认为「不喜欢」。那究竟为什么会有那么多人不喜欢「h5」这个简称呢？「h5」这个简称非常不专业，容易造成误导。与 JavaScript 被简称为「JS」不同，据小编了解到的情况，h5 这个说法目前只在中国大陆地区的工程师中使用，台湾、印度和美国等地区并没有这个简称，会造成国内外技术说法和写法的不一致。而更重要的一点是，JS 是一个指代清晰的简称，没有歧义，就指 JavaScript 这种程序语言。但 h5 却不是，至少 HTML 中还有个 h5 标签。有次坐北京地铁 13 号线，前面两个小伙子聊技术，一个小伙子问「是要先学 h5，还是先学 JS」。了解这些技术的人，应该都是会心一笑吧。这就是技术误导，不知道从何时起，HTML5 这个 Web 技术中的一个标准，被包装成「无所不能的 h5」，吸引了一大批人来关注，甚至包装成 h5 生态圈、h5 产业。投资人当然也不懂得技术细节，但却大笔投钱进来，媒体当然更是不懂技术方案，不过大肆报道着这个产业。当然，关于 HTML5 和 Web 的技术误导仅仅是其中一个方面。让人担忧的是，鼓吹者们并没有对初级技术人员宣传清楚究竟什么是 Web，什么是 HTML5，什么是 JavaScript。如果你身边有人整天说着 h5，就可以问问他，究竟什么是 h5，什么是 HTML5，什么是 Web，什么是 Web App，这些有什么联系？HTML5 与浏览器什么关系，HTML5 与 HTML 什么关系，HTML5 与 JavaScript 什么关系，HTML5 和 CSS 什么关系？关于 h5 业内还有很多误导，最常见的就是见到移动端的 Web Page 或者 Web App 就说是「h5 页面」。还记得某知名互联网公司的高管在一档求职类节目中说，资深 Web 前端工程师主要是写 Java。当然，当前业内专业的 Web 前端工程师是不写 Java 的，但对于那些不专业的人，就是一次技术误导。当你指着一个朋友圈中有点特效、有点背景音乐的营销 Web 页面就说成 h5 页面时，一个专业的前端工程师感受到的就是类似的不专业，而非专业的人听到以后呢？就这样被误导了，他也以为这是所谓的 h5 技术。让我不禁想起业内经典的问题，Java 与 JavaScript 是什么关系？很多人不懂装懂的解释说有很大关系的，实际上是，雷锋与雷锋塔的关系。当时网景公司（Netscape）为了更好的传播 JavaScript，借用了那时就已经比较流行的 Java 语言的名字。很多人说，并不在意这些说法，无所谓。但是作为一位自认为专业的工程师，我无法同意这种做法。希望技术界同仁们，各位专业的工程师们能够尽量杜绝「h5」这个简称，至少做到无愧于你的专业性。看到一个移动端的 Web 产品或者 Web App，当你不了解其中的技术实现，比如不清楚是用 Canvas、SVG 还是 CSS3 等实现，或者其他技术细节时，称之为「Web App」或者更精确的称谓 ，而不是那个模糊的、不准确的、具有误导性的「h5 页面」。假如有一天，Web 技术真的全都被称为 h5，希望 Java 8 还能是那个 Java 8。不知道这个建议是不是我的无病呻吟，但是至少是一个工程师的一点内心想法，如果有不赞同的，也请留言给我们，写出你的理由，非常感谢。如果赞同我们，希望你能够转发，让更多业内人看到，衷心感谢！—————————补充资料：早期做过对于「h5」这个缩写感受的投票，数据的查看地址是 题图为《星际穿越》中的一个镜头，工程师库珀独自出发，前往那个适宜人类居住的星球。—————————精彩评论：@飞行家_jo： 做技术的第一要紧的不就是专业和严谨吗？h5这种叫法很容易混淆，连这都不在乎的人，我真怀疑他用什么态度来写代码做页面。@i_小休：越是专业的人越谦逊，反而不懂的人却认为一切都很简单，呵呵。@优秀网页设计：最早听到 H5，是从一些营销推广人员那里知道的，问我有没有会做 H5 页面的朋友，一个页面 2000 元。当时还一愣，什么是 H5。其实也很反感把 HTML5 叫成 H5，因为完全木有考虑过标签 H5 的感受。另外也正像 HTML5 达人说的，现在这些说 H5 页面的人，写出来的哪里是什么 HTML5，充其量就是在头部写了个 &!DOCTYPE HTML& 。—————————「JS小组」是一个非商业组织，由多个公司资深 JavaScript 工程师维护，专注 Web 及相关及周边技术。欢迎大家关注我们的微博账号 @JS小组，或者微信公众号。end
how to make love 555
H5是一种对HTML 5进行技术商业化、在非英语环境人群中迅速传播的概念改造。这种改造为的不是知识的普及，而是带有低门槛属性的商业扩散。xx为什么厉害？用了Html5呀……xx为什么厉害？用了Hgai5呀……xx为什么厉害？用了Hmlt5呀……xx为什么厉害？用了Mlht5呀……xx为什么厉害？用了Html4呀……哈哈你说错了吧……没事我说的是CL…虽然只有四个字母外加一个数字，你能想像在传播中能出现多少版本吗？何况，有了传播门槛之后就会被拒绝传播。HTML5化身为H5的时候，角色意义已经与它在那些知道缩写全称、或能把它拼全的人群中不一样了。我记得刚出iPhone4的时候，有朋友说要买个iHope 4，被笑话了。没有多久，苹果4与肾4就成为了iPhone的别称，在口口相传中一路蔓延过去，轰然间便燃烧成了天际的彩霞。存在，即合理。存在，即何以。存在，既可以。
已有帐号？
无法登录？
社交帐号登录现在市面上的这么多的h5交互设计软件，到底有什么差异？
按时间排序
近月来我也在研究一些制作H5交互的网站，这是我个人的一些体验分享给你：Epub360（）Epub360打造了一款专属于设计师的交互设计平台，操作简洁明了而又富有逻辑性。该软件提供了出色的动画效果，还支持路径动画、序列帧动画更有组合动画、动画组管理、动画时序管理等强大功能，就看设计师的脑洞有多大了。另外，该平台提供高度自由的交互设计还有可以利用微信高级接口设计互动级的H5 ，还有一些特色功能例如：高级表单、长按播放视频、svg变形动画等。IH5（）IH5的用户定位也是专业级设计师，虽在使用上稍稍复杂点，用户引导做的不是很完善所以入门需要花费点时间。但是其功能强大，其最具特色的要数多屏互动了，实现也很简单。该软件还提供了海量的模板、丰富的交互样式，用户可以直接编辑内容，自由度高、速成。木疙瘩（）木疙瘩是一款集设计、编码一体化的开发工具，主要偏向于解决移动互联网不支持传统动画开发工具Flash这一问题；Flash设计师上手较快，该平台除了提供Flash拥有的功能外，还在其基础上进行了功能完善。但有些功能的实现，需要设计师与程序员的密切配合，未能保证零代码操作。
各位的评价都很赞，个人觉得VXPLO是灵活度较高的，实现的效果也多多的，还可以做很多牛逼的小游戏。例如： 说到区别，有一个比较干货的文章，是讨论HTML5制作工具怎么做屏幕自适应的，不同工具方法不同吧。大家可以去围观一下哦~~
作为去年三月就被特斯拉翻页案例惊呆了然后立刻一周内花1万大洋找技术团队给某500强客户做了一个同样在当时看起来很屌但并没有卵用的翻页介绍之后又停不下来用了十几款H5免费软件的4A公司苦逼AE！看到这个题目还是决定在国庆节的最后一天回答一下目前我所知道的H5设计软件大致可以分成两类，专业工具类和简易模板类。专业工具类：VXPLO（貌似改版为iH5了）, Epub360, Google Web Designer , Adobe Edge , Hype简易模板类：Maka , 易企秀，初页，兔展，易传单，品趣，点点客，秀制作，微杂志，云来，最酷轻应用，营销云，70度，Bluemp……不过虽然软件很多，但国内专业类只有VXPLO和Epub比较靠谱，谷歌 Adobe Hype那些因为不适合中国国情根本用不了，而模板类同质化严重，基本上用一两个就够了。模板类的选择很简单，因为基本都是简易自定义动画（类似简单PPT效果），加上用户作品模板化。而自定义功能在这个层次的软件基本没有任何区别，唯一选择的依据就是模板多不多，用户体验好不好。以本人阅软件无数的经验，用maka和易企秀就够了，前者用户体验好些，易企秀广告有点丑，不过模板多一些。VXPLO和Epub的对比要有意思一些，都是国产良心之作，但软件的设计完全是不同风格，以下仅从个人使用角度分析一下优劣：1、动画交互VXPLO以“时间轴+轨迹”的方式组织动画，页面上每个动画元素对应一个轨迹，多个元素的轨迹可对应同一时间轴。通俗来讲就是，你用快播看电影，里面的演员各自都在行动，但是你可以通过播放进度条控制他们的状态，这里的播放进度条就是时间轴，表演的演员就是动态元素。也可以用多个时间轴来控制多个轨迹，这样各个元素的动作就是异步的。Epub用的是PPT模式，通过动效组合及排列的方式组织动画，表达方式类似：A 动1→B 动1→C 动2→A 动3→C 动3→结束。两种方式有利有弊。Epub模仿PPT的模式对一般人而言要更容易上手，但是对于稍微复杂的动画就有点效率低下，因为你要计算每个元素的动效相对上一个动效的时间差，这种方式在动画元素较多且动效组合复杂的情况下会比较晕，如果比喻成导演就是，100个群众演员，你每一个演员说完一句话都得告诉其他演员接下来要在什么时间后做什么，而且某个演员在时间上差错可能会对整体有很大的影响。VXPLO的处理方式比较特别，感觉上是一种抽象思维，相当于把元素的动效抽象成一个个轨迹，再把轨迹统一由时间轴管理，好处就是效率很高，坏处就是学习成本高一些。还是用导演的例子，100个演员，每个人都有一个剧本，他们只要按照剧本要求的时间点和相应的台词动作执行，每个演员的表演相互独立，但通过时间轴建立协同。这种模式只要想清楚剧本，后期调整方便，并且可以单个元素调整而不影响整体。当然，这种思维方式需要一定时间才能掌握。2、数据库应用如果你的H5涉及评论、表单收集、微信登陆、排名这些功能，都属于数据库应用的范畴，这也是专业类软件区分模板类的重要功能之一。VXPLO灵活度较高，所有字段以及表单的样式都由用户自己定义，模式是用户建立一个包含所需字段的空数据表单（可以认为是一个第一行是姓名 手机 邮箱 的excel），然后在页面画几个输入框，把各个输入框和表单的某一个字段（比如姓名）绑定一起，用户输入的信息会自动添加到对应的表单的列和行。表单可以排序和读取，于是实现评论、排名和登陆判断的功能。Epub则要更容易操作一些，但自由度较低，所有评论、表单功能都是组件化的，添加评论和表单组件是整体添加，用户在提供的组件基础上修改。这种方式的好处是比较省事，坏处就是只能用固定的样式，字段和评论数量有一定限制，登陆判断暂时还没有组件支持。（好久没登知乎，看在还有人点赞份上，再补充一些吧）3、易用性和效率其实所谓的易用性也是相对的，所谓“用”首先还是要满足需求，如果你的需求就是做一个方便展示信息和收集报名的邀请函，可能易企秀就够了，当然，像iH5这种较高级的工具也能做，但区别就是，很多时候你会用画图工具调整图片尺寸而不是PS。不过只要你的需求稍微需要一些交互和逻辑，可能maka、易企秀就变得很烦人了，处处都是限制。具体到epub和iH5，两者还是差异挺大的，我的感觉就是epub其实介于 易企秀和iH5之间，形象点而言就是带交互的PPT，具体实现逻辑参考第1点动画交互的描述，总之给人感觉就是还行，不过可能因为基于PPT逻辑的关系，所以感觉很多复杂交互的东西还是实现不了。iH5近似编程思维，感觉产品经理应该也是计算机出身，对类和继承的体现还是很明显的（好吧，如果你没学过计算机就忽略吧），能把编代码的工作可视化到这种程度，说实话个人还是比较佩服的，虽然还是比较复杂，但一般逻辑比较好的人还是很容易学会，好处就是一旦掌握了 基本什么效果都能做出来，而且iH5把所有元素的动画的对象化处理也对制作效率有比较大的帮助，可以很方便的在不同案例之间复制。说句题外话，个人感觉这类工具市场还是非常大的，它其实是把编程平民化了。举个例子，几十年前可能做一张图片都要程序员编代码实现，但后来PS之类的工具出现了，普通人也能做很漂亮的图片，记得中学刚接触PS的时候也是觉得挺兴奋的。 现在其实iH5这种工具就是把 做网页的这种原本要编代码实现的事情平民化了，区别就是 会用PS的人比会编代码的人要多得多得多，以后做网页就跟做一张图片那样简单。 说实话，本来程序逻辑能解决的事就应该是能被机器替代的，个人觉得程序员迟早都是要失业的跟iH5比较类似的主要是国外的软件，Adobe Animate CC、谷歌 Web designer ，还有苹果员工出来创业的Hype，其中Hype个人觉得是做的最好的，功能齐全，体验佳，不过就是离线的不太方便。有兴趣可以试试
现在H5创作工具太多了，同质化严重，谁能真正做到即简单，又不失专业性或者说叫灵活性，有图是款不错的工具（)，他是由照片书制作类的图文排版工具延伸到H5的生成，所以，图片处理以及文字排版功能相对较强，也是国内唯一一款桌面软件（离线的），所以大图片和本地视频的导入和发布都比较方便，至少服务商不见了，原创的作品内容还在，有可能的，这么多同质化H5的，过不了多久会死掉一批，赚不到钱自然要消失，有图最大的弊端就是免费版只能保留3天，需要长期保留是收费的，10个币/页，不过对于有刚需的用户来讲，费用很低，可以忽略不计。有图不但可以创作H5，还能设计和印刷一本起订的画册等，对于创作需求的人来讲，还可以小满足一下个人的需求。
在网上看到谈来谈去的都是这几款，其实也有一些实用 的功能强大又容易上手的H5动画工具。像有图、木疙瘩这些，它们在营销推广上投入不大，所以名气相对较小，但是在体验和功能上并不逊色。 有兴趣的朋友请自行去试用，花费不了多少时间成本。1. 有图
很 容易上手的H5页面制作工具，完全不需要编程基础；我比较喜欢的是它除了在线版本外还有离线版本，可以在本地编辑完成后再上传发布，对于担心网络状况的朋友其实是福音。整体的动画制作思路和PPT动画很接近，容易上手，培训成本低，基本上30分钟就可以让新手来试做了。报名表单、一键拨打电话等常见功能也都模块化，傻瓜实现，不需要懂编程。2. 木疙瘩
相比于互动大师，其实我觉得mugeda给我的感觉更接近于flash。总体来说两者有相似也有不同，不过都是属于学习成本相对较高的，有一定的flash动画制作经验的用户更容易上手。抱着分享的态度，不是打广告，也不是和谁争论孰优孰劣；欢迎探讨，共同找到更好用的工具。
补充一下一楼，VXPLO和EPUB使用上的一些区别。声明：因为这两个工具都是在线平台，会随时更新功能，以下对比仅限于此此时此刻使用范围：VX在同作品里可以设置支持多种屏幕设备，通过简单修改就能同时支持移动端的竖屏和桌面横屏。EPUB主要支持移动设备，另有COOLSITE以供制作自适应屏幕的项目。视觉设计和排版操作：EPUB比较人性化，编辑状态默认以50%面积显示画布，有辅助对齐指示线和贴合功能，便于快速组合设计元素。VX有辅助线，但无法精确定位，比较鸡肋，这对一个严谨的设计师来说，真的很折磨。另外很想问一下VX的开发者，满大街的显示器都是1080，满大街的笔记本都是768分辨率，默认画布都无法全屏显示，你们是想拒绝这部分用户吗？对象管理：VX有强大的对象树，一切对象包括分页、素材、事件、动画统统囊括，而且可以直接复制剪切粘贴对象（包括事件），便于统筹管理，但制作大项目的时候必须要有好的命名习惯，否则容易眼晕。EPUB则把各个对象分配到不同的面板，依据视觉元素》动画》事件的顺序排列，也比较合理，但是做小项目时几个面板绕来绕去也是比较麻烦。动画效果：VX预置了时间轴、运动、缓动、动效等几种组件，其中动效里有几十个预设动画可选；用时间轴可以做细致的动画，另外还可以用视距参数做强大的三维动画，小白不详细学习的话估计会眼晕。而EPUB的动效集中在元素属性面板上添加，还有N个看得眼晕的加速度选项，可以在动画面板里统一管理，参数化操作，胜在快捷。页面过度动效：EPUB集合了几种常用的页面过度效果，包括较炫的三维翻转。而VX那些强大的动效不能用在页面对象上，过渡效果只是一些加速度变化，聊胜于无。特色组件：两家都在不定期的更新上线新组件。EPUB有地图导航（接入腾讯地图）路径动画，刚又上线了SVG动画。VX则有横幅、视频交互控制、多屏互动、、外围设计(如作品管理分享)：VX比较简单明了，没什么限制。EPUB比较冗余，且限制较多，但胜在有用户自定义素材库。总的来说，EPUB全部模块化参数化，适合小白快速出活。而VX更像是EPUB的底层，适合大拿深度研究。不过，具体项目上还得依据需求取舍。
易企秀先讲最流行的，这个算是门槛最低的了，甚至于比PPT还要简单，操作简单，但是实际制作的内容没办法发挥出H5的最大效果，只能当幻灯片用。如果说题主的“交互设计”是指制作者的交互设计，那我这个答案里提到的都符合这个条件，但若是指“用户的交互”，易企秀也就到此为止了。VxploVxplo不是很好用，不是说他不好，而是不好上手，什么帧之类的算的太细反而吓跑了我等小白众。第一次接触看到入门教程给的概念立马有种flash的感觉，但是由于功能过于强大，也导致各类模块繁杂，对于H5页面这样一类唯快不破的展示方式，入门成本确实过高了，但是如果投入进去绝对能做出不亚于Flash的惊艳效果。而在体验上来说，在安卓上中端机的体验并不算流畅（魅族MX4）Epub360我是先见到Vxplo再搜到Epub360，Epub360的上手难度中等，也需要付出一定的学习成本，但是入门比Vxplo快很多，我个人认为主要是时间轴控制的方式上的区别。Vxplo是基于帧的，需要用户脑子计算每个动画效果的播放时长和播放时间点，Epub360是基于事件的，用户只需要考虑一个动画效果在哪个事件之后播放就行了因此两家的构思逻辑上Vxplo会多一步转化Vxplo
心里想的动画效果顺序&&&&转化成时间轴，精确到秒&&&&&实际播放效果Epub360
心里想的动画效果顺序&&&&按照效果顺序设置动画效果排序&&&&&实际播放效果由此可见Epub360更贴近直觉思维而制作者的设计交互界面两家完全不是同一个风格Vxplo是PS+Flash的感觉，很专业，但是很多操作只有一个图标，令人不明所以Epub比较简洁，一眼了然Epub比较简洁，一眼了然对于Vxplo与Epub360的总结：两家走的其实不是同一条路，一家小而美，一家大而全，Vxplo甚至能做一些出乎想象的HTML5游戏，但是以我个人对H5的见解，几乎所有对H5互动页面有需求的企业都是利用H5针对一个短期的活动进行预热，因此这些企业的制作成本不高，而且非常快餐，这类H5的展示网页的生命周期大多不超过一个礼拜，这也就导致了即使有Vxplo和Epub360这两家“真互动”H5交互设计工具，市面上流行的仍然是易企秀之流。
评价很中肯，我们努力服务好专业客户的同时也会开发更多地模版让新手也能更快上手，期待关注。
因为老大说要做h5，就没办法百度了一下几款软件，身为设计师的，可以不需要学习代码就制作各种交互的h5效果，一下子逼格就高了。下面我谈谈几个我所使用过的h5编辑软件，可能不够全面，勿喷。vxplo互动大师：灵活度高，可以自定义各种效果，功能强大，效果炫酷，对象的位置精确到像素，适合专业一点的设计师或者是逼格高的人使用。不足是新用户的引导做得还不够好，有点不知道要从哪里开始。看了几段视频之后才摸到点门道。不过工具确实足够强大，花一些时间学习后，什么交互效果都能做；技术做到这样，h5剩下的真的是拼创意了；不过小吐槽就是对设计师来说，少了排版功能，比如我想某个元素想在舞台上居中，客服回答说要自己根据坐标算一下，所以数学差一点的童鞋们暂时就绕路吧。易企秀：简单易用，短时间就能上手，适合做展示，以及邀请函，最后一页是易企秀的尾页，商业做的话不太适合，后期没再使用了，不过貌似说现在可以买秀豆去尾页，具体的价格我不太清楚。但是缺点是自定义程度低，效果单一，做多了几个案例就腻了，统计数据的准确性需要进一步确认，有遗漏数据的现象，maka，秀米等，其实我自己觉得他们跟易企秀都挺像的，不知道这几个产品具体的定位差异是什么。秀米功能对我来说太少了，maka就是网站不是太稳定。暂时就用过这些。还有什么好介绍的？欢迎推荐。
已有帐号？
无法登录？
社交帐号登录