H5设计排版该怎么做

每个企业商户在创建H5的时候都是需要去寻找更多的灵感和创意来作为支撑的。在做页面H5设计的时候有很多需要注意的细节，小编今天来给大家科普科普：

一、模版图文排版

“图文排版”是指将文字、图片、图形等元素在版面布局上调整位置、大小，使页面内容条理化，是模版美观度的重要组成部分之一。

1、排版标准

（1）余模版场景内容、风格元素相匹配；

（2）文字、图片排列整齐，画面整洁有序；

（3）文字、图片大小、行间距适中，结构适当留白，不宜过度充满页面，符合一定的排版构图原则；

（4）统一模版各页面字体/字号/行间距等。

2、排版建议

（1）模版内使用不同的排版格式，增加模版内容结构丰富度及易用度（单图+单文、多图+多文、多图+少文、少图+多文）；

（2）学习优秀排版作品，增加图文排版结构形式；

（3）适当使用高级功能-图组功能，减少图片占用篇幅。

二、模版色彩搭配

“色彩搭配”是模版美观度的总要组成部分，好的配色方案可以产生良好的视觉效果，进而影响模版整体美观度。

1、配色标准

（1）模版颜色与主题、场景、素材相搭配；

（2）符合配色规则。

2、配色思路

（1）根据模版的主题/行业/场景/主要素材，选择符合主流审美模版配色；

（2）使用1~2种主色，并辅之以1~2种辅色，如非彩色系模版，不建议使用超过4种颜色。

不建议：如果对设计效果没有很大信心，不建议忽略模版主题而“大胆”使用与主题不搭的颜色，不符合大部分用户审美的配色较难成功销售。

三、模版动效

“动效”即H5元素出场及强调动作的总称，是H5模版的灵魂所在。合适的动效可以使模版表达更加丰满、生动。

1、动效使用标准：

（1）所有H5必备一定的动效，不能完全静止；

（2）控制动效数量及速度，不宜复杂冗余或速度过慢；

（3）出场顺序及时间控制与模版素材/结构相搭配；

（4）相似页面使用相似动效，保持模版整体协调统一。

2、动效设置思路：

（1）根据素材结构使用不同的动效搭配；

例：横向结构的素材排版，使用左右分别飞入的动效

（2）灵活运用动效，制造素材飞出/飞过/构成/停留等特殊效果。

2.模版易用度

“易用度”说明：

用户选择平台购买模版，初衷是为了方便、快捷地制作自己的营销推广场景。“易用度”即模版能被用户快速制作替换、方便使用的模版考量指标。

做一个H5页面，设计是相当重要的。首先H5就是一个视觉体验，H5设计做的好，那么用户的感官体验就好，看到的东西就很舒服，能够吸引用户。如果设计做的不好用户都不愿意看，那这个H5做出来还有什么意义呢？