体验
1. 保持图片大小比例
图片若没有按原图宽高比例显示,可能导致图片歪曲,不美观,甚至导致用户识别困难。可根据情况设置 image 组件的 mode 属性,以保持原图宽高比。
官方建议:显示的高/宽与原图的高/宽不超过 15%
2. 可点击元素的响应区域
我们应该合理地设置好可点击元素的响应区域大小,如果过小会导致用户很难点中,体验很差。
官方建议:可点击元素的宽高都不小于 20px、
3. 窗口变化适配
对于支持调整大小的页面,需要对不同窗口尺寸进行 UI 适配,以达到良好体验。
可以使用 @media 媒体查询对页面补充适配逻辑。
官方建议:支持调整大小的页面有相关适配逻辑
4. 合理的颜色搭配
文字颜色与背景色需要搭配得当,适宜的颜色对比度可以让用户更好地阅读,提升小程序的用户体验。
由于颜色搭配的计算方法较为复杂,目前算法还在不断优化中。因此该指标仅作为评分的提醒项,不计入总分中。
判断标准:
对于较大字体(font-size >= 24px,或同时满足 font-size >= 19px 与 font-weight >= 700),文字颜色和背景颜色的对比度不小于 3
其他字体,文字颜色和背景颜色的对比度不小于 4.5
对比度计算方法参考W3C 标准