当我们在做微信H5页面设计时，一定要考虑到不同的机型适配性和基础的页面尺寸规范，如果你还不了解微信H5设计的尺寸规范，那就让小编来带你了解一下吧。感兴趣的伙伴可以参考借鉴一下。

一、微信H5页面设计尺寸规范

1、制作设计稿时，设计师应该把原型稿上的所有尺寸进行2倍处理。这样设计稿在移动设备上预览便可保证清晰。而前端切片时，按照现在流行的做法，可以直接使用原型稿上的尺寸，也就是设计稿上的1/2。

2、一般情况下，H5页面设计稿做成640x1136px是最为稳妥的尺寸，在812px高度处增加一条安全线，重要内容在此线之上（网上有些文章说安全线是960px处，个人认为不太准确）。既保证了在移动设备上显示清晰，也保证了素材的最小尺寸。

3、像素是没有宽高的（不要被Photoshop中的像素格欺骗），它只代表一个采样的色值。

4、任何图片作为数据信息被保存在存储盘中时，只有宽高像素数是有意义的，此时的ppi对于图片来说时没有任何意义，也并不能描述这个图片有多少英寸的宽度或者高度，而只有在被打印出来后才有ppi的意义，被打印出来才可以描述这张图片有多高多宽。

5、平时制作H5页面时设计原型时，产品经理出的原型稿建议屏宽为320px，用这个尺寸一是为了浏览方便（现在很多手机的屏宽达到1440px，用这个尺寸去模拟显然不现实），二是以iPhone5s为标准的手机屏宽较小，进行内容排版布局时屏宽应该向下兼容。

二、微信H5设计的注意事项

第一：背景图片必须采用background-size:cover;来实现。

第二：我们在进行H5页面内容规划布局设计的时候，不能把重要内容放在太偏下的位置或者偏上，否则前端布局时可能出现内容显示不全的情况。

第三：除去将浏览器全屏显示的情况，几乎所有情况均会有顶部的状态栏和导航栏。iPhone的设计标准，状态栏和导航栏的独立像素高度分别为40px和88px。由于Android系统可以更改状态栏和导航栏的高度，这里可以取默认值为48px和100px（这些尺寸网上均可查）。

综上所述，我们的微信H5设计需要专业的设计师来完成，如果你在寻找这样一家设计公司，那么我们蓝橙互动完全可以代劳，为你提供专业的H5设计服务。有需求请咨询网站客服。