E5.05.2breadcrumb middle truncation设计
深层级需要中段省略策略
别名: 面包屑省略 · ellipsis in trail · 保留首尾
概念解释
层级一深,面包屑的整串祖先会超出可用宽度。中段省略(breadcrumb middle truncation)是把中间的祖先收成一个省略号,同时保住两头:根(整棵树的入口)和当前节点及其最近的父级(我在哪、上一级是谁)。被拿掉的是中段的定向价值较低的那些层,不是两端。
机制
人读面包屑时,最先用到的是当前段(确认自己在哪)和它左边那一段(最近的父级,最可能要点的跳转)。根提供「整棵树还在」的锚,避免路径看起来像一段无来源的碎片。中间那些层在定向中很少被点——它们既不是「现在」,也不是「立刻上去一层」,也不是「回总入口」。宽度不够时,砍中段对任务的损伤最小。
省略必须仍能还原。一个不可打开的「…」等于把那些祖先从树上删了;点开应列出被藏的中间节点,保持层级顺序,而不是跳到随机一页。从尾部截断(只显示前面几段)会切掉当前节点,定向失败;从头部截断(只显示后面几段)会失去根,路径变成悬浮的局部。两种截断都比中段省略更伤。
名称本身也会挤宽度。当前节点的标题往往最长,但它是定向的主语,不该被先省略成省略号;过长时在当前段内部用省略号收尾,并保证最近父级仍完整可读。
边界
只有三层或更少时不需要省略,硬加省略号会显得路径被损坏。移动宽度上即使三层也可能放不下,这时优先保证「父级 / 当前」,根可以进省略菜单,但不要只剩当前一段——那已经不是路径。屏幕阅读器需要能读到完整祖先链,视觉省略不能变成可访问名称里的信息丢失。动画或过渡若在每次导航时重排哪些层被省略,路径会闪烁,人无法建立稳定的「哪一段可以点」。
怎么落地
- 宽度不够时按「当前、最近父级、根、其余中段」的优先级保留;中段收入一个可打开的省略控件,列出被藏祖先。
- 不要从头部或尾部截断整条路径,也不要用横向滚动当主策略——滚动会把根或当前滚出视野。
- 当前段过长就在该段内部收尾,不要为了完整标题把父级挤没。
- 验证:在最窄布局打开最深的一叶,确认仍能看见根的入口(或省略里的根)、最近父级的全文、以及当前节点。点省略必须还原中间层且顺序不变。用辅助技术走一遍,完整链应仍可到达。