H5页面制作入门教程学习课件.ppt
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
精品
场景名称
填写名称 后期可改
填写完毕 点击创建
精品
点击选择 为了自己 管理方便
制作页面
精品
页面模板
在易企秀制作页面的左侧栏， 易企秀官方为大家提供了分 门别类的“页面模板”，在 制作场景的过程中，可以参 考或者直接套用页面模板进 行场景创建。 自己制作的页面，也可以保 存为“我的”模板，以供下 次使用。 企业账号将自己的场景设置 为“企业页面模板”，子账 号可以直接使用。 精品
→背景创建后，点击编辑栏上的背景齿轮，即可对背景 进行编辑。 →背景编辑主要包括：剪切、更换、效果（放大、缩 小）、删除。
精品
Байду номын сангаас
点击“音乐”即可创建【背景音乐】
1.【音乐库】为官方提供的音乐素材 2.【外部链接】插入网络音乐链接 3.【我的音乐】自主上传音乐
精品
点击“视频”后，给场景添加网络视频 点击“什么是视频通用代码”，出现详细操作
精品
很重要 特别重要
“保存”只是对操作进行保存，如果不点击 “发布”此场景未发布的编辑内容，在场景 分享出去时，别人看不到最新编辑的内容。 点击“退出”则推出编辑页面。
精品
点击发布后，可获得场景二维码、场景连接和 更多的一键分享方式。
精品
下载更大的场景二维码 （在“我的推广”里找到二维码，如下图）
H5页面微场景制作 入门教程
入门了，一切都变得很简单！
什么是H5？ 为什么要做H5页面? 什么场合可以用到H5页面? 常用的免费H5制作工具？ 怎么制作H5页面?
什么是H5？
H5是指第5代HTML（超文本标记语言），也指用H5语言制 作的一切数字产品。 通俗地说，H5是一种创建网页的方式。它会让手机网页看 上去更炫酷，功能也更丰富多彩。
右侧的“页面管理”
5大管理操作
1. 复制：点中条框，点击“复制” 2. 我的模板 ：点中条框，点击“我的
复制”，出现在左侧“页面模板”中， 可删除
3. 删除：点中条框，点击“删除” 4. 移动：点中条框，可上下拖动 5. 添加：点击“+”，添加一页
精品
10个基本组件+设置+发布
组件是构成场景的基本要素
精品
表单（也叫信息收集表、报名表、信息反馈表等）是 场景创建者用来收集查看场景的用户反馈信息的重要 工具。可点击“表单”创建也可直接在互动模板里直 接快捷创建。
精品
【设置动画】
动画设置主要应用于：文字、图片、图形、一键拨号、输入框等组件 设置方法：点击组件→选择“动画”→进入动画设置页面
精品
制作小提示
为什么要做H5页面?
智能手机、平板电脑等移动终端设备越来越普及，用户在移动端花的时 间也越来越长。
H5页面中以文字、图片、动画、声音等相结合的富媒体出现，给用户带 来了全新体验，技术本身带来的新奇感让人们心生向往。
用户时间碎片化，接收信息爆炸性增长，企业营销需要迅速抓住客户眼 球。
什么场合可以用到H5页面?
精品
“我的场景”管理
• 点击“我的场景”可看到自己创 建的所有场景列表。
• 点击单个场景右下角的齿轮，即 可对此场景进行“设置、编辑、 复制、转送和删除”操作。
• 点击“开放”/“关闭”，对场 景进行开放和关闭。
精品
在微信里分享场景
微信扫一扫场 景二维码→打 开场景→点击 右上角菜单→ 选择分享方式
精品
点击“图片”后，选择“图片库”中的图片素材 或点击“上传”上传图片到“我的图片”库
精品
点击“形状”后，选择“形状组件” 库中选择形状组件
“形状”是便于用户制作扁 平化页面的素材， 形状素材和文字一样可以做 “颜色、大小”等设置。
精品
图集：是几张图片的集合 主要设置：图片比例、切换方式
精品
“互动”是方便制作者与观看者互动的组件 互动组件目前主要是“一键拨号”，正在不断增加
1.文本 2.背景 3.音乐 4.视频 5.图片 6.形状 7.图集 8.互动 9.表单 10.特效
精品
1.点击“文本”后 →即可创建 2.单击文本框 →出现编辑菜单 3.双击文本框 →进入基础编辑
精品
点击“背景”后，选择“背景库”中的背景图 也可点击“上传”上传图片到“我的背景”库
精品
背景编辑
H5页面几乎适用于所有企业和个人
常用免费H5页面制作工具
易企秀 腾讯风铃 京东 兔展 搜狐快海报 初页 最酷网 秀米秀制作 MAKA 点点客海报 ……
怎么制作H5页面?
制作小提示
• 制作H5场景推荐使用谷歌浏览器 • 也可在手机上下载制作工具客户端，在手机上进行制
作
精品
H5场景制作与运用流程
使用微信或者QQ进行登录。
登录易企秀账号
点击官网右上角“登录”
1.邮箱登录： 输入邮箱和密码，点击
“登录”即可。
2.第三方登录： 无需注册，直接点击图标，
使用微信或者QQ进行登录。
创建场景
点击右上角 创建场景
精品
【套模板】选择一个模板，把模板中需要修改的地方修改即可快捷制作。
【自主创建】点击“+”进入自主创建，一页一页创建场景。
微信互动营销：大转盘、刮刮卡、优惠券、投票调查、小游戏…… 商业展示：企业宣传、产品展示、品牌传播、优惠促销、企业招聘…… 会议活动：会议、展览会、发布会、活动…… 数字出版与教育：电子杂志、多媒体课件、培训课程…… 电子贺卡：商业贺卡、节日贺卡、生日贺卡、祝福卡…… 个人应用：个人秀、婚礼邀请、聚会Party、求职简历……
精品
制作小窍门
资料准备全，图片要清楚 文字要简洁，重点更突出 制作很简单，就看熟练度 场景有创意，谁也挡不住 愿您出佳作，祝君展宏图
• 点击预览图标，即可对此页面的 动画设置进行整体预览。
精品
精品
设置是对场景的基 本信息进行设置， 主要包括：场景封 面、场景名称、场 景描述、翻页方式。
点击“场景共享” 和“友情展示”下 拉键，可参加易企 秀官方活动和尾页 设置。
特效组件是给某一个页面加上一个特殊的效果。 点击“特效”即可为当前页面选择合适的特效
1
资料
准备
2
场景
制作
3
发布
宣传
4
信息
收集
精品
制作前，准备好4个资料
创意：
展示什么，用什么方式
音乐：
烘托氛围，MP3格式
图片：
提前备好，视觉效果好
文字：
准备充分，具有感染力
精品
免费注册易企秀账号
进入官网后点击右上角“注册”
1.邮箱注册： 输入邮箱和密码，点击
“注册”即可。
2.第三方登录： 无需注册，直接点击图标，
场景名称
填写名称 后期可改
填写完毕 点击创建
精品
点击选择 为了自己 管理方便
制作页面
精品
页面模板
在易企秀制作页面的左侧栏， 易企秀官方为大家提供了分 门别类的“页面模板”，在 制作场景的过程中，可以参 考或者直接套用页面模板进 行场景创建。 自己制作的页面，也可以保 存为“我的”模板，以供下 次使用。 企业账号将自己的场景设置 为“企业页面模板”，子账 号可以直接使用。 精品
→背景创建后，点击编辑栏上的背景齿轮，即可对背景 进行编辑。 →背景编辑主要包括：剪切、更换、效果（放大、缩 小）、删除。
精品
Байду номын сангаас
点击“音乐”即可创建【背景音乐】
1.【音乐库】为官方提供的音乐素材 2.【外部链接】插入网络音乐链接 3.【我的音乐】自主上传音乐
精品
点击“视频”后，给场景添加网络视频 点击“什么是视频通用代码”，出现详细操作
精品
很重要 特别重要
“保存”只是对操作进行保存，如果不点击 “发布”此场景未发布的编辑内容，在场景 分享出去时，别人看不到最新编辑的内容。 点击“退出”则推出编辑页面。
精品
点击发布后，可获得场景二维码、场景连接和 更多的一键分享方式。
精品
下载更大的场景二维码 （在“我的推广”里找到二维码，如下图）
H5页面微场景制作 入门教程
入门了，一切都变得很简单！
什么是H5？ 为什么要做H5页面? 什么场合可以用到H5页面? 常用的免费H5制作工具？ 怎么制作H5页面?
什么是H5？
H5是指第5代HTML（超文本标记语言），也指用H5语言制 作的一切数字产品。 通俗地说，H5是一种创建网页的方式。它会让手机网页看 上去更炫酷，功能也更丰富多彩。
右侧的“页面管理”
5大管理操作
1. 复制：点中条框，点击“复制” 2. 我的模板 ：点中条框，点击“我的
复制”，出现在左侧“页面模板”中， 可删除
3. 删除：点中条框，点击“删除” 4. 移动：点中条框，可上下拖动 5. 添加：点击“+”，添加一页
精品
10个基本组件+设置+发布
组件是构成场景的基本要素
精品
表单（也叫信息收集表、报名表、信息反馈表等）是 场景创建者用来收集查看场景的用户反馈信息的重要 工具。可点击“表单”创建也可直接在互动模板里直 接快捷创建。
精品
【设置动画】
动画设置主要应用于：文字、图片、图形、一键拨号、输入框等组件 设置方法：点击组件→选择“动画”→进入动画设置页面
精品
制作小提示
为什么要做H5页面?
智能手机、平板电脑等移动终端设备越来越普及，用户在移动端花的时 间也越来越长。
H5页面中以文字、图片、动画、声音等相结合的富媒体出现，给用户带 来了全新体验，技术本身带来的新奇感让人们心生向往。
用户时间碎片化，接收信息爆炸性增长，企业营销需要迅速抓住客户眼 球。
什么场合可以用到H5页面?
精品
“我的场景”管理
• 点击“我的场景”可看到自己创 建的所有场景列表。
• 点击单个场景右下角的齿轮，即 可对此场景进行“设置、编辑、 复制、转送和删除”操作。
• 点击“开放”/“关闭”，对场 景进行开放和关闭。
精品
在微信里分享场景
微信扫一扫场 景二维码→打 开场景→点击 右上角菜单→ 选择分享方式
精品
点击“图片”后，选择“图片库”中的图片素材 或点击“上传”上传图片到“我的图片”库
精品
点击“形状”后，选择“形状组件” 库中选择形状组件
“形状”是便于用户制作扁 平化页面的素材， 形状素材和文字一样可以做 “颜色、大小”等设置。
精品
图集：是几张图片的集合 主要设置：图片比例、切换方式
精品
“互动”是方便制作者与观看者互动的组件 互动组件目前主要是“一键拨号”，正在不断增加
1.文本 2.背景 3.音乐 4.视频 5.图片 6.形状 7.图集 8.互动 9.表单 10.特效
精品
1.点击“文本”后 →即可创建 2.单击文本框 →出现编辑菜单 3.双击文本框 →进入基础编辑
精品
点击“背景”后，选择“背景库”中的背景图 也可点击“上传”上传图片到“我的背景”库
精品
背景编辑
H5页面几乎适用于所有企业和个人
常用免费H5页面制作工具
易企秀 腾讯风铃 京东 兔展 搜狐快海报 初页 最酷网 秀米秀制作 MAKA 点点客海报 ……
怎么制作H5页面?
制作小提示
• 制作H5场景推荐使用谷歌浏览器 • 也可在手机上下载制作工具客户端，在手机上进行制
作
精品
H5场景制作与运用流程
使用微信或者QQ进行登录。
登录易企秀账号
点击官网右上角“登录”
1.邮箱登录： 输入邮箱和密码，点击
“登录”即可。
2.第三方登录： 无需注册，直接点击图标，
使用微信或者QQ进行登录。
创建场景
点击右上角 创建场景
精品
【套模板】选择一个模板，把模板中需要修改的地方修改即可快捷制作。
【自主创建】点击“+”进入自主创建，一页一页创建场景。
微信互动营销：大转盘、刮刮卡、优惠券、投票调查、小游戏…… 商业展示：企业宣传、产品展示、品牌传播、优惠促销、企业招聘…… 会议活动：会议、展览会、发布会、活动…… 数字出版与教育：电子杂志、多媒体课件、培训课程…… 电子贺卡：商业贺卡、节日贺卡、生日贺卡、祝福卡…… 个人应用：个人秀、婚礼邀请、聚会Party、求职简历……
精品
制作小窍门
资料准备全，图片要清楚 文字要简洁，重点更突出 制作很简单，就看熟练度 场景有创意，谁也挡不住 愿您出佳作，祝君展宏图
• 点击预览图标，即可对此页面的 动画设置进行整体预览。
精品
精品
设置是对场景的基 本信息进行设置， 主要包括：场景封 面、场景名称、场 景描述、翻页方式。
点击“场景共享” 和“友情展示”下 拉键，可参加易企 秀官方活动和尾页 设置。
特效组件是给某一个页面加上一个特殊的效果。 点击“特效”即可为当前页面选择合适的特效
1
资料
准备
2
场景
制作
3
发布
宣传
4
信息
收集
精品
制作前，准备好4个资料
创意：
展示什么，用什么方式
音乐：
烘托氛围，MP3格式
图片：
提前备好，视觉效果好
文字：
准备充分，具有感染力
精品
免费注册易企秀账号
进入官网后点击右上角“注册”
1.邮箱注册： 输入邮箱和密码，点击
“注册”即可。
2.第三方登录： 无需注册，直接点击图标，