面包屑导航是一种辅助形式的导航，旨在帮助用户了解他们当前的位置，并能够轻松地向上返回。以下是基于小编的最佳面包屑设计原则：
1. 显示层次结构而非会话历史
面包屑应该显示网站的架构层级，而不是用户的浏览历史。显示所有用户的步骤只会导致混乱和视觉混乱。坚持只包含祖先页面的基本级别。如果子类别标签没有单独的页面，应避免将其包含在面包屑路径中。
2. 简洁易用
面包屑路径不应该太挤，否则用户将无法扫描标签并按下正确的链接。确保每个链接的触摸目标区域在移动设备上至少为1cmX1cm（44px*44px）。分隔线应模仿运动，在面包屑中，我们使用分隔线将用户引导到他们要去的地方，而不是他们开始的地方。
3. 遵循站点层次结构
面包屑应该只包含网站页面，而不是IA中的逻辑类别。面包屑路径中的每个节点都应该是一个指向主页的链接。如果一个页面有多个不同的父级，请在站点层次结构中标识到它的规范路径，并在面包屑路径中显示该路径。
4. 不要过度使用面包屑样式
面包屑构成辅助导航，因此它们不应该是用户进入页面时首先注意到的。避免使用会分散用户对主要导航和主要内容的注意力的华而不实、高对比度的颜色。此外，不要忘记遵守WCAG的颜色对比度要求，以使所有用户都可以访问。
5. 左对齐面包屑
左对齐的面包屑对于从左到右阅读的观众来说看起来很自然，而居中对齐看起来会偏离并损害易读性。这里的经验法则是遵循最常见的布局模式。如果将所有元素都对齐在左侧，面包屑也不例外。
6. 显示当前页面但不链接
在面包屑路径中，当前页面对应的面包屑不应该是链接。最后一个面包屑（表示当前页面）不应该是链接。这是因为重新加载活动页面只会令人困惑。
7. 控制面包屑层级
建议将面包屑导航控制在4个级别内，因为级别太多可能会导致网站上的面包屑被拖拽和繁琐。
8. 使用分隔符
使用分隔符区分不同级别是常见的做法，最常见的方法是使用比符号更多的符号（）。分区符号的使用并不严格，还有网站使用箭头（），书名号，斜线（//），等等。
以上原则基于最新的设计指南和实践经验，旨在帮助设计师创建出既实用又美观的面包屑导航。
原创文章，作者：Ur47000，如若转载，请注明出处：https://wyc.retuba.cn/13355.html
