loading请求处理中...

5个提高电商网站设计质感的细节

2021-12-02 23:05:06 阅读 8165次 标签: 企业网站设计杭州网站设计 作者: a454466904

5个提高电商网站设计质感的细节

在现在这个电商行业大行其道的时代,人们越来越偏爱在网上购物,最开心的事就是收快递--拆快递。不只是企业品牌,不少个人创业者也开始以电商作为重要的渠道。在这其中,电商网站可以说是电商行业必不可少的首要工具,其设计也是业界最为关注的焦点之一。如何提高电商网站的设计质感?这就为你支招~

打开网站,首先吸引眼球的就是网站BANNER。第一印象的重要性不必多说,如果网站是以一幅设计粗糙的BANNER去“接待”用户,想必用户也没了“一探究竟”的欲望。

为了不让用户一打开网站就立即跳出,那么,首先要让你的BANNER至少保证有一个魅力点。可以从以下三方面入手:

1、塑造高辨析度的风格

网站BANNER的作用不仅仅是门面装饰,更是用来传达品牌调性,所以BANNER的设计一定要形成独有的特色风格,要跟产品属性和受众审美相契合,要让用户清晰地感知到,我家是卖什么产品的,这些产品是走怎样的气质。

例如,以下两个BANNER,同样都是服装产品,但风格很明显是不一样的,一个是精致华丽,一个是文艺简约,传达出不一样的品牌理念,树立好风格的差异化,更能吸引到目标人群。

5个提高电商网站设计质感的细节

5个提高电商网站设计质感的细节

2、敢玩颠覆反转

如果你以一幅BANNER就能颠覆用户对某个东西的固定认知,那么网站的吸睛度一定是200%的。

例如以下这个网站,你看出来了是什么行业的网站么?

5个提高电商网站设计质感的细节

答案是“茶”,这是品牌Luhse Tea的网站。提起“茶”,我们第一时间往往会联想到传统的,中国风的。而Luhse Tea就来了一个颠覆,走复古卡通的路线,刚开始看的时候还以为是一个动漫创意相关的网站。像这样子的操作无疑是给了用户惊喜感,成功调动起用户的兴趣。

3、加入适当的特效

动起来的BANNER更能吸引注意,所以我们可以给BANNER添加动态特效。当然,考虑到网站加载,添加的特效不宜太复杂,也不用特意地把BANNER弄成GIF格式,利用“美兔科技--建网站”添加BANNER特效就行了。

在网站横幅上方的悬停点击“编辑横幅”,在“横幅特效”的下拉页选择心仪的特效即可,有“雪花”、“流星”、“烟花”等,每种特效都有不同的视觉观感,大家可以分别试验,选择符合自身情况的BANNER特效。

5个提高电商网站设计质感的细节

5个提高电商网站设计质感的细节

电商网站需要展示的商品内容繁多,很容易会显得杂乱无章,用户看半天也看不出个结果来。其实,现在越来越多的电商网站在走极简路线,去掉浮夸的装饰,在干净的纯色背景中展示商品,让用户的注意点聚焦在商品本身,给他们更轻松愉悦的无干扰购物体验。

案例:Dodge&Burn

5个提高电商网站设计质感的细节

案例:Le Coq Sportif

5个提高电商网站设计质感的细节

案例:Narwhal Co

5个提高电商网站设计质感的细节

当用户看到心仪之物,很自然地把鼠标移至相应位置,此时电商网站可以适当设置鼠标的悬停效果,虽然是很小的细节,但也属于网站与用户之间的交流互动方式,而且悬停效果还可以将用户选中的商品与其他商品有效地区分开来。

例如,“美兔科技--建网站”就可以在产品展示的模块添加上鼠标悬停效果。设置时,把鼠标移至对应模块,在上方出现的快捷按钮栏点击“编辑模块”,然后在弹出的窗口点击“图片特效”,选择适合的悬停效果即可。

5个提高电商网站设计质感的细节

5个提高电商网站设计质感的细节

对于某些特效还可以自定义设置颜色、宽度、样式等。

5个提高电商网站设计质感的细节

5个提高电商网站设计质感的细节

5个提高电商网站设计质感的细节

5个提高电商网站设计质感的细节

4、实现快速跳转的导航栏

现在有很多用户,在逛商城时不一定有很明确的目标,即使刚开始是带着目标,期间可能也会有很多变数,所以电商网站的导航栏设计相当重要,要保证用户无论是浏览怎样的页面,都可以轻松地找到导航栏,帮助他们随时随刻都能跳转到想去的页面。

在这里推荐一下侧边导航,侧边导航真的很受电商网站设计师欢迎,通常分布在页面的左侧,使整体的网页布局显得简约优雅,让栏目内容一目了然。设计侧边导航时,可以把导航与BANNER融为一体,也可以用与BANNER主色对比强烈的纯色进行打底,两种手法都能给访客独特的视觉观感。网站侧边相对于网站顶部来说,可扩展的空间也更广,所以当网站需要改版增加栏目内容时,侧边导航会比顶部导航更好调整。

5个提高电商网站设计质感的细节

5个提高电商网站设计质感的细节

5、精心设计指引按钮和功能按钮

小小的按钮,大大的作用,“立即下单”、“添加到购物车”等,这些指引按钮设计得好,绝对能刺激用户的购买欲,促成更多的订单交易。分享关于功能按钮的3个设计要点:

1、选择有差异的颜色

按钮的颜色要与背景色有一定的反差,例如你的网站是以紫色为主色调的,按钮就不要选择与之接近的红色了,而是应该选择对比色黄色,既不会互相“抢戏”,同时还能将两种色彩的特质很好地衬托出来。

2、采用用户熟悉的样式

按钮的样式尽量采用用户熟悉的设计,要给用户一个明确的信息,这是一个可以点击的跳转按钮。

拿“美兔科技”上的按钮设置(将鼠标停在按钮上,点击“设置样式”,即可进入按钮样式编辑栏)来举例,常用的按钮样式有:圆角矩形边框填充色彩、矩形边框填充色彩、幽灵按钮、无边框线渐变色填充带阴影、有边框线渐变色填充。

5个提高电商网站设计质感的细节

在这些按钮中,无边框线渐变色填充带阴影更适合用于商城网站,具有凸立体的效果,更容易让用户意识到这个是可以按下去的地方。

3、位置注意给予留白

按钮的周围一定要给予适当的留白,让按钮的视觉主体突显出来,和其他版块拉开一定的间距,更容易被识别出来,否则用户很可能判断不了它到底是一个普通的边框,还是一个可点击的按钮。

BANNER图、商品陈列页、鼠标悬停效果、导航栏、功能按钮,5大细节提高电商网站的设计质感,你都GET到了么?

设计公司推荐

成为一品威客服务商,百万订单等您来有奖注册中

留言( 展开评论

快速发任务

价格是多少?怎样找到合适的人才?

官方顾问免费为您解答

 
相关任务
DESIGN TASK 更多
企业网站调整

¥100 已有4人投标

企业宣传片剪辑

¥100 已有3人投标

企业微信搭建

¥500 已有4人投标

企业官网页面设计

¥1300 已有5人投标

杭州元亨_建站项目2

¥4500 已有1人投标

企业海报设计

¥400 已有1人投标

企业品牌文化编写

¥600 已有1人投标