宽而浅 | 设计结构 | 做产品
宽而浅
在同屏扫十个选项,比连续点四次进四层容易得多。前者是一次识别,后者是四次决策。
你会遇到的现象
-
某个功能确实存在,但用户说从来没发现过
-
三级以下的页面几乎没有访问量
-
为了让导航看起来清爽,把东西一层层往里塞
一级菜单五到九项这个范围,来自人的短期记忆一次能有效处理的信息量。少于五项通常说明这一层没必要存在,多于九项就该分组。
但真正的重点是深度。**每多一层,就会流失一批人。**这不是因为点击麻烦,是因为每一层都要求用户做一次「猜它在哪一类里」的判断,判断错一次就得退回来重来。
超出九个怎么办
做法什么时候用
分组但不加层 在同一屏内用分隔线或小标题把十几项分成三组。用户还是一眼扫完,没有多点一次
砍掉低频的 先看数据。一个月没人点的项,收进设置页比留在导航里好
加搜索 项数确实多且都需要(比如设置项),做一个能搜的入口比精心分类有效
改用矩阵 如果内容有多个属性、用户从不同角度找,用筛选代替分类
再加一层 最后才考虑。它看起来最整齐,代价也最大
第一种被低估了。视觉上分组和结构上分层是两件事——前者不增加用户的操作步骤,后者增加。
真正的重点不是宽度,是深度
一级
全部人
二级
三级
四级
几乎没有访问量
流失不是因为点击麻烦,是因为每一层都要求用户做一次「猜它在哪一类里」的判断——猜错一次就得退回来重来。
视觉上分组 同屏内用小标题分成三组,一眼扫完,不多点一次
结构上分层 看起来最整齐,但每个人都要多做一次判断
这两件事经常被当成同一件,其实差别就在那一次点击。面包屑也解决不了深度问题——它只回答「我在哪」,用户在第四层不迷路,不代表他愿意每次都点四下。
已经太深了怎么改
-
**把高频的提上来。**看数据找出访问量最高的三级页面,给它们加一个一级或二级的直接入口。
-
**用搜索抹平深度。**好的搜索能让层级失效,用户直接跳到目标。这也是层级实在压不下去时的兜底方案。
-
**做「最近使用」。**把用户上次去过的地方放在首屏,绕开层级本身。
-
**合并只有一个子项的层。**一个分类下面只有一项内容,这一层就是纯粹的浪费,直接合掉。
面包屑不能解决深度问题,它只解决「我在哪」。用户在第四层不迷路,不代表他愿意每次都点四下。
接着看
四种导航形式 一级项超过九个的时候,换一种导航形式往往比加层更好,比如改成左一级顶二级。
分组与命名 分组分得好,宽也不乱。乱的原因通常不是项数多,是相邻两项看起来没有区别。
一屏一件事 宽而浅说的是导航结构,一屏一件事说的是页面内部。两者一起才不会又宽又乱。
