菜单Menu
产品资料菜单展开了,为什么还不能说用户已进入产品页?
菜单把可去的页面或可执行的命令组织成一组选项。要先区分网站导航和应用命令:导航通常使用有地址的链接,命令使用按钮;普通网站的展开导航不必声明为 ARIA menu,也不自动具备应用菜单的方向键行为。
先把去处或动作列出来,再让人选。把目录打开,只是看见选项;点某个去处才会换页。
商场楼层牌列出去处,办事窗口的操作单列出能办的事。两张单都叫菜单,但选择之后发生的事情不同。
类比到这里为止:网页必须让链接与动作能被键盘和辅助技术辨认。给同一外观贴上 menu 标签,不会自动补齐交互。
独立站按产品、应用、资料组织稳定入口,资料组展开后再进入具体页面。CRM 的归档命令则直接影响一个对象,需要另一套明确的操作规则。
先判断选项的责任
- 去另一页
- 用实际链接,地址能复制,新标签能打开。
- 展开分类
- 按钮负责显示下级入口,并表达当前是否展开。
- 执行命令
- 按钮表达具体动作,结果和权限要独立核对。
普通导航不必装成应用菜单
用 nav、列表、链接和展开按钮,就能构成普通站点导航。按 Tab 进入链接、Enter 激活;展开按钮通过 aria-expanded 说明状态。若声明为应用 menu,就需要承担相应的菜单键盘约定。
下方菜单链接会打开本站已有页面。展开只改变选项可见性;Escape 可以收起并回到展开按钮,移出这组导航也会收起。没有执行查询客户或归档命令。
继续看项目应用与交付检查
菜单 在项目中负责什么
- 什么时候用
- 用户需要在多个页面、栏目或当前对象的动作之间选择时。
- 它解决什么
- 将大量入口组织成可理解的分组,让用户找到下一步而不必记住所有地址。
- 它不负责什么
- 菜单可见或高亮不等于页面已经载入;隐藏某个命令也不是服务端权限校验。分组不能把常用入口藏到无法发现的位置。
- 放进真实项目
- 后台菜单把线索、产品、报价、资料库和设置分成稳定入口。
菜单把一组可预测的去向或命令组织起来,当前所在位置要清楚
学习站的知识库、微课、练习和路线属于全局导航;一条询盘的分配、导出、归档则属于记录操作菜单。
- 01
不要在同一组里混淆跳转与高风险动作。
- 02
使用用户熟悉的任务名称排序。
- 03
控制可见项数量并让键盘完整操作。
先分去处与动作,再安排分组和键盘。
容易混淆的地方
菜单是选项组织;导航栏是承载位置;Dropdown 是展开形式。站点导航和应用命令可用不同键盘模式。
站点里的“产品资料”按钮展开了三个普通页面链接。下面哪种实现与任务一致?
你可以这样告诉 AI Agent
我在处理这件事:后台菜单把线索、产品、报价、资料库和设置分成稳定入口。请以“菜单”为主线,先说明它在这里负责什么、不负责什么;再列出必要输入、建议动作和可验证结果。用外贸独立站的业务语言回答,不确定的信息标为待确认。
内容依据与延伸
本站用原创中文解释把专业概念映射到外贸独立站;定义和机制继续以官方资料为准,业务例子再回到 外贸独立站询盘优化实战 验证。
本站整理说明:原创整理:Web 开发、产品设计、AI 协作与外贸独立站实践