概述
为保证用户在 PC 端使用小程序也有流畅友好的体验,本指引将提供一系列大屏适配相关建议,以供参考。
1.为什么要做适配?
由于用户可在 PC 端使用小程序,且有可能在不同尺寸视图下进行切换,为了保证小程序在不同尺寸屏幕下的体验流畅友好,我们建议开发者根据用户使用设备和场景,自行对小程序进行适配。适配推荐栅格系统、配合响应策略实现页面动态布局。
采用栅格系统进行页面设计
栅格系统具有规律性,其元素宽高可使用百分比进行呈现,这个特性让使用栅格系统设计出的页面与布局具有规律可寻,从而提高不同分辨率下页面布局的一致性与可复用性。
制定小程序页面的响应策略
响应式是系统对于外部变化的反馈跟适应,即通过合理的设计方案配合规范的技术来制定的变化策略。
响应式策略的制定能够让小程序在任何一个尺寸的屏幕上的使用体验保持合理与连贯性。
2.未适配小程序在 PC 端体验
没有适配的微信小程序,将无法在 PC 端切换小程序窗口尺寸,具体展现规则如下。
竖屏展示的小程序
无论屏幕大小,总是以手机尺寸414x736显示。

横屏展示的小程序
无论屏幕大小,总是以平板尺寸768x1024显示。

竖屏展示小游戏
以平板尺寸1072x768为屏幕基准尺寸,让小游戏窗口基于手机尺寸320x568做等比例缩放处理。
#微信小程序
#小程序运营