## 一、转赞一个组件站的排版思路 在 [Bootstrap 组件实验室](https://bootstrap.wanxiangsucai.com) 看的时候，我注意到它每个组件都配了三个东西：效果、代码、说明。 这个三件套，恰好是资讯页最缺的。 ## 二、资讯页现在的问题 1. 一个标题加一大段文字，手机上要划很久。 2. 关键信息埋在段落里，读者找不到。 3. 列表页信息密度不统一。 ## 三、三个可以照搬的做法 **做法一：卡片化。** 一条资讯一张卡：图 + 标题 + 两句摘要 + 一行元信息（时间、来源）。 **做法二：颜色区分状态。** 新游可用三种状态色：预约中、已上线、已停服。 用户一眼就能归类。 **做法三：栅格对齐。** 两张图并排、三栏列表，都用同一套栅格。页面才不乱。 ## 四、一个具体的页面结构 ``` 顶部：本周重点（3 条卡） 中部：按状态分组列表 底部：历史存档入口 ``` 三段，不需要更多。 ## 五、为什么卡片比长文好 因为阅读是扫的，不是读的。 卡片能让人在二十秒内判断“这条我要不要看”。 ## 六、一个常见误区 卡片不等于大图。 一张图占半屏，反而降密度。图小一点、信息多一点更实用。 ## 七、一个建议 先把十条资讯做成卡，自己用手机看一遍。 如果看五分钟就烦了，结构就还没做对。 ## 八、一句总结 资讯页的好坏，不在于内容多少，在于能不能被快速筛。