移动端内容组织的特点

因为移动端的宽高并不像PC浏览器那样固定,移动设备的物理大小也很受限,所以其内容的组织形式形成了自己的特点,其大致可以分为:列表,网格,轮播,卡片四种形式

列表

列表的形式非常常见,其通常会和标签栏一起使用,切换不同的标签呈现不同类别的列表,在移动端的交互中,列表的数据可以利用上拉加载以及下拉刷新来实时更新,单击列表项则多为进入该条目下的详情页

上图是淘宝的商品列表,这种形式可以比较直观的向我们展示当前内容的关键信息

网格

网格是将图标,略缩图等内容组织成规则的行列形式,点击后进入的下一级,内容通常为类目细节内容视图,网格可以很好的在有限的界面中组织数量较多的类目.

上图是淘宝的首页截图,利用网格,淘宝将不同类别的入口排列在首页中,并根据不同类别的重要性以及特点,将网格的尺寸做了适当的划分,使得不同入口有一个较合理的排列.这种方式在国内很多应用中均有运用.

轮播

轮播是一个在固定区域内,通过轮播显示切换的一个提示工具,大部分的轮播都是在固定的时间从头到尾将显示内容依次展示,不同的产品设计师会根据其交互特点设计其独有的显示方式.

上图是淘宝的banner,大部分的公司都会利用banner来做一些内容推荐或者商业广告的展示,通常采用的是图片的形式,每一项都是独立的内容,采用自动播放的形式自动切换到下一张.

卡片

卡片是随着移动端的发展,一种新型的交互方法,其本质是列表的升级改良,里面可以包含媒体文本,网页链接以及交互动作

上图是淘宝的精选卡片,其中封装了各类信息、图片以及交互控件,右下角可以点赞.像是微博等应用的卡片还可以实时播放视频及音频.