现在的位置: 首页 > 综合 > 正文

页面设计:响应式设计电子商务网站案例学习

2013年09月16日 ⁄ 综合 ⁄ 共 371字 ⁄ 字号 评论关闭

响应式设计技术已经比3年前更加成熟而且有了更多的设计、测试工具和设计框架和样式。

不过这些设计大部分用在一些阅读、Blog、简单门户网站中,在电子商务领域少有涉及。

国内大中型电子商务网站基本上没有使用响应式设计的技术。

不过,今天看到一个国外卖定制衣服的网站,这方面设计、实现得很不错,值得借鉴。

网站首页:

http://www.indochino.com

在PC上是排在一行的4个方块导航到各个分类

在手机上则自动切换到列表模式(右边带方向箭头)

商品展示页面:

http://www.indochino.com/collection/Shirts

在PC上最上方是菜单栏,下面内容部分有两列,左边的分类导航列,右边的商品展示列

随着设备尺寸的缩小,首先商品展示列会由4列逐步递减到2列。

然后左边的列消失,该分类导航列变成了商品右上方的导航下拉菜单,如下图:

抱歉!评论已关闭.