像素的客观物理特性

在 iPhone 4 发布会上，Steve Jobs 曾说：“当你所拿的东西距离你 10-12 英寸（约25-30厘米）时，它的分辨率只要达到 300 PPI 这个‘神奇数字’以上，你的视网膜就无法分辨出像素点了。”

言下之意，当 Pixels Per Inch（每英寸屏幕所拥有的像素数量）数值越大时，手机屏幕的像素密度也就越高，由此肉眼对画面的「精确性」感官就越好。但永远不要忽略显示器成像的本质——它是一个将图像数字参数以物理发光单元刷新展示的过程——而在绝大多数情况下，一份图片文件都不可能「完美无瑕」地把每一个数据像素细节通过某个终端一一映射到物理像素上为你所见。

因为像素点距（或条纹间距）作为显示器的硬件指标，直接决定了一种给定颜色的一个发光点与离它最近的相邻同色发光点之间的距离，这种距离不能用软件来更改，而这一点与分辨率是不同的，我们只能通过算法将图片文件的像素与显示器的像素点距关系进行匹配。

如果你还不能充分理解上述概念，其实可以一定程度上逆向思考：好比任何一台摄影设备都无法捕获现实物理世界的一切那样，真实物理和虚拟数据之间的转化总存在信息的丢失，如同柏拉图《理想国》认为的世界是「理念的世界」一样，这种偏差是客观存在着的。

偏差补偿算法与质因数分解

从数字参数到物理参数的转化，科学家们采用了诸多与众不同的技术补偿方法，比如最直截的 PPI 补偿——目前主流手机的 PPI 其实都在 300 到 500 之间，让肉眼尽可能无法分辨图片文件自身的参数细微差异。

但是，显示器硬件彼此之间总有差异，比如，iPhone X 的屏幕大小为 5.8 英寸，分辨率为 1125x2436，也就是说，这款手机在宽度方向有 1125 个物理像素，长度方向有 2436 个物理像素。由此，一个参数为 1125x2436 的图片文件在 iPhone X 上静态展示时（动态如 overflow 的滚动时依然会在纵向失去对齐能力），我们可以认为 Layer 上所有的像素和屏幕上的像素可以绝对完美对齐映射。

但如果一个 1080 宽的图片要在 iPhone X 上要满屏显示呢？这时候就不得不运用补偿算法。

正因此，早期的电脑显示器主流分辨率为：

14英寸 1024×768

15英寸 1280×1024

17英寸 1600×1280

21英寸 1600×1280

这些数字乍看之下没有什么明显特征，但为何它们会成为行业共识？来观察它们的质因数分解：

1024=2×2×2×2×2×2×2×2×2

1280=2×2×2×2×2×2×2×2×5

768=2×2×2×2×2×2×2×2×3

1080=2×2×2×3×3×3×5

……

显然，我们即便不考虑硬件的具体像素偏差补偿算法，也很容易理解文件参数与硬件参数的公约数越多，适配（尤其 GPU 缩放）性就越好，物理像素的偏差就越不容易被肉眼观察到，这一点在早期电脑显示器研发中至关重要。

而手机终端的硬件发展速度实际已经超越了传统显示器，通过 PPI 的疯狂提升已经能解决大多数像素显示偏差，因此多样化尺寸的手机款式自然越来越多。

并且现在的偏差补偿技术越来越多样，比如响应式像素补偿（在抽取一个像素补偿的基础上，再抽取备用像素根据第一个像素的响应强度进行色彩备用补偿）、相邻像素相关性补偿（针对向错误差通过迭代函数进行亮度水平修正）等，所以大多数页面中我们已经很难明显注意到网页前端的画面偏差。

新媒体图像设计的误差「玄学」

而新媒体图像设计作为一种前端导向的设计，width: 100% 的应用是非常普遍的，加之长图切片化的主流设计方法，图像与图像频繁涉及无缝衔接。在这种情况下，如果设计师能力初出茅庐，设计时宽度定义随心所欲，就极有可能出现因物理像素偏差补偿不足产生的图像衔接问题。

很多时候，新媒体工作者仔细查看代码对照、对照图片，都无法找到其问题所在，只能将其归咎于玄学。但实际上，笔者就见过一些头部大品牌设计师，出图使用如 1135 这类匪夷所思的宽度（1135=5×227），一方面这种难以进行质因数分解的参数对任何硬件终端的物理属性都是极端不友好的，另一方面体现了身为设计师但前端基本常识匮乏的技术和思路问题。

作为品牌方，我们不可能在任何情况下去指望用户端的硬件能力去补偿自身的设计问题，选择合理合适的图片宽度进行统一设计并规范切图，就是解决这类如对齐偏差等玄学的首要步骤。

计育韬

微信官方 SVG AttributeName 白名单开发者
上海市信息化青年人才协会会员
上海市知识分子联谊会会员
复旦大学奇点新媒体研究中心导师

著有：
设计学图书《Prezi 完全解读：从入门到精通》
传播学图书《硬核运营：技术流新媒体养成》