投稿
  1. 小新网首页
  2. 百科知识

线上产品的标题包含哪三个部分

科技攻略 • • 百科知识

我们在使用产品时，经常会用到标签或者标题进行查找，这样可以更快的让用户找到预期目标；清晰有效的标签也能一定程度上提高用户体验，用细节提升好感；本文作者分享了关于线上产品标题栏的解构与分析，我们一起来了解一下。

线上产品的标题包含哪三个部分

1）定位导航

一般情况下，标签栏常驻于各一级页面底部。选中标签明确提示用户当前所处位置，当用户想要前往其他一级页面时，只需切换底部标签即可。

线上产品的标题包含哪三个部分 二、整理标签栏分类

不同维度下，标签栏可以被分为多种类型；我们不妨从以下5个维度依次对标签栏进行分类，以便观察研究不同的分类方式下标签栏的不同特点。

线上产品的标题包含哪三个部分 1. 位置维度

常见的标签栏一般是吸附于屏幕底部，不随用户手势滑动而发生位置变化；然而也有一些产品为了切合用户的使用场景，做了一些位置上的调整，可能呈现悬浮状态或者会随着用户手势改变而发生位移。

线上产品的标题包含哪三个部分 线上产品的标题包含哪三个部分 线上产品的标题包含哪三个部分

线性图标：选中状图和未选中状态均是线性图标。

优势：造型耐看、有质感。劣势：只能用颜色或者透明度进行不同状态之间的区分，选中状态与未选中状态之间的差异相对较小（尤其在暗色模式下），可能会造成用户定位当前位置时发生偏差。 线上产品的标题包含哪三个部分 1. 布局方式 & 分割方式

大多数情况下，根据标签个数将页面宽度等分即可。对于非通栏的特殊标签栏，标签的宽度不受屏幕宽度影响，居中悬浮于视图底部；“分割”指的是标题栏和上方内容视图的分割。

如何建立分割感？方式有以下3种：

线上产品的标题包含哪三个部分 线上产品的标题包含哪三个部分

我们着重来讨论几种常见的标签点击反馈形式。

线上产品的标题包含哪三个部分 线上产品的标题包含哪三个部分

上面我们讨论的是从标签a切换到标签b的反馈情况。那么在已经选中标签a的情况下再次点击标签a，反馈情况又是如何？我们不妨分类讨论：

1）内容流页面

点击对应页面标签=回到顶部或者刷新内容（淘宝首页和微淘）；点击对应页面标签=直接刷新（抖音首页的下拉刷新只适用于第一个视频，之后的下拉手势是看上一个视频，点击标签栏的首页，可以直接刷新，解决了手势冲突的问题）。

2）非内容流页面（内容固定）

点击对应页面标签：无反馈（微信读书的书架页面）

线上产品的标题包含哪三个部分 线上产品的标题包含哪三个部分 六、总结

以上是我个人对标签栏相关的一些整理和总结，尽管标签栏作为一个相当基础的控件，其中也不乏非常多的设计细节值得深挖。

本文来自作者:科技攻略，不代表小新网立场！

转载请注明：https://www.xiaoxinys.cn/476767.html

赞 (0)
科技攻略科技攻略注册用户
0
上一篇 2023-02-27 16:16:00
下一篇 2023-02-27 16:23:00

相关推荐

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。