小程序的发展逐渐变得成熟,2018年,小程序在很多方面已经得到充分的运用,但是小程序的开发依然还有发展的空间,对于小程序的设计和开发市面上的资料太过于零碎,官方文档也没有明确的说明,今天就为大家梳理一下小程序开发开发需要避免的几个坑。
1、标签栏的设计。
标签浪的分页导航设置有标准的高度,其高度为:98rpx,图标的最好是54rpx,因为不管是大于还是小于这个数都会变形,变形就会失去吸引力,会让用户有一种不专业的感觉,一般而言数量只能是2到5之间。
2、弹窗不覆盖导航跟标签。
在小程序里导航栏跟标签栏的层级是最高的,以至于享受惯最高待遇的弹窗在这里,也要臣服于他们。
3、设计稿最好用二倍图。
UI设计师都喜欢用一倍图,但为什么用一倍图,方便适配是表面现象,真正原因是开发用的开发工具支持一倍图开发,开发不用再换算数值了。而小程序的开发工具不支持一倍图开发,支持二倍图开发。小程序里的尺寸单位叫rpx,可以根据屏幕宽度进行自适应。在750*1334的设计稿里,1px=1rpx。
4、切图只需切750的尺寸。
设计稿用二倍图做的(750*1334),只需给一倍的切片;如果是是按一倍图设计的(375*667),只要给二倍的切图。真的不管其它尺寸吗不是不想管,而是小程序的开发工具不支持。
5、导航栏最好不要自定义。
标准高度:128rpx,小程序很轻量,同时也有很多限制。导航栏不能自定义就是其中之一,能改变的只有颜色。这是官方的意思,但是,要改也是可以滴,需要客户端版本是6.6.0以上,而且下拉会使整个页面下拉,也不要维护。
6、视频限时多。
小程序对视频的支持不是特别的好,原则上在滚动控件里不能放视频,而且微信官方文档里是这样要求的。优酷和腾讯视频都是将视频固定。这点已经被有些公司攻克了,比如开眼跟京东(是的,你没看错,京东)。攻克是攻克了,但是体验不怎么好。如果公司产品需要放视频,建议专门新开一个页面,视频部分最好不要有左右滚动。
7、一稿适配。
不管是iOS的系统还是安卓版的,这些都不难,这对于对开发人员来说很简单。