首页  /  卖家资讯首页  /  专栏
无线端页面设计“三大雷区”
2018-03-29 17:54:48
1787浏览
手机端页面的设计有许多的规范,大到涉及整个页面的排版呈现方式,小到一个icon的尺寸大小,这都关系到视觉页面的美观程度以及用户体验设计。所以应该积极主动去分析深入了解并研究出可行的解决方案,同样的,无线端页面设计存在许多雷区陷阱,这个需要设计师去避免出现错误的。

手机端页面的设计有许多的规范,大到涉及整个页面的排版呈现方式,小到一个icon的尺寸大小,这都关系到视觉页面的美观程度以及用户体验设计。所以应该积极主动去分析深入了解并研究出可行的解决方案,同样的,无线端页面设计存在许多雷区陷阱,这个需要设计师去避免出现错误的。

一、无线端视觉规范

(一)、无线端页面尺寸规范随意缩放

无线端页面一般来说是延续pc端来进行更改调整的,所以很多小伙伴直接在pc端的基础上直接进行收缩,然后变形,大部分操作就会失效,这样的话就会影响到无线端文字的可读性以及整个视觉画面的布局,造成整个视觉布局的不协调性。

(二)、解决方法:

针对无线端与pc端存在的差异,首先应该不能直接在pc端的原基础上进行修改,而是应该对无线端的页面进行“再设计”,针对手机端的规范尺寸进行适配,比如:应该调整按钮大小,以更加适合无线端用户的视觉可读习惯、文字大小,一般18px的字号是刚好可以清楚的程度,而24px是比较舒服的一个状态,30px是用于想到重点突出的大标题,不过一般在页面中出现频率不高,因为如果一味用大标题字体的话,尽管可读性比较好,但是页面也需要加长,用户会没有耐心。

类似这些页面的无线端就是进行过“再设计”的:

无线端页面设计“三大雷区”

无线端页面设计“三大雷区”

二、无线端页面呈现内容

(一)、pc端内容信息量大,一字不漏照搬到无线端

由于pc端的页面尺寸比无线端大很多,所以pc端承载的信息内容相对比较全面,但无线端尺寸相对小很多,如果把所有pc端的内容原封不动地搬到无线端的话,就会显得拥挤不堪,导致整个页面布局看起来太过于糟乱,重点信息不能够很好地展示。

(二)、解决方法:

手机端尺寸相对手机端很小,所以让页面看起来简单有层次是比较重要的,这个点对于手机端页面布局是很重要的,因为没有对比就没有重点,不能每个都是重点,每个都想突出,这样反而没有重点了,其实现在简洁风是很多大牌只要的营销手段,可能是因为苹果简洁风当下比较盛行,看起来比较有高级感,但是并不适合所有的页面,因为类似一些食品类还有一些促销类页面,需要重点突出信息部分,这个事根据自身品牌店铺定位来决定的。

一些品牌的简洁风页面:

无线端页面设计“三大雷区”

无线端页面设计“三大雷区”

三、用户体验

(一)、按照pc端的用户体验操作习惯延续到无线端页面上

首先pc端一般用户习惯是点击鼠标左右滑动浏览banner图或者向上下滑动鼠标浏览页面,而无线端一般用户的操作习惯是一直向上下移动浏览页面,而且操作环境的选择也会有所区别,在PC端上,点击店铺内容的方式更加直接,用户只需要通过鼠标来操作,而在无线端,直接用手指和屏幕之间直接接触,很多人会直接把pc端的页面展示方式直接搬到无线端上, 但是现在手机端以轮播的形式展示的点击率越来越低了,很多重点信息内容都在banner图上展示,这样就会造成店铺点击率降低。

(二)、解决方法:

因为目前无线端的店铺比重占据了很大的一部分,所以还是要注重无线端的用户体验设计,首先应该积极主动引导用户行为,所以不是很有必要的话尽量避免以轮播图的形式展现,因为用户已经习惯了上下的浏览操作习惯,所以一般都不会主动左右滑动。

类似这些很好的无线端用户体验设计:

无线端页面设计“三大雷区”

无线端页面设计“三大雷区”

总结:

对于无线端页面的设计,用户体验是非常重要的,尽管现在无线店铺设计是处于弱势,一般都是直接照搬pc端的页面,但是从现在电商的发展趋势来说,无线端的用户越来越多,所以相信大家很越来越重视无线端页面的设计,设计师也要深入去学习无线端的设计规范、理念等。

作者:大麦电商,电商问题交流微信dm18902205090(备注:卖家网)

原创稿件,转载请注明来源卖家资讯http://www.maijia.com/news/

get更多电商资讯干货、趣闻轶事,速度关注卖家网公众号吧!(ID:maijiadada)

图文阅读
淘宝平台经营的商家有30%是从去市场档口拿货的,档口一般指的是批发市场的店面,档口拿货就是去这些服饰或其他产品的批发市场的店面里进货再到淘宝上去销售。在每天频繁的拿货过程中很容易出现:商品漏拿、缺货数量登记不清、配货混乱等问题。
2020-10-24 14:42:00
最新文章
快递助手:使用小标签拿货,提高发货效率不止一点点
2020-10-24 14:42:00
电商卖家实力推荐,快递面单打印就用快递助手打单
2020-10-24 14:40:00
【大搜查】产品不符3C认证要求,店铺被扣6分
2020-10-23 00:00:00
番茄表单的这些用法,你都会嘛?最后一个太有才了!
2020-09-11 11:04:58
同样是行政,为何别人看着轻松不少?
2020-08-27 14:34:39
番茄绩效X Publink:绩效管理线上化,秒变效率大师
2020-08-27 14:25:03
快麦打印机新品内测 | RX106M免费送,快看看你中奖了吗
2020-08-07 17:24:26
快麦设计时尚 | 20年秋冬童装卫衣面料五大流行趋势
2020-08-07 16:55:19
精选专题
热门阅读
大家都在搜