✌️微信、知乎、美团、视频类等热门App图文排版技巧分析

图片不论是在平时做PPT还是我们做App,以及日常生活中,都有着举足轻重的作用,话说有图有真相,就是这个道理。图文结合,短平快的把信息传达给用户。
当下市场上比较火爆的几款App,从成立初期到现在,几经改版,通过对比多款App可以发现:如今,很多App已经不再采用单一的图文排版方式,例如:图片在左,文字在右;或者图片在上,文字在下方…
而是,通过多种方式的结合,使App看起来界面更加丰富,不同的图文排版形式有不同的优缺点,根据自己主要想突出的内容使用不同的排版方式可以达到理想的效果。

图片和文字的组织关系主要有这几种:

1)图片靠左对齐(左对齐)

2)图片靠右对齐(右对齐)

3)图片放在上方

4)图片放在下方

5)图片作为背景

6)同时利用上述几种方式

我们先看下微信以及QQ的图文排列方式:
例如,微信99%的使用图片的地方都是,图片在左,文字在右的方式,一般,用户的注意力都是从左向右的,在列表中,图片放在列表开头识别度高,能够快速的识别出是哪个用户。另外哔哩哔哩App中也有视频截图图片在左的部分:
这里写图片描述

另外,美团App,用图片内容引发用户兴趣,作为营销的手段提高转化率, 放一些让人垂涎三尺的美食图片或者景区的标志性图片。该App中主要是图片上,文字下;图片左,文字右的排版方式。
这里写图片描述
有道云词典App中,有部分列表中也是采用的图片左,文字右的方式,但是,感觉部分图文不符,相关性不太高,造成疑惑。让人感觉,文章本身的内容或许也是风牛马不相及。所谓的标题党也就是这样,如网易新闻,小编经常被喷。

再看下知乎App,以内容为主的整个知乎App,内容比图片更为重要,而且有的话题很难用图片来描述,但是,没有图片的话,可读性太差,美观度也不高,这时,我们就可以把图片放在文字的右侧。
这里写图片描述

36kr,配图只是对内容的一种补充,所以都把图片靠右放了。
这里写图片描述

像网易新闻App,腾讯新闻App,今日头条App,主要是为了突出内容,所以也是采用图片在右,文字在左的排版模式;以及文字在上,图片在下的模式。
这里写图片描述

网易公开课App,腾讯视频App,优酷视频App,哔哩哔哩App,爱奇艺视频App等视频类App,此时图片的重要程度比放在左侧还要高的多,基本每条记录的主要信息都靠配图来呈现,也主要靠图片来吸引用户,文字仅起到辅助作用,图片在文字的上方,优先级最高。这种处理方式主要利用在视频网站、图片社交、部分购物网站、旅游网站上。蘑菇街App、携程App、以及去哪儿App都有用到图片在上,文字在下的排版方式。
这里写图片描述

微信朋友圈、QQ空间说说、微博等社交状态列表中,图片放在文字的下面,主要的优势:可以把文字和图片的结合优势充分发挥出来,文字简要陈述,图片带你身临其境,还原真实情况。(可以翻看下自己的朋友圈加深印象)。

蝉游记App,面包旅行App,图片作为背景,可以加强其沉浸感,充分利用图片唤起用户的想象,把图片的诱惑最大化以提高逼格。但是,蝉游记整个“游记”模块,通篇都是这种图片作为背景,浮层上一个标题,容易让人产生疲劳感。
另外,面包旅行值得赞赏的一点在于,他的写游记的入口非常显眼,用户体验很好,在用户往下滑的时候,表示想看更多游记,写游记的入口会隐藏起来,而当用户往上滑时,这个➕则会显示出来,用了简单动画效果,交互体验非常棒!
这里写图片描述
所以,可以看到,做为蝉游记竞品的马蜂窝App已经采用混搭式,对于浏览量高的攻略,排版原则为图片在上方,一般的攻略则采用图片在右,文字在左,重点突出,主次分明。
这里写图片描述

另外一款竟品,十六番App则主要采用图片在下方,文字在上方的原则,主要是为了突出内容。

通过以上分析,可以看到,没有哪一款App,百分百的单纯使用一种排版方式,而是根据侧重点来选择,有的放矢地指导我们设计App版式,而不是,完全没有依据地、一味地图片在左文字在右。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值