首页 体育 教育 财经 社会 娱乐 军事 国内 科技 互联网 房产 国际 女人 汽车 游戏

新闻列表应该采用什么样的布局方式?

2020-01-13

咱们平常必定会在手机上阅览各种新闻,看了那么多新闻,你还能想起来大部分的新闻列表是以什么布局出现的呢?你有没有发现不同的新闻类型选用的是不同的布局方法呢?今日就来讲讲新闻列表应该选用什么样的布局方法,下面我总结了五种布局款式:

1.大图布局,2.多图布局

3.左图右文,4.右图左文,5.卡片列表

新闻列表中一般不会在整个页面中选用大图布局,由于新闻一般数量较多且具有时效性,选用大图布局会下降阅览功率,假如是比较重要的新闻或许是期望用户留意到的内容则会选用大图布局。更多情况下,大图布局和其他布局会混合运用,在许多新闻中,用大图布局的方法杰出某条新闻引起用户留意。

扩展

大图布局也被运用于多种场景中,大图除了招引用户还能展现更多图片细节,在许多以图片为主的产品如规划师创意库都选用大图布局的方法。airbnb相同选用大图布局列表向用户展现契合条件的民宿,咱们能发现预订酒店时列表往往是以小图布局合作更多文字信息的布局方法,由于酒店房间大致相同,没有更多的风格或特征,人们重视酒店的品牌星级价格或设备等。而民宿和酒店不一样,民宿往往各有特征,以其茕居风格的装修来招引住客,洁净舒适和赋有特征的民宿图片能一会儿招引用户点击,经过阅览大图用户就能了解民宿的大体环境,而不需求再次点击检查,能进步用户阅览查找民宿的功率。

多图布局中每行内容主要为标题 三张图片,经过比照发现,大部分的新闻产品中,文娱新闻都是以这种方法布局的,为什么呢?文娱新闻中图片是较为重要的内容,也更能招引用户的留意,在列表中展现更多的图片能够满意用户的好奇心,也能进步用户阅览文娱新闻的功率,经过图片就能判别是否为自己感兴趣的内容。除了文娱新闻,社会新闻也选用这种布局方法。相同也是用图片来招引用户,或经过图片即可了解大约的新闻内容。

扩展

咱们对多图布局方法必定十分了解了,咱们每天都用的微信还有微博也是选用多图布局的方法,这种方法能够让用户短时间内了解一切图片的大致信息,利于用户快速阅览。许多旅行APP旅行攻略也选用多图布局的方法,旅行攻略中经常用许多的图片来展现某个旅行景点,用户往往更重视图片也更简单被美观的旅行图片所招引,和朋友圈微博的多图布局方法略微有些不同的是,旅行攻略会挑选一张最重要最招引用户的图片以大图方法展现,其他的图片则以小图方法展现,这种布局方法既能让用户看清楚重要图片的细节,也能对攻略的内容有个大约的了解。

图文列表是最常见的一种列表款式,一般用于更重视文字信息的科技、财经、时事政治等新闻,依照用户的阅览习气,左图右文会让用户先看到图片再阅览标题,假如你期望用户更重视图片信息,那么就能够选用左图右文的款式。

相同适用于更重视文字信息的新闻,与左图右文比较,将图片的优先级降到最低,让用户更重视新闻内容自身。除此之外,图片的巨细及标题承载的文字数量也值得考虑,下面的比如中,36氪的图片最小,给了标题更多的空间而且将标题加粗。36氪主要以科技新闻为主,关于这类新闻,用户更重视标题和新闻内容,完好的标题能够进步用户的阅览功率,经过标题就判别是否为自己感兴趣的内容。

扩展

大多数以文字信息为主的内容都是以左图右文/右图左文的信息展现。左图右文的款式看起来愈加规整,且用户阅览界面的次序一般呈F型或Z型,左图右文能让用户愈加流通的阅览列表,而右图左文使文字信息和图片信息分脱离,用户阅览列表时相对来说没有那么流通。但假如用户更重视文字信息而不是图片信息,则以右图左文的款式能使阅览功率更高。

和前两种款式大体一致,可是用了卡片来承载内容,而且将图片信息放到最大,用户在重视标题的一起,也能明晰地看到图片信息。现在来看,很少产品会运用这种布局,我觉得或许是由于卡片款式会让全体的切割性更强,下降了阅览的功率,可是卡片款式比较前面几种布局方法更规整,详细哪一种更好,还需求经过必定的数据做支撑。

扩展

大部分大图列表实际上也是以卡片列表的款式出现而小图加文字信息列表以卡片款式出现的比如并不是许多,我找到两个产品事例。第一个是一个收集了全世界艺术展馆/展览信息的APP,你也能够找到所在城市的艺术展,列表选用小卡片的方法,杰出展览姓名,一个页面中能够承载大约八个展览,进步用户阅览功率。为什么艺术展览列表的图片选用小图而不是大图来招引用户,我觉得有两个原因:1.产品更期望用户能到现场去看展览,所以没有选用大图出现更多细节,给用户留下可探究的空间。2.在没有了解相关布景前,经过图片很难了解到是什么展览,这种情况下文字信息比图片信息更有用。第二个产品是好奇心日报,将列表中的图片信息都被放到最大,让图片出现更多细节,但全体来看,会觉得”太满“,添加视觉担负。

本文总共剖析了五种新闻的布局方法,这些布局方法不仅仅运用于新闻列表,在以列表方法出现的界面中咱们都能看到。在做列表规划时,咱们需求剖析列表的内容和展现列表的意图,是要招引用户重视仍是要进步用户的阅览功率,依据详细的内容和意图再挑选适宜的布局方法。

总结一下五种布局方法:

第一种大图布局,假如期望要点杰出的新闻,或许期望引起用户的留意,能够运用大图布局方法。

第二种多图布局,假如是文娱新闻、社会新闻等以图片为主的内容能够运用多图布局方法,经过图片能够引起用户留意,并能够经过图片了解新闻的大致内容。

第三种左图右文,假如是以文字信息为主的新闻如科技新闻、财经新闻等,一起期望用户重视图片信息的时分,可选用左图右文的布局方法。

第四种右图左文,当更重视文字信息的新闻可选用右图左文的布局方法,标题的优先级最高,尽量坚持标题的完好性。第五种卡片列表,假如标题和图片平等重要的时分,可选用这种布局方法,将图片最大化。

作者:Joley,大众号ID:Microinteraction

引荐:检查最受欢迎的 301 个规划网站 → http://hao.shejidaren.com

沟通:结交更多有才调的规划师?请参加UI规划QQ群,与50000名规划师沟通规划。

热门文章

随机推荐

推荐文章