商品详情页——商品局部放大展示比例

最近浏览了一些购物网站,主要想对商品详情页中商品局部放大比例的上,简单搜集对比了下,也算是个梳理过程吧,在购物网站商品详情页中,商品图片-局部放大图片尺寸比例不同,对视觉体验以及其美观性也会产生不同的效果。

1.商品详情页对应网购网站的主体宽度(如凡客、梦芭莎网站分辨率宽度为980px,商品详情页的宽度也是980px),

2.无论在商品缩列图、商品大图及局部放大情况下,商品图片都是保持正方形比例或者矩形比例。

3.麦考林、玛萨玛索等购物网站:商品局部细节展示的比例尺寸,在视觉上,由于放大图片的尺寸不能够全部遮挡背景文字,这时在视觉上会成为信息干扰元素。建议放大图片比例适当的优化。但是放大图片出现的时候,做了淡隐淡现的效果,这一点还是不错的。

4.凡客旗下的网站-V+这方面做的很好,在顾客放大商品局部细节的场景里,完整覆盖掉背后的文字信息。能够让人专注于商品的细节,减少其它无用的信息干扰,化繁为简,界面简洁统一。

5. 凡客网站的商品详情页,放大图片位置始终错位,有些遗憾。其中局部放大图片尺寸比例与商品展示图片始终保持着正方形1:1的比例

这边在罗列一些其它的网购网站——产品详情页的界面,京东上在放大图片加入了京东商城水印效果,但是没有在商品图片中加入水印,感觉怪怪的。不能换个位置吗,怕盗链吗,呵呵

京东商城

Masa Maso玛萨玛索

银泰

梦芭莎