Sidebar 侧边栏
/SIDE-bar/ · noun · 导航类模式 · #095
页面左侧或右侧、紧挨主内容的一列。放在左边时通常是导航（后台、文档、管理工具）；放在右边时通常是相关内容——筛选条件、目录、广告或「相关推荐」。
别名：侧边栏、侧栏、侧边导航、左侧菜单栏。
你可能会这样叫它
- “网页左边的菜单”
- “网站侧面的那一栏”
- “后台左侧的导航”
- “内容旁边的一列”
- “侧边菜单”
……它的名字是 侧边栏（Sidebar）。
常见问题
侧边栏和顶部导航栏怎么选？
主栏目只有几个、一行放得下，就用顶部导航栏；目的地多或者有多层分组——后台、文档、邮箱——就用侧边栏，因为一列可以往下延伸。很多产品两者都用：顶部细细一条放账号和搜索，左侧边栏放各个栏目。
代码里叫什么
| Web (HTML / ARIA) | <aside> <nav> 相关内容用 aside；侧边栏是导航时用 nav |
|---|---|
| SwiftUI | NavigationSplitView |
| UIKit | UISplitViewController |
| Jetpack Compose | NavigationRail PermanentNavigationDrawer |
| Android (Views) | NavigationRailView NavigationView |
| Flutter | NavigationRail Drawer |
复制给 AI 编程工具
在布局左侧加一个用于导航的侧边栏：固定宽度的一列，链接分组并带图标，当前页高亮，还有一个按钮可以把它收起成只显示图标。宽屏时一直显示在内容旁边，窄屏时变成从菜单按钮打开的抽屉。使用带标签的 nav 地标，并用 aria-current 标出当前链接。