20个设计完美的电商网站

20个设计完美的电商网站

如果你不能让顾客感到惊叹,那你就没办法留住他们。

2015年全球在线销售量预计将超越前一年创下的1.4万亿美元记录,如何能打造看起来有吸引力的网站,传递给顾客令人兴奋的视觉效果,并为他们提供快速简单的购物体验,就成为了电子商务企业的压力来源。

漂亮的网站设计能够吸引顾客,并为商品或提供的服务增加认知价值。不过,设计电子商务网站的任务也不一定就要令人生畏。看看我们给出的45个电子商务网站设计案例吧,他们来自不同的行业,展示了不一样的布局方案,也许能为你的下一个项目提供一点灵感。

01.使用亮色和大幅产品照片

1
2

New From Bose把该公司最新的5个耳机产品并排放置,分别配以单色背景,并精心挑选产品图片以保证它们能处于整个页面的视觉中心。

02.少即是多

3
4

ETQ Amsterdam专攻鞋类产品,它们生产的鞋子必须遵从“三大标准:优雅、经典、质量。“在设计网店的时候,他们也很显然遵从了这三项标准。通过使用干净的字体,柔和的配色,大幅图像以及巧妙的动画,他们的网站展现出了现代的审美感。网页非常干净整齐,只包含顾客想要购买一双新鞋时最需要的信息。

03.使用硕大华丽的字体

5
6

木制工艺品公司Brdr. Krüger把产品名称和重要标题以Gotham字体和比较大的字号覆盖在屏幕大小的图片上。这个字体在移动设备上也看起来非常漂亮。

04.利用网格打造结构

7
8

Chris Niedenthal使用了网格系统来展示他多年的作品。这为网站提供了结构感、扩展性以及众多展示选择,并且同时保证网站展现出的作品相互协调。

05.在形式和功能上做文章

9
10

谁说菜单就一定要无趣?Chickenbot,是一家意大利烤鸡外卖服务品牌,他们的汉堡菜单可以展开进入一系列选项,华丽地呈现在整个屏幕上,并且使用了生机勃勃的橙色作为列表颜色。是有时略显无聊的下拉式或子菜单式选项的一个不错的替换方案。

06.把导航最小化

11

My Deejo允许顾客能够完全定制自己的产品,甚至不需要离开进入时的网页界面。在顾客面前呈现的是一系列选择,只要通过下拉或者单选框就可以操作。顾客设计好之后就可以立刻下单。

07.打造互动

12
13

Emporium Pies是一家网上甜品烘焙坊。在顾客浏览网站时,鼠标扫过每一个派时,就会相应展示这个派的具体信息,这样就把每一部分内容融合到了一整个信息版块里。

08.介绍你的产品

14
15

加拿大家具制造商JM & Sons设计了一个全部都是他们在售产品照片的产品板块。顾客可以从多个不同的角度观察产品,满足他们可能有的任何疑问。这可以帮助减轻网购和实物到手时带来的误差。

09.大量使用留白

16
17

Best Made Co是一家户外服装商店,他们的官网在产品周围围绕了大量的留白,虽然网站上展示了非常多的产品,但给顾客的感觉仍然非常干净整齐。

10.使用自定义字体

18
19

Leather Head Sports生产好看的皮质体育用品。而他们的官网标题也非常贴心的使用了自定义字体。这一部分题头位于雅致的导航链接上面,是一种非常经典而又有品位的方式使你的电子商务网站变得个性突出。

11.利用强调色来突出重点信息

20
21

通过使用强调色彩,可以很好地突出注意重点,强调界面上可操作部分,以及为网站增加有吸引力的视觉元素。Longboard Living的网站就是这么做的,明亮的鸭绿色突出了所有可操作部分,强调了侧边菜单以及其余的部分设计元素。

12.保证网站容易导航

22
23

LEIF官网的设计通过提供固定的搜索选项,可以输入文字进行搜索,以及提供使用过滤进行浏览,保证顾客可以轻松地找到自己想要的。

13.使用信息丰富的题头

24
25

零食公司Graze的网站做的非常出色的一点在于,顾客可以快速辨别他们提供的各种产品。网站的题头展示了他们提供的各类产品,这样顾客就能够快速浏览整个页面,并找到自己最喜欢的一款零食。此外,他们的字体也非常贴合设计,给人一种舒适友好的感受,正像Graze的零食产品一样。

14.重点突出顾客支持部分

26
27

没有比在电子商务网站上到处寻找联系信息更令人沮丧的了。Farmdrop的网站非常注意保证顾客能够轻松地与他们取得联系。在网站的右下角设有聊天气泡,并且网页上方还有更详细的联系信息。

15.对产品插图进行有趣的实验

28
29

毛巾生产商Vertty使用自家所有产品的插画变形来装饰他们的登陆页面。这些插画不仅能够展示他们生产的毛巾,同时也为网站增加了趣味性和舒适感。

16.使用平铺布局

30
31

Oliver Bonas在网格上使用了大量的平铺来将不同的信息集中展示。因为每个平铺部分都是网格的一部分,各个部分信息组合成了一个整体,但同时又保证不同的信息都围绕着品牌主题。

17.用视频来作为产品图片的补充

32
33

Bellroy在产品介绍中添加了一小段关于产品的视频。这为顾客提供了机会,使得他们能够观察自己想要购买的产品,也满足了顾客可能对产品产生的好奇。

18.使用有质感的背景

34
35

Dollar Shave Club将有质感的背景作为品牌元素,用以区分不同的板块。这为网站增添了一丝粗犷而阳刚的风格,精确地吻合了该品牌的目标市场。

19.为文字为主的设计使用折叠

36
37

Hard Graft网站的优点在于为顾客提供了关于产品的所有重要细节。为了在保证文字为主的基础上又不牺牲掉美感,Hard Graft使用了折叠的设计,在维持界面整洁的基础上,为顾客提供大量的产品细节。

20.使用视频而不是主图片

38
39

在电子商务网站上使用视频既可以分享大量的信息,同时又避免了顾客需要不停的下拉页面进行浏览。Cook Mellow就为自己的网站选择了设计优美,信息丰富的视频。视频还可以帮助厨房小白晋级厨神。

开始设计吧!

好啦,现在你已经掌握了这45个最有视觉吸引力和冲击力的电子商务网站设计方案。如果你觉得我们有所遗漏,请在下面的评论栏中告诉我们。

没有的话,设计愉快!