拆解淘宝首页粗糙的设计细节

1月 31, 2023 发表于: 视觉设计. 评论

前言：用了淘宝那么久，你知道它有哪些不足吗？今天文章盘点淘宝首页的一些粗糙的设计细节，你会发现京东反而比他更好。

最近突然想起要买一个东西，刚好手就放在键盘上，刚好手机又有点远，我就用浏览器打开了淘宝。

当我在搜索结果页点击商品时，突然被告知要登录：

着急想要了解商品的我……没有登录而是新开标签页进入了京东。

找到想要的商品后，我登录下单了。

事后我仔细对比了一下，发现淘宝的网页处处显得「敷衍」。反衬之下，京东显得专业多了。

这就让我有点惊奇了。

2021年阿里巴巴旗下以淘宝为代表的淘系零售电商占据过半市场份额（52%），是京东（20%）的两倍不止。

在使用手机端网购时，我也是向来更喜欢淘宝而不是京东的。

而且在互联网从业人员眼中，阿里属于一线大厂，京东一般认为是二线大厂，前者更能吸引顶尖人才。

为啥淘宝的网页端还明显不如京东呢？

如果只是稍逊一点也就算了，关键淘宝网页端有很多迷惑的设计点。

我们就以首页为例分析一下：

大片无效模块

首先，现在应该没那么多人有耐心愿意先登录再使用吧，登录模块占用那么大的位置挺没必要的。

而且还没登录，就展示那么大的宝贝收藏、买过的店、收藏的店……感觉没啥意义。

然后 banner 下的第一个模块居然是猜你喜欢（个性推荐）？

我还没登录，显然猜不准，这个模块基本也废了。

然后那个 banner，我翻了一下，都是什么贵就卖什么……切中普通用户需求的几率也是相当之低。

也就是说，这整个首页，大半的空间都是无效的。

作为业内人士，我猜，设计成这样，可能是因为设计师压根没想到大部分访客可能没登录？

对比一下，京东的登录模块小很多，banner 内容更有吸引力，而且第一个模块是秒杀活动（虽然露出不多）。

双重悬停态

Banner 左侧的这个分类导航很奇怪，鼠标移上去是整行高亮，而且每行一个图标。

刚开始，我还以为每行的 3 个链接点过去都往一个地方跳转，结果发现不是。

仔细一看，每个链接有单独的下划线悬停样式！

不但如此，商品卡片也有 2 个悬停态！

鼠标放在卡片上时，背景色和边框变一下；然后鼠标放到商品名称上时，商品名称单独高亮了。

点击这两块区域跳转到不同的地方吗？

不，没有差别。

对比一下，京东就正常很多：

粗糙的细节

首先，很明显的是淘宝这个 banner 的箭头不但上下没对齐，而且里面的图标也没居中，强迫症看着闹心。

然后淘宝大量使用灰色卡片，却不把间距统一一下。

虽然一般用户看不出来，但这应该是基本的设计规范吧？

对比一下，京东的边距就整齐多了：

梦回上个世纪的消息通知

淘宝首页这个消息通知我很想吐槽，等了好几条，几乎没有一条能引起普通消费者的兴趣。

京东也做了消息通知，虽然字显示不全也不滚动，但好歹内容稍微有用了一点：

不登录看不了商品

前面也说过了，虽然淘宝能够直接搜索，但是即便搜到了，也必须登录后才能查看。

刚有点兴趣，还没确认要买就把人拦下，这显然不明智：

对比一下，京东会等到用户决定要买的事后，再提醒登录：

内容太少

往下一翻，淘宝 banner 下面只有一个模块，还都是猜不准的猜你喜欢：

京东的模块就丰富多了：

为啥淘宝在网页端摆烂？

以我自己在大厂工作过的经验来说，造成这个现象的原因，十有八九是网页端数据占比太低，团队不重视。

就算以目前这个状态，淘宝网页端的访问量都未必比京东网页端低。

淘宝如果愿意把网页端稍微捯饬一下，数据量肯定能明显超过京东网页端。

但淘宝手机端太赚钱了，所有资源都倾斜过去，其它端的资源还不如二线厂商。

大厂的资源分配的马太效应比很多人以为的更加严重。

凡有的，还要加倍给他，叫他多余；没有的，连他所有的也要夺过来

圣经《新约·马太福音》

可让网页端这样摆烂多少也是个隐患不是？

这么看还是拼多多聪明，既然懒得管网页端，就干脆不做了：

作者：设计师ZoeYZ
来源：体验进阶（ID：Advanced_UX）

赞助商链接