Discuz! Board

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 85|回复: 0

烦 在较小的屏幕上长面包屑

[复制链接]

10

主题

10

帖子

32

积分

新手上路

Rank: 1

积分
32
发表于 2024-2-14 13:03:01 | 显示全部楼层 |阅读模式
路径存在缠绕多行的风险 - 在已经拥挤的小页面上消耗宝贵的空间。 面包屑链中的换行符也会描绘出令人困惑的画面或者无意中歪曲站点的架构。 使面包屑变得小而不显眼的通常策略在移动设备上会出现问题因为痕迹可能会变得难以阅读和操作。将路径缩短为仅一个碎屑将其指向上一个祖先页面的一个级别可以为此提供解决方案。 面包屑导航格式 当字体大小明显小于周围文本的字体大小时面包屑往往效果最好因此痕迹不会变得引人注目。 如前所述每个面包屑通常由一个符号分隔。这些分隔符通常显示为“/”或“>”但不太常见的符号的功能大致相同。这更多的是一个审美决定。 除了与当前页面相关的面包屑之外每个面包屑都应该是一个链接。一个无处可去的链接对任何人来。

说都是没有用的。为了避免用户浪费精力某种强调通过下划线或颜色可以突出显示“当前页面”碎片不值得点击的事实。 当代 UI 面包屑不再仅仅以链接链的形式出现。以下是一些创新鼓舞人心的面包屑示例。  UI 面包屑的四个鼓舞人心的例子 守护者 英国新闻巨头《卫报》提供了时尚的面包 意大利电报号码 屑设计让人产生阅读大报的感觉。这些面包屑不像迷宫中的纱线痕迹而是显示网站的页面层次结构而不是用户的浏览过程。 面包屑约定被礼貌地忽略因为当前页面以粗体强调位于其同级页面之间而不是位于列表末尾。这表明索引或内容列表。 监护人网站作为 UI 面包屑的示例 来源卫报 阿迪达斯 正如您在这里所看到的阿迪达斯在路线的开头加入了“返回”面包屑使用户可以轻松地追溯他们的脚步。这创建了属性和基于路径的面包屑的不。



寻常的混合。 adidas 网站作为 UI 面包屑的示例 来源阿迪达斯 微软Windows 基于位置的面包屑的一个典型示例是 Microsoft 的“面包屑栏”它是导航 Windows 各个版本的重要工具并且在许多方面是大多数现代面包屑的灵感来源。 以 microsoft windows 作为 UI 面包屑的示例 来源微软 水石 与标准的面包屑智慧相反水石决定展示通向这部经典小说的所有可能路径。结果无论好坏是三个堆叠的基于属性的面包屑路径。 Waterstones 网站作为 UI 面包屑的示例 来源水石 虽然可能会让人不知所措但这种多层方法可以为导航包含大量重叠类别的 UI 提供详细指导。  最后的想法 UI 面包屑是导航的补充形式可帮助用户到达界面结构内的页面。它们对于帮助多层分层网站中的导航特别有用但在单级网页上毫无意义。 通常路径中的。

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|DiscuzX

GMT+8, 2025-9-15 13:49 , Processed in 0.107922 second(s), 18 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表