手机网站制作好之后要用各种分辨率的移动智能手机 分析移动端H5网页设计尺寸

做H5手机网站都知道，手机屏幕尺寸那么多，设计的时候应该以哪个尺寸为标准尺寸？

经过多年的手机网站建设经验，好三六得出结论。移动H5的设计尺寸一般设计为640x1136px。

手机网站制作完成后，当我们使用各种分辨率的移动智能手机查看我们设计的H5页面时，当然也会出现内容显示不完整，甚至一些重要的内容和按钮也会被屏蔽。此时，我们

需要做的是，背景图片必须使用background-size:实现cover。在规划和设计H5页面内容时，不能将重要内容放在太低或太高的位置，否则前端布局可能会出现内容显示不完整的情况。通过反复测试和比较，可以得出结论：除了显示浏览器全屏外，几乎所有情况都有顶部状态栏和导航栏。因为Android系统可以改变状态栏和导航栏的高度。然后将网页内容向下挤压，进入盲区(根据不同的布局可能挤出视口，即视觉区域以下)。这两个系统的最大值是148(48+100)，设计稿应尽量保证单页下没有重要内容。综上所述，现有市场上流行的移动智能手机单页翻转(非向下延伸长页)的设计稿尺寸一般为640×1136，在高度为812的地方设置安全线(参考线)，在这条安全线上布置重要内容。

在设计H5页面时，设计师应将原型稿上的所有尺寸翻倍。这样，在移动设备上预览设计稿就可以保证清晰。根据目前流行的做法，前端切片可以直接使用原型稿的尺寸，即设计稿的1/2。一般来说，H5页面设计草案制作640x136px是最安全的尺寸，在812px高度增加一条安全线，重要内容高于这条线。它不仅保证了移动设备上的清晰显示，也保证了材料的最小尺寸。