购物车研究——AE.com的另类底部迷你购物车对信息量的扩展

    迷你购物车，即Mini Cart。

    迷你购物车是购物车的一个概要的显示，让顾客不需要进入购物车页面就可以随时了解目前在购物车

的商品数量和总价。

   

    迷你购物车是商城网站前台的公共功能，除了结账页面外，其它的页面一般都会出现这个功能。

    常见的迷你购物车是显示在在页面右上角，或者导航行、搜索栏的右端。为了节省位置，迷你购物车

通常只显示产品总数，这样比较精简些，但是同时显示总价也比较不错，顾客也很关心总价。

    迷你购物车通常采用Ajax方式来开发，这样可以有效地避免缓存，可以在页面装载完毕后再通过ajax

技术来做局部刷新，请求到最新的购物车概要信息（总价、总商品数）。

    不少网站迷你购物车会有一些扩展，比如鼠标移到迷你购物车上，会弹出最新加入购物车的商品信息概要。

甚至会显示更多，包含更早加入购物车的商品等。

    

     本文对应的例子是AE.com的迷你购物车，它除了常见的顶部迷你购物车外（见图1上面的箭头），更有趣的是

下面的迷你购物车（见图1下面的箭头），这里是展开的状态，平时是收起来的（见图2）。

     收起来时，并不影响页面的浏览，因为它是浮动的，永远置底。

     为什么这样处理？好处当然是为了有更多的位置对迷你购物车的扩展了。

     顶部信息很多，迷你购物车无法显示更多的信息（甚至价格都不能显示，太挤了）

     通过鼠标移到迷你购物车弹出的方式（可以参考Gap.com），虽然一定程度可以满足信息量的呈现，但是还是不够好，

因为多了一个主观性的鼠标移动动作，不够直观。

     放在下面的好处就是随时可看，并且点击后，还可以展开，信息量更大，甚至连Wish List也做在左侧了。

     现在做电子商务网站，要有好的用户体验，优秀的Javascript Coder太重要了。

 

图1

图2