设计狮的DPI指导手册 _分辨率

什么是DPI跟PPI?
DPI(每英寸点数)最早是在印刷中测量空间里点的密度的，就是打印机在1英尺里的大小里喷墨点的数量。越小的DPI，图片就越不清晰。
这个概念被运用到计算机的显示屏中，就是PPI（每英寸像素）。同样的道理：它代表每英寸里电脑屏幕显示的像素的个数。DPI这个名词也被用在电脑显示屏中。
电脑的默认PPI是96，Mac是72，虽然这个数字在80年代后并不是那么精确。
通常，非视网膜显示屏电脑（包括Mac）的PPI最小72，最大120左右。设计在72跟之间，基本可以保证你的作品在所有屏幕上有同样的尺寸比例。
举个例子：
一个的27寸苹果显示器，意味着它每英寸上有109个像素点。带一个斜角的宽度实际上是25.7英寸（65cm）。而屏幕真正的宽度大约是23.5英寸。23.5*109~2560，所以，屏幕本来的分辨率就是。
*我知道23.5*109并不完全等于2560英寸，实际上约等于23.英寸，如果用厘米作单位来算的话这个数更精确。不过，你知道就可以了:)
对你设计的影响

文章插图
假设你要在我们刚刚在上面提到的屏幕上设计一个109*109px的蓝色方块。
这个方块会在屏幕上占1*1英寸大小。如果你的用户用的是一个72PPI的显示屏，你的蓝色方块就会显示得大一些。因为只有72PPI,屏幕就需要大概1个半英寸去显示109像素。
看下下面模拟的效果：
注意
除开颜色跟分辨率的不同，请记住每个人看你的设计都会感觉不一致。你必须找到一个最好最折中的方案，去赢得更多的用户。不要假设用户用的屏幕都是一样的并且跟你的一样好。
屏幕分辨率（以及原始分辨率）
屏幕分辨率对用户感知你的设计有很大的影响。幸亏LCD显示器替代了原来的CRT，用户现在的原始分辨率能够保证一个比较好的尺寸比率。
分辨率就是屏幕上展示的像素点（例如之前的：27英寸苹果电脑显示屏有2560*1440个像素，2560是宽，1440是高）。现在你知道PPI是什么意思了，它并不是一个测量物理尺寸的单位。你可以给你的墙装一个2560*1440的显示屏，给你的大脑装另一个（…?）。
现在的LCD显示器都有一个预定义的默认或者原始分辨率去处理屏幕能够显示的像素点。它跟CRT有些不同，不过既然后者已经过时了，我们就不再详细讨论了吧。(并不是要揭露我对那些不错的旧电视的偏见)

文章插图
我们假设27英寸显示屏能够在原始分辨率2560*下显示为。如果你减小分辨率，元素的尺寸就会变大。因为你的23.5英寸的水平宽度实际上包含的像素点更少了。
我说实际上，因为在这个例子中是这样的。显示屏的原始分辨率是2560* ，如果分辨率下降了，像素点还在，还是显示在。你的操作系统要做的是填补间隙，这样做的后果是拉伸了屏幕里的东西。你的GPU/CPU会使用到每个像素点，并且使用新的比率去计算他们。
如果你希望在你的27英寸的电脑上分辨率是1280*720（原来的一半宽，一半高），你的GPU就会把像素点伪装成原来两倍大来填满屏幕。结果是？模糊不清。比率缩小一半看起来还过得去因为除得尽，如果你希望比率缩小为原来的1/3或者1/4，那样比率就会变成小数。但是你是不能再分一个像素的。看下面的例子。
来看下下面另外的例子。在原始分辨率上画一条1px的线。然后将分辨率降低50% 。为了填满屏幕，CPU会将视觉范围提高到150%,使得图形扩大到1.5倍。1*1.5=1.5 ，但是你不能有半个像素。最终是这些像素点附近会有一部分颜色，造成模糊不清。
这就是为什么如果你有一个专业版的苹果电脑并且想改变分辨率，它就会展示下面的窗口，让你知道（下面的截屏）某个分辨率“看起来像”1280*800px ，它使用的是用户习惯的分辨率来表达尺寸比例。
这是一个高度主观性的表达，因为它使用的是像素分辨率作为一个物理尺寸的单位。但这也不算骗人，至少从他们的角度是这样。
注意
【设计狮的DPI指导手册】如果你希望自己的设计在每个像素上都表现得很好，千万不要使用跟原始分辨率不同的分辨率。也许你用更小的比率会更顺手，但是，当精确到像素点时，如果你想要很精确的效果，还是不要这样。很不幸，有的人就是不用推荐的设置，他们想试试其他的分辨率来看看哪个在电脑上用起来更好一点（尤其是电脑）。那样的话，你的设计就会看起来很糟糕，不过那样的用户估计更在乎可读性而不是美观什么的了吧。