超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做( 三 )



超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
  1. 肩标;
  2. 含有标识符的肩标;
  3. 含有较大标识符的肩标 。
翻转:
翻转时 , 底端导航条能够显示信息或掩藏 。
  1. 往下翻转载入內容时 , 掩藏底端导航条;
  2. 往上翻转回顶部时 , 再次显示信息底端导航条 。

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
衔接:
提议应用淡出淡入的动漫在底端导航栏总体目标中间开展衔接 。横着健身运动(一侧到另侧)衔接将会代表着不会有的新项目中间的对等关系 , 或欺诈客户觉得她们能够应用手式在各一部分中间导航栏 。

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
应用淡出淡入动漫在主题活动和非主题活动底端导航栏总体目标间衔接转换 。

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
防止应用横着健身运动在主视图中间转换 。横着健身运动保存用以对等总体目标间导航栏 。
合理布局 1. 遮盖 底端导航栏能够被提示框、底端表格、抽屉柜导航栏、屏幕键盘或进行步骤需要的别的原素临时性遮盖 。他们不可在一切显示屏上永久性显示信息 。

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
“Radio”显示屏的检索作用开启屏幕键盘 , 临时遮盖底端导航条 , 直至检索步骤进行 。
2. 固定不动导航条 底端导航条总体目标选择项有固定不动部位 , 他们不容易翻转或水准挪动 。

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
防止应用可翻转底端导航栏 。
3. 视觉效果提升
超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
在移动终端(全屏)或平板上 , 底端导航栏总体目标能够保存竖向方式中应用的同样间隔 , 而不是分布均匀在底端导航条上 。

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
在移动终端(全屏)或平板上 , 底端导航栏到达站能够水准置放而不是折行 。在这类状况下 , 提议选择项分布均匀在底端导航条上 。
情况 底端导航栏总体目标能够是主题活动的、非主题活动的、聚焦点或被挑选 。
底端导航栏根据不透明度和文原本显示信息选择项什么时候处在激活状态 。情况用以显示信息按住、聚焦点和未挑选情况 。
非活动目标减少清晰度 , 活动目标则所有显示信息 。

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
  1. 非活动目标选择项;
  2. 主题活动选择项 。
如果不自始至终显示文本标识 , 则只显示信息活动目标的文本 。

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图
  1. 沒有文字的非活动目标选择项;
  2. 含有文字的活动目标选择项 。
实施方案 移动终端 标明:

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图

超实用!网页顶部导航栏设计方法总结 导航栏设计操作怎么做

文章插图


以上关于本文的内容,仅作参考!温馨提示:如遇健康、疾病相关的问题,请您及时就医或请专业人士给予相关指导!

「四川龙网」www.sichuanlong.com小编还为您精选了以下内容,希望对您有所帮助: