跟大家分享一种非常实用的排版版式——撑伞式排版法。
在学习这种版式之前,必须要先明确一个问题,这种排版适用的情况:
【1段总结+多段分述】。
比如像这个页面,就是典型的总结+多段分述
这种类型的页面有一种万能的排版方法,就是用一个横向色块作为“大伞”,然后把分述的多个段落置于这个“大伞”的下方,保护起来。
比如我们刚才这个页面
现在就可以依照这种排版,做成这样:
但是吧,直接用一个大色块又觉得太单调了。于是我们通常有这两种处理方法:
处理一:矩形色块用图片替代+渐变蒙版
因为如果直接用图片,会导致其上方"总结"段落的文字看不清楚。所以我们最好再图片上再添加一个渐变蒙版
就可以做出这个页面:
处理二:色块+PNG图片(伸出外面)
用一张无背景色的PNG图片,置于右侧装饰。图片一定要伸出色块的范围才好看。
处理三: 大色块+小色块
原来的基础版式,我们底下是三个独立的分述。
现在你也可以用一个色块,将底下分述段都框起来。两个色块进行叠加
于是,我们可以把刚才的页面改造成:
这就是我想给大家说的,【1总+多分述】类型页面——"撑伞式"排版。
下面我再给大家举个例子,我们来加强一下对这个排版的运用。
练习案例
下面这个案例,其实也是属于总+分的形式
那么按照前面我们讲的“撑伞式”排版,就可以轻松美化成:
按照处理一: 矩形色块用图片替代+渐变蒙版
按照处理二:色块+PNG图片(伸出外面)
当然这里,色块也是可以填充图片的。
按照处理三: 大色块+小色块
现在是不是对这种排版方法的使用很有心得了?
再最后看一下这个案例,也是属于总+分的形式
这个案例我就不再一 一列举三种处理方式的效果了。如果采用上述的处理三:大色块+小色块,就可以改造成这个效果。
看到这里,我相信大家现在对于这种【1总+多分述】类型页面,采用"撑伞式"排版,都有了一些感悟。这种排版方法还是非常实用的。
其实外行不是想知道怎么好看,而是变好看的步骤