电商网站设计排版欣赏
创新互联:电子商务商品列表中也称为商品聚合页,可以为消费者提供更加好的产品选型。这种类型的页面的最大特点是大量的信息,图片,所以布局清晰、合理,如何尽可能地压缩内容是商品列表页面设计的关键部分。
网站设计排版分析" />
目前,国内电子商务网站的商品列表页面常见的有三种形式,分别瀑布流水线安排突出和特殊模式。这三种形式有不同的特点,设计师应根据商品特点选择最适当的表达方式。
如果货物的品种五花八门,规则规定整个行列的排列方式更有利于用户发现浏览模式;瀑布流,以电商的形式在时尚领域中普遍的使用,一个特别突出的方式在节日来临时来促销活动，这些将在下面的案例中也会一一提及。
1.展示基本信息
可以看得出商品列表页面比较紧凑，与其它的页面相比较而言,所以设计师应该用特定的范围来设计展现最有用的信息这种想法去设计电商网页。列表浏览页面的用户可能不太在乎货物的详细描述，这个时候浏览模式更多的是浮光掠影,因此,简洁的图片,商品的名称,价格的说明,已经能够满足用户需求的页面。
顺丰优选的商品列表页表面看起来非常简单,但是向用户展示的商品信息却丝毫不减，相对于其他的电商网站而言，用户真正想要的信息得到了充分体现。
2.鼠标悬停时产生交互效果
很多网站将被忽略鼠标悬停时应该产生相互影响,有一些是比较著名的知名电商。尽管只有很小的影响,但是它的存在的意义远不仅如此,甚至它可以很好的反馈一个网站和用户之间的交互能力。
就比如淘宝商品的列表页而言，反馈给用户的信息是高效的。当鼠标停在某个商品的图片或文字上时，就会出现红色的线框把这个商品与其他的分开。且颜色的选择也与主题颜色相同，与整体颜色相统一。
3.出现适量的附加信息
商品列表页面再设计的过程中应当做到简单却不单调，简洁不繁琐。但是适当的增加些额外的对于产品有用的信息也可以达到如虎添翼的效果
我们来看看聚美优品设置的列表页，它的设计风格是采用了特别的突出的表现方式，全方位的向用户展现不同的商品图片及信息。这种效果使让用户不进入详情页就能看到商品的整体形式，从而会间接的阻止了页面的跳出率
我们再来看看美丽说的设计特点，创新互联指出：它是一个偏向时尚潮流的网站,所以设计师用这种人可以接受瀑布流的方法。美丽说商品列表页面功能添加一个模块用于其他用户的评论,这是许多的电商网站没有的。这就是为什么人们在网上购物时非常关注的部分。
4.始终带给用户指引
可能许多电子商务网站都认为,用户在某个商品列停留的时间越长，寻找到的产品时间就越短，成就的可能性就越大。但是事实上却不是这样，用户可能会不断翻转商品页的过程中将不知不觉地改变了目标,因此,网站应该为用户提供指导,给他们一个明确的方向感。
YOHO商品列表页面好处是侧边导航栏总是存在于页面,该页面为用户跳提供了很多方便,但是缺点是侧边导航栏是静态的,如果可以实现动态的,可以当用户鼠标滚动,总是呆在屏幕上就更好了。
5.设置相关推荐，促成更多消费
与产品推广另一个商品的销售,这是正常的营销噱头,电子商务网站,但是如果使用这种方式太硬用户不一定能够理解,网站应该尽量使用软方式来表达相同的意思,设计师也为此需要花费一定的时间。
这种设计的方式我们来看看的淘宝的设计风格，利于找相似或者是找同款的字样方便用户搜索自己想要的产品信息，同样也不会觉得营销目的太过于浓重
6.扫清页面死角
页面的每一个地方都有它存在的意义和可用之地，只要设计布局的合理，也能起到重要的作用
在页面的底部及网站页面的左右侧边，不是很明显的地方，但是京东的做法就比较好，设置销量排行和商品精选等也可以向用户推广展现商品的信息
7.用特色商品激发购物欲
如果你认为特色商品的性质只是放在首页的话，那么这种想法你就错了。虽然首页的位置较好，但是效果不一定是最好的，根据商品的信息及合理的布局，才能达到理想中的效果
就如易迅网案例，手机产品的相关建议放在商品列表页面,让用户可以体验一个真正的购买欲望。
8.吸引人的商品活动尽量置后
相对吸引力或商品有目的的活动在偏后一点的位置,有利于整个网站的营销。我们来看看一号店的电商网站设计的风格，将目标“热门推荐”和“你浏览记录相关的商品”在最后一页,这种是有利于结束浏览用户发现新的感兴趣的内容。
9.减少操作步骤
在商品列表页面,其目的是减少货物加入购物车才开始去做。但在此之前的主要前提是商品信息显示要尽量全面和完整,表达的所有内容在小面积也确实是一个困难的事情。
直接在商品列表页面显示“加入到购物车”按钮并不少见,但是也显示了购买数量不多,以上的官网实现此操作,允许用户直接选择数量和品种。
10.从众效应
从众心理是一种常见的网上购物的人的状态,因此,顾客购买商品的评价对用户是引人注目的,企业可以利用这个来做一些小的改动在网站设计知识页面的设计。
分享文章：电商网站设计排版欣赏
本文URL：http://scjbc.cn/view/162404.html
