UI 设计语境 · 主题 / Navigation & Orientation
导航与方向感
通过全局导航、局部导航、面包屑和当前状态帮助用户定位。
Identity · 身份
- 子类型
- UI 设计语境主题
- 父级类目
- Web 界面设计
- 层级
- UI 设计语境 · 主题
What · 是什么
- 定义
- 通过全局导航、局部导航、面包屑和当前状态帮助用户定位。
Why · 为什么
- 核心问题
- 用户在哪里、从哪里来、还能去哪里?
- 分类目的
- 降低迷路成本,支撑探索和回退。
Where · 在哪里
- 适用场景
- Search Results Page、Documentation Shell、File Browser、Inbox、Notification Center Page、Footer Navigation、Global Navigation、通用 Web 设计框架、Header、Navigation
Lifecycle · 生命周期
- 状态
- 草稿
所属 UI 领域与横向 Web 关系
关系来自本地关系表,并包含反向关联。
- Footer NavigationFooter Navigation应用于
页面底部承载补充导航、法律信息、联系入口和站点范围说明的区块。
- Global NavigationGlobal Navigation应用于
跨页面稳定存在的主要导航,帮助用户理解站点范围并进入核心区域。
- Breadcrumb TrailBreadcrumb Trail反向 · 应用于
显示当前页面在信息架构中的位置,并提供返回上级的路径。
- Footer NavigationFooter Navigation反向 · 应用于
在页面末端提供次级导航、法律信息、联系入口和补充行动。
- Global NavigationGlobal Navigation反向 · 应用于
跨页面提供品牌、一级目的地、账户和全局操作的稳定入口。
- Pagination / Load MorePagination / Load More反向 · 应用于
将较大的结果集合拆分成可控制的批次,并让用户继续浏览。
- Search & FilterSearch & Filter反向 · 应用于
帮助用户在内容集合、工具数据或资源目录中定位目标。
- Search Suggestions / CommandSearch Suggestions / Command反向 · 应用于
在用户输入过程中提供建议、命令、历史和可直接执行的结果。
- Store LocatorStore Locator反向 · 应用于
让用户按位置、服务或库存查找最近的门店、机构或服务点。
- Web 界面设计Web Interface Design属于
围绕浏览器环境组织页面架构、导航、内容、区块、组件、转化和性能的界面设计领域。
- Back LinkBack Link反向 · 应用于
返回上一级或父级页面的导航链接。
- Skip LinkSkip Link反向 · 应用于
跳过重复导航、直接进入主内容的辅助导航链接。
- App BarApp Bar反向 · 应用于
结合品牌、导航、页面标题和全局操作的应用顶部栏。
- Bottom NavigationBottom Navigation反向 · 应用于
在移动或窄屏界面中提供固定的一级目的地切换。
- MenubarMenubar反向 · 相关
提供桌面应用式的顶层菜单组和键盘导航。
- Navigation MenuNavigation Menu反向 · 应用于
组织站点、产品或应用的主导航及其子级入口。
- Service NavigationService Navigation反向 · 应用于
在政府、机构或大型服务站点中保持全局服务入口的导航。
- Documentation ShellDocumentation Shell应用于
以侧边导航、正文、目录、版本和搜索组成的文档阅读模板。
- File BrowserFile Browser应用于
浏览、搜索、排序、选择和管理文件与文件夹的工作区页面。
- InboxInbox应用于
以列表、详情、筛选、已读状态和批量操作处理消息或任务的工作区。
- Notification Center PageNotification Center Page应用于
聚合通知、筛选、已读和跳转动作的页面级模式。
- Search Results PageSearch Results Page应用于
搜索、筛选、排序、分页和结果反馈组成的发现型页面。
- BreadcrumbBreadcrumb反向 · 属于
显示当前页面在站点层级中位置的路径组件。
- Footer NavigationFooter Navigation反向 · 属于
页面底部承载补充导航、法律信息、联系入口和站点范围说明的区块。
- Global NavigationGlobal Navigation反向 · 属于
跨页面稳定存在的主要导航,帮助用户理解站点范围并进入核心区域。
- HeaderHeader应用于
页面顶部承载品牌、全局导航和主要操作的容器组件。
- NavigationNavigation应用于
提供一组有层级关系的页面或功能入口的组件。
- PaginationPagination反向 · 属于
将长列表分成多个可导航页面并显示当前位置的组件。
- Related LinkRelated Link反向 · 属于
带有上下文说明、指向相关内容或下一步任务的链接组件。
- 通用 Web 设计框架Universal Web Design应用于
一个不绑定真实网站的 Web 界面知识框架,用页面、区块、组件、模式和原则描述 Web 设计对象之间的关系。