1.7 列表页

在使用软件搜索或点击分类查找后会出现结果页面。结果页面通常会以列表的形式来体现，包括单行列表和双行列表两种，展示的内容为“图片+名称+介绍”。另外，还可以用时间轴和图库的形式来设计列表页。列表页的设计虽然简单，但却困扰着不少设计师。总体而言，设计列表页时，需要遵循这些原则：留白空间要张弛有度，且要有亲疏之分；对齐的方式要规整；粗细元素的组合要有节奏感；需要重点突出的元素的颜色要明亮；列表的层次感要分明；在用虚实方式进行结合设计时，要保证实的对象在前，虚的对象在后。

1.7.1 单行列表

大多数消费类产品的结果页面都会以单行列表的形式进行展示，左边为图，右边为文字信息、评分和价格等，这样的展示方式易于用户阅读，如图1-19所示。图片能够诱导用户进行点击，文字则用来解释商品。

图1-19　单行列表页

1.7.2 双行列表

双行列表页的表现形式更加节省空间，每个卡片的排布方式为上面是图片下面是文字，可以让页面显得更为饱满，如图1-20所示。

图1-20　双行列表页

1.7.3 时间轴

为了加强内容的前后时间关系，通常会使用时间轴的方式来设计列表页，这样的表现形式能够更好地凸显每条信息之间的关系，让用户阅读起来更有条理性，如图1-21所示。时间轴列表页的展示方式为左边是时间轴上各节点，右边是与时间节点对应的内容。

图1-21　时间轴列表页

1.7.4 图库列表

图库列表页主要出现在相册或图片编辑类App中，其中相册的图库列表页有文档和图片平铺两种显示方式。为了让分布更为均匀规整，图片通常会采用正方形的形式进行排列，如图1-22所示。

图1-22　图库列表页