美文网首页数字尾巴职场强心剂等待
设计H5的九个段位,你在哪一段?(附提升技巧)

设计H5的九个段位,你在哪一段?(附提升技巧)

作者: 面试求职那些事 | 来源:发表于2016-11-24 13:12 被阅读3208次

目前,通过H5页面进行企业宣传、邀请函制作、品牌展示,已经成为企业传播的不二选择。现在市面上有很多H5制作平台,比如MAKA、WPS秀堂等,用户只要进行图文替换,即可快速生成H5页面。我们经常看到质量参差不齐的H5作品,有的土掉渣,有的美到爆。下面,我为大家盘点下H5制作的九个段位,看看你在哪一段?

第一段:Word式H5

这种H5就好像一个带有背景图片的word,所有文字密密麻麻排在一起,主次不分明,重点不突出,看着让人头疼。

优化方法:精简文字,突出主次,标出重点

左图文字过多,阅读体验不好

第二段:亮瞎眼的艺术字H5

这种H5主要是艺术字使用不当,字体不漂亮,配色搭配不合理,一个页面的颜色太多,给人一种很廉价的感觉。

优化方法:

A、尽量少用宋体,多用微软雅黑,同一个文档不要使用超过3种以上的字体

B、色彩选取同色系的,不要太跳,同一页面的字体颜色不要超过3种

艺术字太花哨,降低了作品档次

第三段:页面风格混搭H5

这种H5单看每一页都不错,但连续浏览下来,就感觉风格太混乱,颜色太突兀,前后不统一。这是典型的使用模板不当,应用了不同风格、不同配色的H5,导致搭配混乱。

优化方法:选择同一风格,同一色系的H5模板;或者从头自尾应用一个统一的H5模板。

三个页面风格不统一,混搭很突兀

第四段:滥用特效的H5

这种H5里增加了很多特效,如烟花,红包,飘雪等。导致页面内容拥挤,看着眼花缭乱。

优化方法:适当减少特效,无需每一页都加特效,一般只加一页就好。

第五段:宣传册改编H5

这种H5制作起来很容易,把宣传册制作文件保存成16:9或者16:10的图片,直接上传就可以生成H5。缺点是页面上的元素不能单独加动画,浏览起来单调刻板。如果宣传册上文字过多,手机浏览时会觉得文字很小,排版拥挤。

优化方法:不要将宣传册每一页保存成一张图片,可以分别保存素材,例如,标题,照片,按钮,单独保存成图片并上传,可以很方便加动画。

H5由宣传册改编而成,没有动画

第六段:PPT式H5

这种H5的排版相对美观,使用了横版H5形式,看起来会让人感觉是手机上的PPT,适合会议报告,会议总结等场景。

横版H5,用于报告场景 横版H5,类似PPT效果

第七段:风格统一H5

这种H5素材统一,风格统一,配色统一,看起来非常精美,大气。比如下图案例1,应用了黑板报素材,很匹配教育主题。比如下图案例2,应用了海报背景和线条色块,很匹配公司介绍主题,可以适用于各种行业。

韦伯英语培训招生H5 公司介绍类H5

第八段:特色H5

这种H5有自己的特色,比如手绘风,比如板报风,比如卡通三国风等。下图案例1采用怀旧设计,让人眼前一亮。下图案例2采用WIN8metro元素设计,颜色清新,商务大气。

怀旧风招聘H5 win8风格会议邀请函H5

第九段:定制化H5

这种H5已经不能通过平台工具直接做出来了,需要单独定制。目前最酷炫的H5要数天猫双十一H5了,相信很多人已经看过了。

天猫双十一的NB逆天H5

以上9种H5设计中,前五种在设计上需要提升,后四种都非常精美,都有自己的特色。那么,你在哪一段呢?

如果你想让自己成为六段以上的H5制作高手,我介绍两个快速用H5工具提升H5制作段位的方法(以WPS秀堂为例):

方法1:使用精美的模板

Step1:在模板页面,挑选合适的模板类别

第一步:选择模板

Step2:如果喜欢某一个模板,可以点击“立即使用”

第二步:使用这个模板

Step3:图文替换,替换成自己需要的文字

第三步:对模板进行图文替换

Step4:点击编辑页顶部的“分享/发布”按钮,在弹出页点击确定,生成二维码和URL

方法2:收藏并使用优秀的素材

Step1:挑选合适的模板类别(图片参考方法1的step1)

Step2:选择某一模板,点击“预览”按钮

选择某一模板,预览

Step3:在弹出页面可以通过鼠标上下翻动,如果喜欢某一页的素材,可以点击“收藏此页”

选择合适的模板页,收藏素材

Step4:在编辑界面,在“收藏”标签下可以看到自己收藏的所有素材,按需求任意使用

使用已收藏的素材,图文替换,自由编辑

Step4:编辑好素材,点击编辑页顶部的“分享/发布”按钮,完成发布即可。



更多H5内容,请浏览以往文章:

1、H5设计:盘点7种常见的H5构图方法,总有一种适合你

2、H5精品:除了《薛之谦憋大招》,11月还有哪些刷屏H5?(11月精品推荐第1弹)

3、H5精品:除了天猫和薛之谦,最近还有一大波高逼格H5(11月精品推荐第2弹)

4、H5干货,标题决定浏览量 爆款H5都按这7个套路拟题

5、H5干货创意H5都用这四种表现方法!你不想了解一下么?

6、月度合集,10月最火H5 TOP5,你见过几个?

7、月度合集,9月最火H5都在这 你被刷屏了么?

8、半年盘点谁说H5过气了,这些在2016都曾刷曝朋友圈

9、主题H5,你知道长征,那你见过长征主题H5吗?

10、主题H5不只是惊悚 万圣节H5策划的6种套路


我是知识的搬运工,持续更新H5内容。如果你喜欢,请赞赏,请关注,谢谢。

相关文章

网友评论

  • 爱红旗渠:……目前,通过H5页面进行企业宣传、邀请函制作、品牌展示,已经成为企业传播的不二选择。现在市面上有很多H5制作平台,比如MAKA、WPS秀堂等,用户只要进行图文替换,即可快速生成H5页面。我们经常看到……质量参差不齐的H5作品,有的土掉渣,有的美到爆。下面,我为大家盘点下H5制作的九个段位,看看你在哪一段? 第一段:Word式H5 这种H5就好像一个带有背景图片的word,所有文字密密麻麻排在一起,主次……不分明,重点不突出,看着让人头疼。 优化方法:精简文字,突出主次,标出重点 第二段:亮瞎眼的艺术字H5 这种H5主要是艺术字使用不当,字体不漂亮,配色搭配不合理,一个页面的颜色太多,给人一种很廉价的…… - 爱红旗渠不知道是否是沙发
  • 夏妍妍:用心去感受就可以感受到
  • e88053b2c387:那种答题类的h5页面能有模板吗
    e88053b2c387:@我是知识的搬运工 太感谢太感谢你了,我也还是在学习阶段,目前也就做做类似于PPT的h5,受众群参与度低。
    面试求职那些事:@丁一一不想说话 如果你只用模版简单修改文字就能满足需求的话,我可以发几个调查问卷模版给你。如果要求很高的话,不能直接用模版
    面试求职那些事:@丁一一不想说话 我可以给你找一些调查问卷,直接把文字改了可以用于答题。如果你对设计要求较高的话,还是不建议直接用模板,需要自己设计。
  • 子墨小生:有个网易云音乐的h5也很牛逼,初学者也可以做出来定制的吗?
    面试求职那些事:@子墨小生 爆款H5都是公司集体创意的,从创意策划到美术设计再到代码编写,有一整套流程。个人想做爆款很难,但是想做精美的H5作品其实很容易。我认识一些H5设计师,在各大平台上接H5设计制作的活,轻松月入过万,活的非常滋润。
    子墨小生:@我是知识的搬运工 看样个人想要做个爆款H5,难度很大啊
    面试求职那些事:@子墨小生 我写过一系列H5盘点,10月盘点里有你说的那个网易云音乐的H5。初学者通过工具暂时还不容易做出有刷屏效果的H5。有一些定制H5是需要一点代码经验的。
  • 暗若:这是什么网站
    面试求职那些事:@暗若 我用的是WPS秀堂 网址s.wps.cn。正文里不方便发出来。
  • 宅小阳:我以为你在说HTML5, :joy: 最近正在看 基础的
    面试求职那些事:@林三少 我说的是应用工具:smile:
  • 小灬鱼儿:此乃雪中送炭啊
    面试求职那些事:@小灬鱼儿 希望可以帮到你:smile:
  • 9734fd8ebd07:。。。。 我还以为你想说H5编程....
    面试求职那些事:@鱼丸君 编程我真不懂,只懂用平台工具快速制作小页面
  • a65fbeafbc76:喜欢~
    面试求职那些事:@open大人 谢谢:smile:

本文标题:设计H5的九个段位,你在哪一段?(附提升技巧)

本文链接:https://www.haomeiwen.com/subject/hzubpttx.html