高效排版技巧:如何优雅地在推文中展示100张图片
掌握这些排版技巧,让你的推文在视觉上脱颖而出!本文介绍多种布局和图片展示方法,包括布局+图片、滑动布局+图片和svg轮播组件+图片,帮助你在推文中高效展示大量图片,提升用户体验。适合新媒体运营者和设计师阅读,让内容更加吸引人。
朋友们大家早上好啊。
最近有朋友问三儿:领导想要在推文中放很多很多图,应该怎么排版。
如果只是将图片简单堆砌在文章后面,文章会显得冗长,排版单一也不好看。
这个时候我们可以使用布局或图片相关的svg组件。
一张一张放图片,内容展示少,用户读取的信息也少,而布局可以灵活排列,可一行两列、三列、四列、甚至是五列效果如下👇
# 如何添加布局
在编辑器页面样式展示区中的上方找到【布局】👉【基础布局】,根据各自的需求,选择一行x列的布局选项。
选择好布局后,在布局框中添加图片即可。
但如果我们就这样简单放置图片肯定是不行的,三儿给图片加个背景,问题就会立马显露出来。
大家看到了吧,放置图片后边框内还有多余的空白,图片与图片之间紧密相连不够好看。
# 如何解决
给布局添加边框,设置边距、给插入图片设置【无缝】消除多余的空白。
*注:【边框】样式中默认是【无边框】所以需要我们手动选择相应的边框样式;
【边距】分为【内边距】和【外边距】边距可以灵活设置【上下左右】
设置好后就能得到如下效果👇。
【布局+图片】的优劣
优:展示较多图片,操作简单
劣:展示图片数量有限,一旦一列x图,这个x的内容超多3张,图片大小将显著变小
推荐指数:☆☆☆
适用范围:2-3图的展示
若我们想要插入图片数量不限,尺寸还要足够的大,我们有办法实现吗?当然可以,如下👇
右滑查看更多海报
# 如何添加滑动布局
在编辑器页面样式展示区的上方找到【布局】👉【滑动布局】
选中【滑动布局】点击【编辑】进入滑动布局编辑页面,根据需求可设置【竖向】或【横向】滑动。
点击【滑动布局】进入编辑页面,插入一行单列布局,上传图片,设置布局格式,点击【完成】即可。
*注:格式设置方式与【布局+图片】相同,都需要注意清楚去除图片缝隙,以及设置图片边框、边距
【滑动布局+图片】的优劣
优:图片无数量限制,展示图片尺寸大、信息多
劣:展示形式单一,不够新颖读者容易审美疲劳
推荐指数:☆☆☆☆
适用范围:大于3张图片的展示
想要让人眼前一亮又要插入多张图片,那么svg轮播组件一定不可错过,效果如下👇
svg组件 顶图固定底图横向滚动播放 ID:224
svg组件 横向图片停顿式放大轮播 ID:253
svg组件 抽拉式多图左右自动轮播 ID:219
svg组件 横向停顿式图片轮播 ID:166
svg组件 多图弹动轮播(横向/带特效) ID:94
# 如何使用轮播svg组件
通过135编辑器页面进入svg编辑器页面,搜索关键词【轮播】便可得到轮播相关的svg组件,根据每个组件具体要求上传轮播素材。
*注意:带有svg效果的文章不可以直接【复制】【粘贴】到微信公众号后台,会导致效果无法实现。
正确操作是微信公众号授权给135编辑器后,使用【保存同步】到微信后台,这样可以确保svg效果完美呈现。
【轮播svg组件】的优劣
优:图片展示效果新颖、展示图片数量多、可玩性高、代码0基础也能轻松上手
劣:对图片有一定的要求如大小、图片格式、数量(有些效果只能双数图片)
推荐指数:☆☆☆☆☆
适用范围:创意图片展示、多图展示
以上就是今天的全部内容啦
跟着三儿学更多有趣好玩的
排版技巧
大家还有什么
想看想学的
记得在评论区留言
三儿都会看到哦
我是爱你们的三儿~
·END·
文章排版由135编辑器提供技术支持
■ ■ ■ ■
立即登录