纵向滚动时表头需固定
别名: 表头吸顶 · 冻结表头 · 纵向滚动表头 · freeze header
概念解释
表格向下滚时,列的含义写在表头那一行里。表头跟着内容一起滚走,单元格就变成一排没有单位的数。固定表头(sticky table header)让列名留在视口顶部,滚动只移动记录。它保的是「这一列是什么」,不是分组标题,也不是行的身份——那两件事由别的结构负责。
机制
读单元格是一次「抬头对列名、低头读值」的短循环。表头在视口里时,循环的上半段是一次短扫视;表头滚出之后,列名只能靠记忆。列一多、列宽一相近,记忆中的列顺序很快错位,尤其是连续几列都是数字的时候。固定表头把列名从记忆里拿回到视野,比较才能继续沿列进行。它必须叠在内容之上而不是占用新的滚动空间:若表头只是「看起来没动」但实际把内容顶下去,视口里可见行数会少掉一行,比较窗口被偷走。表头与第一行内容之间还要能分清谁是标签、谁是数据,否则吸顶的那一行会被当成又一条记录。
怎么研究
用多列数字表做比较任务,一组表头随内容滚动,一组表头固定,记录列错配(把 B 列的值当成 A 列)、回滚到顶部确认表头的次数、以及完成时间。自变量:列数、列是否外形相似、视口高度。因变量:列身份错误、回视到原表头位置的次数。眼动应显示无固定条件下出现周期性的向上长扫视。不要在只有两三列、列名还印在每条单元格里的表上做——那种材料测不出表头消失的代价。
边界
整张表一屏装得下,表头本来就不会离开,固定与否无差别。把表头做成每条记录都重复的行内标签(窄屏卡片化之后),列名已经跟值绑在一起,再吸顶一层会重复。横向滚动的表若只固定表头、首列仍滑走,行的身份会丢——那是另一条约束。表头很高(多级表头、带筛选器)时,固定会吃掉大半视口,比较窗口比记错列名更糟,需要改成更矮的单行表头或让筛选器另行展开。打印页没有「滚动」,固定没有对象。
怎么落地
- 让表头在表格的滚动容器内固定,而不是跟着整页走;整页吸顶会把表头带到无关板块上。
- 固定后的表头要盖住从它下面滑过的单元格,并与数据行在底色或字重上可分。
- 多级表头只固定当前仍有意义的那一级,避免三行表头永久占住视口。
- 验证:滚到表的中部和尾部,遮住记忆问「这一列是什么」。答错或要滚回顶部才能答,就是表头没在工作。