hi，前段时间的寒假计划
大家有没有开始实践呢
还记得有一部分是这样的
看到这里你是不是为H5而伤脑筋了呢
那么请收下接下来的这份干货！
01
什么是H5？
H5是HTML5的简称吗？是微信里会动的、可以分享的网页？还是移动PPT、网页版APP？事实上，H5指的就是移动网页本身，下图中就很清晰的指出了H5的涵盖范围：
02
H5的形式包括哪几类
现在网上H5多种多样、玩法百变，形式则大多数归于画面表现、触摸屏操作、传感器这几类。触摸屏操作的H5包含单屏滚动、手势操作、全景交互及多屏互动等。传感器类形式依靠手机上的传感器实现，包括陀螺仪、GPS、摄像头、麦克风等，实现与手机用户的娱乐互动。有的H5只用其中一类来设计玩法，有的则会将几类组合创造出更丰富多变的表现形式。
03
如何制作H5
在众多的H5制作软件中，小金为同学们挑选了一个较为基础和一个较为高阶的制作软件，同学们可以根据自身的实际需求进行选择。
易企秀
一、在浏览器上搜索易企秀，进入官网注册登录
二、点击创建场景，创造一个新的空白场景
三、可选择直接套用模板中心里的模板或自由制作
在易企秀中H5制作主要有六大部分
一、文本，点击文本即可对文字进行添加编辑
二、图片背景，背景属于图片的一部分，点击图片即可对其样式、动画效果等进行添加修改
三、音乐，音乐可由自己上传或添加外链
四、形状，添加图形、文字、小图标，并可对其样式、动画效果等进行添加修改
五、组件，可添加视频、图集、投票、电话等，并对其样式、动画效果等进行添加修改
六、表单
七、特效，可添加涂抹、砸玻璃等整体特效
最后，点击保存后发布，对H5作品封面、标题、描述等进行设置，一个漂亮的H5就此诞生！
是不是很简单呢？
接下来的这一款就有点难度了，
仔细学习哦！
iH5
工具：iH5(网址ih5.cn)
组件：文本，图片，按钮，变量
关键事件：微信设定标题，微信设定截图，微信设定描述，微信设定页面，提交素材
1
先在舞台下新建两个页面(这是为了能表现设定页面的功能)，再加两个变量。变量分别改名为“头像”、“昵称”，方便待会选中。
(就是这样)
在变量属性里，变量名称一定要填，而且不要填中文。
(这是昵称变量的属性)
(这是头像变量的属性)
然后，我们在第一页加上一个按钮，还有你喜欢的随便什么话。
(这是页面一)
页面一的组成就是这样。事件我们待会儿说。
2
接下来我们来看页面二。
(这是页面二)
显然，页面二的内容比页面一多得多。
我们先在页面二创建一个文本和一个空白图片，并分别改名为“昵称”“头像”。其中昵称文本绑定变量“昵称”。
(文本绑定变量)
页面二主要的素材就是这样，其他的同学们随意加。
3
接下来是事件的设置，我们回到页面一的按钮。按钮下有三个事件，分别是：
(获取微信昵称事件)
(获取微信头像事件)
(跳转下一页事件)
这样，就完成了对用户头像和用户昵称的获取。但有一点很重要：一定要在舞台属性里把“微信登录”选为“YES”。
4
那么，获得了信息，怎么把这些信息加入到H5里分享出去呢？我们来看页面二按钮的几个事件。
(设定微信分享小图事件)
(设定微信分享标题事件)
(设定微信描述事件)
(设定微信分享页面事件)
这里解释一下，“$+变量名”指的是变量的值，当事件启用时，变量的值会自动替代掉这部分。这里的“$nc”指的就是用户昵称。
到这里，标题设置和描述设置就已经完成了。
5
如果你们还记得，前面说到昵称文本绑定变量“昵称”，但头像图片并没有绑定变量“头像”。
那如何设置用户的头像为分享小图呢？我们还需要这样一个事件：
(把头像的资源位置传给变量)
可以看到，我在页面二显示时触发这个事件，把头像的资源位置传给了变量“头像”。因为在设定微信分享小图时，需要输入图片资源位置而非图片，所以要用这样“曲线救国”的方式来实现。
6
最后是设定分享页面。从上面的事件看，非常简单。
但如果只有这样一个事件，那么你就会发现，分享给朋友的页面中，关于你的信息全都“消失”了，朋友打开的只是一个空白页面。
为了要把你的信息留在H5里传递给下一个打开的朋友，我们还需要这样一个事件：
(提交素材事件)
经过提交素材事件，你的头像和昵称就会被暂时地保留在H5里，直到下一位朋友点开，用他的信息取而代之。所以一般情况下，设定页面事件都会和提交素材事件一起使用。
这样看来
H5制作是不是有点方向了
记住上面的内容
快快去制作属于自己style的H5吧！
