淘宝首页导航设计之要点总结

当买家进入你网店首页的时候，看到这么多产品，如何快速找到自己想要的产品呢，这就要导航给予恰当的引导了。很多卖家说了，导航还不简单，将自己的类目都展现出来，一看很明了，当然这样也要考虑到操作的可行性和美观度。今天我们就一起来聊一聊淘宝首页导航设计应注意的问题。

认识导航≠分类

现在有些卖家都有一个误区，以为导航就是分类。其实不然，导航指的是能让买家快速查看店铺某些页面的功能型按钮，和分类属于包含与被包含的关系，可以理解为分类是导航的一种。所以在优化导航的时候，绝不仅仅是把分类重新整理下就OK，而是应从所以导航入口入手，来进行优化。

通常按位置可以将导航划分为三个区域：

顶部导航：商品分类、搜索栏、自定义页面（品牌故事、会员专区、购物须知等）

左侧栏：商品分类、收藏按钮、在线客服、热销热藏、商品推荐、其他超链（手机店铺、加入帮派等）

自由导航：图片（文字）+超链（可以指向某一分类或自定义页面，多数用于活动，可摆放在页面的任意位置）

顶部导航：隐形推荐

在分类页面上，给商品分类的方式很多，需要记住：“舒服和准确是比漂亮更高层次的艺术”。

常见商品分类方式：

感性分类：按风格分类（日韩风、欧美风）、按活动划分、按感官划分（显瘦、白嫩MM区）

卖家可以根据自身产品的特性，以及受众的特性着重细化某一种分类，但其他分类形式也应该有。比如，男装店铺的受众是男性，通常男性购物往往带有明确的目的性，只打算买一个商品，很难对其他品类也感兴趣。所以理论上来讲应该把这个店铺的分类做成理性类型的。但是商品受众群体为男性，并不代表所有入店的访客中就没有会按照“牛仔控、潮流范”标签去查看商品的消费者。其实通过数据显示，搜索男性衬衫的男女比例约为6：4。其中还囊括四成女性访客，所以我们在设置分类的时候应该设置的十分全面，可以偏重某一个点但不能忽略其他。

左侧栏：推荐利器

商品分类、收藏按钮、在线客服、热销热藏、商品推荐、其他超链（手机店铺、加入帮派等）这些都可以是左侧栏的内容，其实和顶部导航一样，左侧栏早已被买家所熟悉，很多买家已经习惯从左侧栏寻找信息。但随着店铺模板升级，现在很多店铺的左侧栏渐渐的少了，不少卖家为了页面的美观而将左侧栏遗弃到了角落。其实，追求美丽的事物本身并没有什么不好，但如果没有超强的页面布局能力，建议还是保留左侧栏，毕竟浏览器下拉的浏览模式决定期存在的必要，因为只要买家下拉网页，左侧栏就会逐渐的展现在买家面前。

合理布局左侧栏

在结构上建议卖家在设计的时候，将商品分类放在第一屏就可以看到的位置。而热销、热藏宝贝展示建议放到左侧栏的底端。配“回到顶端”按钮能方便不同习惯的买家快速查看，从而增加店铺访问深度，提升销售概率。如下图：

图上文字：为了配合店铺设计，左侧栏可以适当下移，但一定要在第一屏出现，目的和WP7的界面原理相同，是要告诉买家：这里有你想要看到的东西，即便你向下浏览也能快速查看分类等信息。

左侧栏内外应一致

很多淘宝卖家是不知道首页的左侧栏和详情页的左侧栏不是同一个模块，偏偏又有很多的店铺首页左侧栏和详情页左侧栏布局也是完全不同。这样的设置，其实是错误的，容易造成用户体验上的不快，挑战买家耐心的做法是不理智的。

自由导航：跳转桥梁

首先解决一个基础问题——什么是自由导航？顾名思义，自由导航是指能在店铺任意位置摆放的具有导航作用的按钮或图片。自由导航其实有两种形态，一种是指向活动页面或活动分类的大小banner，一种是直接指向某一分类的button。如下图：

除了分类button，促销banner也可以算作是自由导航的一种。现在越来越多的店铺选择去掉首页左侧栏，买家在浏览这种店铺的时候下拉一点网页便看不到导航了。点击TOP按钮可能会面临重新浏览一遍刚才浏览过的内容，不点TOP按钮又有无法查看分类的问题，所以这种页面布局的情况下自由导航的作用就不言而喻了。不仅图片能起到展示、推广、传递信息的作用，还能起到页面切换的功效。

自由导航的禁忌

不要过于浮夸。导航图片以传达信息为重，其实买家要的是快速理解图片内容，而不是看店铺在炫耀美工技巧。

案例指导：如上图，店主主要表达的是“秋冬马甲”这一内容，而图中视觉权重最高的是两个男模和一堆看起来没有任何用处的英文字母，造成的后果是只会吸引到对图上两款马甲有兴趣的消费者点击，而对这两款不感兴趣的消费者则会认为是宣传海报而已，起不到引导作用。

不要有某张图片过于抢眼。根据视线律动研究表明，在一个页面中如果有一区域视觉权重过强（如，通体灰色调，突然有张红色的图片）会导致浏览者的视线不稳定或在权重较高的区域来回浏览，无论是哪一种都不是我们想要的。

不要太多类型的促销活动。其实这个不仅和导航有关和营销也有关系，同时出现了太多形式的促销活动往往会造成买家的不解，引起买家的浮躁心理，从导航的角度会造成传达不明确的后果。