html5入门:怎样制作和分享漂亮的免费h5作品

作者:落知秋 | 创建时间: 2023-07-02
说到HTML5,大家可能一头雾水,不知所云。不要紧,你有没有玩过“围住神经猫”这个游戏呢?没错,这就是用现在非常热的H5制作的。今天和大家来聊聊,H5到底是什么鬼并怎么拿下它?...
html5入门:怎样制作和分享漂亮的免费h5作品

什么是H5?

概念: H5是指第5代HTML,也指用H5语言制作的一切数字产品。 具体应用从H5小游戏、H5大翻页,到H5站点、H5营销,不一而足。 H5不再只是一种标记语言,而是一个全新的框架和平台。 包括提供免插件的音视频、图像动画、本体存储以及更多酷炫而且重要的功能。

优势: 在我看来,使用H5具有2大优势: 第一是跨平台。 H5最显著的优势在于跨平台,可以兼容PC端与移动端、Windows与Linux、安卓与IOS。 第二是轻量化。 比本地APP拥有更短的启动时间,更快的联网速度,而且无需下载占用存储空间,特别适合手机等移动媒体。

分类: 依据功能和目标,可以将H5分成:活动运营型、 品牌宣传型、产品介绍型、总结报告型; 根据展现形式又可以分为:简单图文、礼物/贺卡/邀请函、问答/评分/测试、游戏等类型。

工具: 随着技术的发展,市面上出现了越来越多的制作工具。多数都有PC版和手机端两种扩展形式。 使用较多的有MAKA和单页等,当然肯定还有其他优秀的工具,这里不一一举例了。

怎么制作H5?

今天就利用MAKA介绍下H5的制作流程。以下是MAKA的特点。

【操作步骤】 ①    打开MAKA官网,注册登录。 点击【我的作品】-【创建作品】,可以选择【新建空白】也可以选择【既有模板】。 ②    布局介绍。 左侧为【页面及图层】、中间为【主页面】、偏右侧【素材栏】、右侧为【设置栏】、上侧为【音乐栏】。

【页面及图层】显示不同页面及同意页面上的不同素材。 下方点击+号,新增空白页面或选择模板进行添加;切换至【图层】方便查看不同素材。

b.【主页面】显示素材。 c.【素材栏】提供了文字、图片、形状元素、按钮链接、特效、高级功能等。

d.【设置栏】对文字、图片不同元素出现对应的不同设置。 【动作】选择预定动作类型,并设置【进场速度】和【进场延时】;可配合【图层】选中不同素材进行具体设置。 e.【音乐栏】看到【+上传音乐】,可以上传自己喜欢的音乐。

③    添加素材至指定位置,设置具体参数,并设置动作,调整【速度和延时】。点击【主界面】右侧上方▶【预览】效果。 ④    满意后,保存!具体动画设置内容,请继续关注后续更新内容。 ⑤    返回【我的作品】列表,鼠标放置在刚操作的文件上,点击【预览】进行封面设置。

如何分享与传播?

同样在作品预览页,获取你的H5二维码和短连接; 通过扫描作品二维码或直接打开短链接的方法,在微信观看;

打开作品后,通过右上角【…】分享按钮,直接分享出去。

温馨提示

上传的图片大小不能超过2M。
上传的音乐小于2MB的MP3格式。
点击展开全文

更多推荐