E5.03.2persistent sidebar width cost设计
常驻侧边栏挤占内容宽度
别名: 侧栏占宽 · content squeeze · 固定导航栏宽度
概念解释
侧边栏一旦常驻,它占用的就不是「一点边距」,而是内容区每时每刻少掉的一列宽度。常驻侧栏的宽度代价(persistent sidebar width cost)在表格、时间线、对照阅读和多栏编辑上最明显:导航一直在场,主任务却开始折行、出横向滚动、或把关键列挤出视口。这和「侧栏适不适合这棵树」是两件事——树可以很适合侧栏,同时这棵树的常驻形态仍可能让内容活不成。
机制
桌面布局是零和的:窗口宽度减去侧栏、工具条和滚动条,剩下的才是内容。侧栏按文字长度取值时,中文或德文标签会把这一列撑到 240–280 像素以上;内容区的表格列、代码行、画布标尺都按剩余宽度重排。用户真正在看的是内容,导航只在换地方时被用到,但宽度税是持续征收的。于是出现一种错位:低频切换的目录,占用了高频阅读的空间。
人会用缩小窗口、并排两个文档、或外接较小显示器来工作。这些真实宽度比设计稿更窄,侧栏却很少跟着降级,于是横向滚动从「偶尔」变成「默认」。把侧栏做成可拖拽宽度只能把决定推给用户,不能取消代价:拖窄到图标之后,辨认问题出现;拖宽则内容继续让步。
边界
超宽显示器、监控墙和专用于导航的第二屏上,常驻代价接近于零。内容本身就是窄栏(聊天、表单、设置页)时,让出一列甚至能让内容更居中、更易读。真正吃亏的是「内容有最小可读宽度」的视图:数据表、乐谱、对照翻译、设计画布。全屏沉浸(放映、视频)应当暂时卸下侧栏,而不是让导航税打进放映模式。触摸设备上侧栏常驻还会占掉拇指能用的左缘。
怎么落地
- 给主内容规定最小可读宽度(例如表格至少露出关键列、编辑器至少 N 个字符)。窗口落到该宽度以下时,侧栏改为可关闭或自动收成窄轨,而不是继续常驻。
- 默认宽度按短标签设计,长标签用两行或悬停全称,不要按最长文案把栏撑满。
- 允许用户关闭侧栏,并记住这个选择;全屏和演示模式必须能一键卸下导航税。
- 验证:在目标最小窗口宽度打开最宽的内容视图(表、画布、对照阅读),看是否出现横向滚动或关键列消失。出现即常驻代价大于导航收益。再统计一次会话里侧栏被点击的时间占比,对比它占用的像素占比,两者严重倒挂就该默认收起。