A：
我们在制作手机方面的H5页面设计原稿时(当然包括微信方面的H5页面设计)，如果没有设计过类似的移动方面，UI设计师和前端工程师一定会纠缠在一起。如果是app设计师，就不会那么烦恼。
那么多手机屏幕尺寸，设计原稿应该以哪个尺寸为基准尺寸呢？现在有2K分辨率的手机画面，设计原稿也必须按照最大的分辨率设计。显然不是这样。
请注意:(以下所有讨论内容和规范都将viewport设置为content=width=device-width)，即必须包们的H5页前端代码中。
根据目前市场上流行的手机移动端，统计他们的设备独立像素。
只有iPhone6+采用分辨率降频处理。
具体看下图:
感兴趣的合作伙伴可以尝试1倍、2倍、3倍等尺寸。最终得出的考试结果是。H5的设计稿一般设计为640x1136px即可。可以满足显示需求，降低用户加载图像所需的带宽。
当我们可以使用各种分辨率的移动智能手机查看我们设计的H5页面时，当然也会出现以下情况，内容显示不完整，甚至一些重要的内容和按钮都会被屏蔽。
第一，背景图像必须采用background-size:cover实现。
第二，我们在设计H5页内容规划布局时，不能把重要内容放在太低的位置或太高的位置。否则，前端布局可能会显示内容不完整。
比较可以得到:
除了显示浏览器的全屏外，几乎所有情况都有顶部状态栏和导航栏。
iPhone的设计标准，状态栏和导航栏的独立像素高度分别为40px和88px。
Android系统可以改变状态栏和导航栏的高度，因此默认值为48px和100px。
然后将网页内容挤压到下面，进入盲区(根据不同的布局方法，可以挤出视野，即视野下面)。取这两个系统的最大值为148(48+100)，如下图5所示，设计原稿应尽量保证单页下无重要内容。
图5。
所有画面的大小都要完全显示重要内容，注意市场上存在的小型手机画面，现在大部分智能手机的分辨率都在640x960px(iPhone4分辨率)以上，所以把重要内容放在上图5的死角上就可以了。计算后最安全的高度是812(960-148=812)。
总结一下，一般来说，在现有市场流行的移动智能手机中，单页翻转(不伸长的长页)的设计原稿尺寸为640×1136，在高度为812的地方设置安全线(参考线)，将重要的内容配置在该安全线上。
