双栏布局背后的取舍

首页采用左八右四的双栏布局，这个比例不是随意定的。左侧承担「广度」：焦点图加分类标签加两列新闻卡片流，覆盖足球、篮球等多个项目的资讯。右侧承担「深度」：热门讨论排行榜、联赛数据小表格、精彩视频网格，把讨论热度、数据概览和视频内容集中在一处。两侧的信息类型不同，读法也应该不同。

赛季进行到十一月，首页的信息量处在高位：欧洲五大联赛密集进行，中超收官，NBA 和 CBA 新赛季铺开。懂球帝把首页做成双栏而不是单列，就是为了让「扫资讯」和「看讨论」两个动作可以并行，不用来回跳转。

顶部滚动赛事卡片：先看结果再看过程

首页顶部是横向滚动的重要赛事卡片区，展示的是当日焦点比赛的结果或进行状态。这个区域的设计意图是「一眼扫完」，所以卡片上只保留最核心的信息：对阵双方和比分。滚动方向是横向，适合快速浏览多场。

  • 先看哪些比赛被放进这个区域：能上卡片的通常是关注度较高的对阵，这个筛选本身就传递了信息。
  • 再看比分与状态：卡片上的比分可能是最终结果，也可能是进行中的临时比分，需要结合状态判断。
  • 最后决定是否深入：感兴趣的比赛从卡片进入比赛页，比在新闻流里找相关报道更直接。

懂球帝把这个区域放在页面最上方，是为了让「今天有什么值得看的比赛」这个问题在打开首页的前几秒就有答案。

分类标签与新闻卡片流：按兴趣收窄范围

左侧的焦点图下方是分类标签，推荐、足球、英超等标签横向排列。标签的作用是把新闻流按主题切开，避免所有内容混在一起。默认停在「推荐」时，内容由编辑挑选；切到具体标签后，内容范围收窄，适合有明确关注方向的读者。

新闻卡片流是两列布局，每张卡片包含标题和占位图。两列的设计在有限宽度里提高了信息密度，但也意味着单张卡片的文字空间有限，标题通常只保留最关键的信息。读的时候建议先扫标题，再决定点不点进去，不要在两列之间反复横向比对。

懂球帝在卡片流里保留了图片位置，是为了让内容类型更直观：有图的卡片往往对应有现场画面或人物报道的新闻。这个视觉线索在快速浏览时很有用。

右侧三块内容：讨论、数据与视频

右侧栏的三块内容分工明确。热门讨论排行榜用带数字编号的列表展示讨论热度最高的六个话题，编号本身就是排序信息，越靠前讨论越集中。这块区域的价值在于「知道别人在聊什么」，而不是获取完整信息。

联赛数据小表格提供的是概览性质的数字，适合快速确认某个联赛的整体情况，不适合做深度分析。精彩视频是两列网格，四格布局，每格对应一条视频内容。视频块的浏览逻辑和新闻卡片不同：视频更依赖画面，标题只是辅助，所以这里的点击决策往往更快。

把这三块放在右侧而不是打散到左侧，是懂球帝首页设计上的一个取舍：左侧负责「发现」，右侧负责「停留」。想快速了解资讯就看左侧，想看看讨论热度和数据概览就扫右侧。安卓和苹果 iOS 客户端上的首页布局保持一致，浏览顺序可以通用。