G2.05.3path cues on deep pages设计研究

深层页面需要路径而非仅当前项

别名: 路径指示 · ancestor trail · 深层不能只高亮

概念解释

高亮只能指出当前节点在平级里的哪一个。到了第三层、第四层,平级可能是「保修条款」「退货政策」「隐私」——高亮「保修条款」并不告诉你它挂在「支持 → 售后 → 政策」下面还是挂在某个商品下面。深层页面需要路径而非仅当前项:要把从某个稳定原点到这里的祖先链外化,人才能回答「我在哪一枝、上一级是谁、怎样横向走到伯父节点」。

路径是定向信息,不一定是面包屑这一种控件。侧栏里逐级展开并同时点亮祖先、标题区写出「支持 / 售后 / 保修」,做的是同一件事。

机制

深度把「当前项」的消歧范围缩小到一层的平级,却把「属于哪一枝」完全留给记忆。记忆在替换式钻取和深链直达里是空的。没有祖先链,人无法做两种必要操作:跳到父级去换一条子路,以及确认自己没有从推荐或搜索掉进另一棵树的同名叶。同名叶在大型站点很常见(多个产品各有「价格」、多个栏目各有「简介」),当前项高亮在这些叶上长得一样,只有路径能拆开。

面包屑研究常被当成控件研究;定向机制更早:You-Are-Here 图如果只标一个点、不画从入口到该点的走廊,人仍不知道怎么退到岔路。深层页的高亮就是那个孤点。祖先必须可点,路径才同时是位置和退路;只读的路径至少还能命名位置,但修错枝仍要靠浏览器返回,返回不一定落在父节点。

怎么研究

比较「仅高亮当前项」与「高亮加祖先链」在三层及以上任务上的定位与回退。

  • 范式:从搜索或外链直达同一叶,问「上一级是什么」并请人点到父级;树很深时用中段省略对照完整路径。
  • 自变量:有无祖先链、祖先是否可点、当前项高亮是否仍在。
  • 因变量:父级命名正确率、点击路径后是否落在父节点、与浏览器返回落点被当成同一件事的比例。
  • 方法论注意点:浅层任务(一层、两层)会显示路径「没必要」,那是深度不够,不是路径无用。多父级对象会让单条路径撒谎,要单独作为条件,不要并进「路径无效」的总账。

边界

一层或两层且当前项名称已经包含父级信息(「支持中心」本身就是顶层)时,再画路径是重复。向导用步骤条,不是祖先链。网状到达、没有唯一父级的对象,硬画一条路径会伪造层级,应改标类型或「也属于」。移动窄屏上完整路径放不下,需要中段省略,但不能省略到只剩当前项——那就退回了最低限度高亮。

怎么落地

  • 三层及以上的内容页,在高亮当前项之外展示从区域入口到当前节点的祖先,且除当前节点外均可点。
  • 路径画层级归属,不画本次怎么进来;搜索与推荐不要插进链中间。
  • 侧栏若已同时展开并点亮祖先,可以不再重复一条面包屑,但两者都没有就不算有路径。
  • 验证:从搜索进入一篇四层深的页,遮掉正文,问上一级叫什么并请点过去。说不出或点到浏览器意义上的上一页,这一页就还只有当前项,没有路径。

延伸

  • 同组G2.05.1 用户需要随时知道自己在结构中的位置 · G2.05.2 当前项高亮是最低限度的位置指示
  • 相邻E5.05 面包屑 · G2.01 层级导航 · E5.03 侧栏导航
  • 站内检索breadcrumb · ancestor trail · deep page wayfinding

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/G2.05.3