下面的是PPT教程网给你带来的相关内容：

ppt怎么把图片设置成一样大小:如何用PPT思维，做一个手机H5动效页面？

什么是H5？

H5指的是第5代HTML编码语言

我们通常所说的H5，是指用H5语言制作的数字产品

其实，H5就是你经常在朋友圈看到的那种一页页呈现和交互（多为竖屏上翻）的页面交互形式。

我们应该都见过有很多制作精良的专业级H5，但也见过很多恨不得秒退的H5作品，后者一般多为非专业公司自己制作的……

掌握用在线编辑器制作H5的技能是非常有必要的！大到横行职场，小到做私人相册，发朋友圈也很有面子！

操作简单，效果炫酷！最关键的是，只要你会用PPT，就可以搞定简单的H5制作，足以应对日常工作生活的使用场景！

如何用PPT辅以H5呈现？

我们先要了解H5的特点

我在这篇文章的标题中卖了个萌，虽说是“用PPT思维制作H5”，实际上我制作的H5页面屈指可数，在制作过程中，也是真心离不开PPT……

PPT和H5有很多相似之处，显然，它们都是服务于沟通的工具，也都可以承载文字、图片、动效、声音等表现形式，力求引人入胜。

两者还同时具备“本地化”的特征。“本地化”的意思是，解码器广泛存在于用户端。以PPT来说，之所以它能承载很多演示之外的功能，也是由于软件已经足够普及，所以我们做好的PPT可以发给大家查看。

而H5的发展迅猛，是因为它的播放基于手机浏览器，比PPT还要“轻量化”得多……不仅保证了用户播放，还可以顾及多平台的兼容，电脑、手机、Pad全部通吃，以这点来说，H5的传播比起PPT的要方便了不知多少个量级。

▽

所以，H5在某种程度上可以承载PPT的功能，演示界也早已有了H5的江湖地位，特别是伴随各种H5编辑器工具出现之后，全民创作H5也已变为可能。

这是锐普陈魁在演示峰会上的一页PPT

提到了H5在演示界越来越重要的地位

面对不同的H5传播诉求，当然也要有不同的设计考量和侧重。我前几天接到一个H5制作任务——为公司挂牌仪式制作邀请函。

▽

Step 1. 确认设计风格，搜集素材

公司是省属直管的大型金融国企，考虑到国企背景和鲜明的地方属性，我认为水墨中国风是首选。

与PPT的制作流程相同，确定风格之后，要去搜集素材。我联系了执着于雕琢简历的H5高手——@有乐，他扔给我一个中国风的PPT，里面包含大量中国风元素。

最终版的素材几乎都出自这个PPT

▽

除了图片素材，还要构思文字内容、确定文案。

对于邀请函而言，最重要的信息是——

1、公司品牌、事由；

2、时间地点；

3、主要议程；

H5的加载时间与页面数量成正比，所以页面一定要少，如果是文字类的H5，我建议不要超过5页。

此外，大部分人在划屏浏览H5页面的时候，每页的停留时间不会超过5秒，所以单页信息量要严格控制，这点与PPT制作一样！

▽

Step 2. 用PPT完成页面元素的布局

PPT与H5的最直观区别，体现在页面尺寸上——PPT多为横屏，H5多为竖屏。

在我们用PPT设计页面之前，先调整幻灯片页面设置，@有乐建议将页面设置为宽17厘米、高27厘米。

设置适当的页面大小的意义在于——可以更好的控制素材的输出，不会因为尺寸小而导致图片模糊，也不会因为尺寸过大而导致文件臃肿、加载过慢。

▽

接下来的工作最需要设计感，也是与PPT制作最相似的——将页面中的元素有逻辑性、有美观度的进行组合。

与PPT不同的是，H5的页面布局需要注意两点——

1、页面底部（至少是首页底部）要保持简洁，让观众看清下方的操作提示。

看似是一个约定俗成的划屏操作，但很多人却get不到……

所以很多H5会用图标或者文字，单独在H5首页提示用户需要划屏浏览，这其实是很体贴、也是很有必要的做法。

2、页面元素的着眼点，要控制在屏幕中间偏上的位置，否则就要考虑引进动效，为观众提供视线焦点。

▽

Step 3. 构思动画效果、保存图片素材

为什么动画和素材要放在一个步骤里进行说明？正是因为对于H5而言，这两部分内容密不可分。

由于不同手机的机能限制，很多炫酷的效果无法完成，必须让包含动画效果的元素尽可能的少。

以上边这页为例，三部分文字建议存成三张图片、设置三个动效，要将存图和动画一起考虑，把页面中相同的动画元素ppt怎么把图片设置成一样大小，以整体进行考虑。

▽

将元素存为图片很简单，点击右键 - 另存为图片即可，需要注意下面几点——

1、H5编辑器没有丰富的字体样式，所以要把“文字”全部导出为PNG图片（以保证半透明效果）；

2、有些图片可能需要拆成多个H5素材，可能需要用到裁剪功能，或者是借助“形状”对图片进行拆分（拆分可以参考这篇文章——）

3、有些裁剪过的图片，导出后会被拉伸（推测是软件bug），保险起见可以把裁剪过的图片先粘贴为图片，再另存为图片。（有点绕，其实就是不要导出裁剪过的图片素材……）

▽

Step 4. 前往在线编辑网站，制作H5

目前有很多在线H5编辑工具，例如Maka、易企秀……操作方面基本一样，我用的是Maka，只因已经习惯……

剩下的工作非常简单，把图片上传，排布好。

再为每张图片添加动作（就是动画效果）就好，与PPT不同的是，H5编辑器里的动画没有单击、之后的选项，全靠“延迟”控制时间。

排布元素的操作，比起往PPT插入元素只是多了一个上传的过程，操作一次就会了解。

动效建议逐个尝试，了解每个动画的特性，才会有具体运用的想法。与PPT的动画效果相比，H5的动画有很多附加了弹性效果，比较细腻。

把PPT水平拿出来，做个拉轰的H5，横行公司毫无压力！我认为H5制作是PPTer一定要掌握的技能！因为相比PPT的复杂程度，模板化的H5制作真心太简单ppt怎么把图片设置成一样大小:如何用PPT思维，做一个手机H5动效页面？，却占据了最重要的手机端传播渠道！

明天谈谈H5的其他制作细节，包括动效、配乐、交互菜单等等……

▽

本次H5邀请函的制作，还要感谢有乐同学的大力帮助，他呕心沥血制作了一个H5参赛作品，从形式到文案雕琢了一个通宵，H5本身是关于和的区别，点击阅读原文即可查看，推荐给大家！

感谢你支持pptjcw.com网，我们将努力持续给你带路更多优秀实用教程！

上一篇：ppt统一改字体:巧用PPT，替换字体和色彩就在瞬间 下一篇：ppt中的视频如何设置自动播放:怎么设置ppt幻灯片不自动播放(ppt如何取消自动播放)

郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。