小屏阅读|菜单关掉之后,链接还应能点
手机端最重要的不是塞进更多入口,而是确保打开、关闭和继续点击都清楚可靠。
顶部保持三段式
左侧是菜单按钮,中间显示品牌标识,右侧保留注册入口。横向核心导航在手机上隐藏,避免文字挤压或换成两行。375px、390px与430px宽度下,都应保持三段内容不重叠。
遮罩只在菜单打开时出现
菜单未打开时,遮罩必须处于隐藏且不能接收点击;打开菜单后才显示并允许点击关闭。关闭动作会同时移除抽屉、遮罩和页面锁定状态,因此卡片链接、注册入口和底部快捷都应立即恢复。
- 点左上“菜单”打开抽屉。
- 点遮罩、关闭按钮或按Esc均可退出。
- 退出后直接点击正文链接测试是否恢复。
窄屏下优先保留可点击性
手机页面会减少横向导航数量,但不会把重要链接藏在不可见区域。顶部保持菜单、品牌和注册入口,底部保留四个快捷项,正文按正常页面向下滚动。这样即使不打开抽屉,也能完成主要查阅。
若用户刚打开菜单后立即关闭,遮罩应同步退出,不会留下一个透明层拦截后续点击。这个状态比动画效果更重要,因此页面进入时不会预先启用遮罩,只有菜单真正打开后它才接收点击。