设计改版为什么淘宝要给Tab加个橙色背景?

产品: 淘宝猎人: 龙爪槐守望者观众: 1.2w人 时间: 2025-10-19

淘宝

与「淘宝」有关的细节还有 138查看全部

我也有新发现 我要投稿
为什么淘宝要给Tab加个橙色背景?为什么淘宝要给Tab加个橙色背景?

细节描述

龙爪槐守望者: 你可能每天都在用淘宝,但大概率没注意到,它首页顶部的Tab导航栏,已经悄悄变脸了。 淘宝之前版本Tab采用了相对平淡的视觉样式,选中状态的标识不够醒目,各个标签之间的层次感较弱。而新版设计做了3个关键调整: 第一,选中状态的视觉强化。新版Tab在选中时,采用了橙色高亮背景搭配白色文字的方案,形成了强烈的色彩对比。对比旧版只是简单的文字颜色变化,新版的视觉冲击力明显更强。 第二,未选中状态的层次优化。新版将未选中的Tab标签保持在浅色背景上,文字使用较深的灰色,与选中状态拉开了清晰的视觉距离。这种处理让用户可以快速区分"当前位置"和"可去位置"。 第三,整体布局的紧凑性提升。新版Tab的间距和尺寸经过了精心调整,既保证了可点击区域的舒适性,又让整个导航栏看起来更加整洁有序,减少了视觉干扰。

8.742人评分
收藏 4
分享细节海报

发表评论 为下方 1 条评论点赞,解锁好运彩蛋

{{ moreBtnTxt }}

你可能还爱看

支付宝端午特别设计:为什么弧形Banner会比直角更具吸引力?
支付宝

沉浸式设计支付宝端午特别设计:为什么弧形Banner会比直角更具吸引力?

猎人 - 龙爪槐守望者9.0

支付宝首页的端午主题 Banner 采用清新蓝色为底色,与上方快捷功能区完全统一,通过色彩延续自然消除了模块边界,形成了统一的视觉整体。其弧形底部边缘(区别于传统矩形直角)进...

查看详情

#banner#沉浸式设计#视觉设计

「淘宝」增加「领券购买」按钮,再也不怕忘记领劵了
淘宝

设计逻辑「淘宝」增加「领券购买」按钮,再也不怕忘记领劵了

猎人 - AmberDu小白0.0

「淘宝」的商品购买详情页增加了「领券购买」的按钮,不仅会将券后价格直接显示在按钮上,点击按钮还能直接领券进去付款界面,免去了之前版本买家需记得自己手动领券再付款的麻烦。此外,...

查看详情

#人性化#信息呈现#易用性

「即刻」App是如何巧妙使用空间有限的Tab栏的?
即刻

手势交互「即刻」App是如何巧妙使用空间有限的Tab栏的?

猎人 - AmberDu小白0.0

「即刻」App团队将长按底部Tab栏图标的手势操作,设计成了一些使用频率较高功能的快捷键。点击「+」按钮会呼出发布新动态的界面,而长按「+」则是开启拍照功能;正常点击「通知」...

查看详情

#Tab#交互手势#即刻