|
PART1：分辨率=像素/英寸 其中，像素单位为px，英寸单位为in 为了更通俗易懂，下面我举个栗子！ 在PS cc 2015(试用版)中新建的一个文档 对于该文档 图中的每一个小黑格就是1像素（px） 1. 像素并没有明确的实际大小，它是用来衡量图片质量的一个数据； 2. 每1像素可以理解为1个非渐变的色块。 3. 电脑上看到的每一张图片都是由n个像素拼成的； 4. 任何一张图片，若需保持它的质量不变，那它的像素肯定也是固定不变的。 上图的宽是1英寸，高是1.5英寸，分辨率是10（这里为了展示，明显放大了的） 将公式转换一下可以得到： 像素=英寸*分辨率 所以横向可以数到10个黑格子（像素），竖向则可以数到15个黑格子（像素）。 还记不记得某些手机的宣传单？“3百万像素，XXX镜头！” 其实那就是说该手机拍处的照片的大小（像素）相乘约等于3000000，它里面有3百万个像素小格。 然而看到这里你可能会疑惑：像素表示的是长度还是面积？ 其实我也不知道，但不知道又有什么所谓？知道又有什么卵用？数学考一百分？ PART2：分辨率——dpi与ppi ppi=每英寸像素（Pixelper inch, ppi） dpi=每英寸点（Dot perinch, dpi） ppi用于图像，dpi用于机器。 所以！ 我们平时说的“这张图片300dpi”，“那张图片72dpi”是`用法！ 正确的用法应该是“这张图片300ppi”，“这台打印机300dpi” 据说分辨率中还有一个lpi！然而了解这些后又有什么卵用？ 什么用都没有~ 印刷厂也不会因为你说了ppi和lpi后效率更高，印刷质量更好。 所以完全可以忽略这一点，继续用你标准的普通话说：“这张图的分辨率是300dpi” 这里完全只是想告诉你Ai中的ppi是什么鬼 2-2：Windows右键属性中的分辨率显示dpi？！ 难道是我上面的猜想错误了么？跪求各路大师回答.... 2-3：Windows右键属性中的分辨率显示dpi？！ 注意哦！这里是一颗星星的，本人不敢确定，纯属猜想哦！ 前段时间拿个画册的设计文件去印刷厂打样，厂家在检查文件时说到：“这条线太细，印不出来。” 那最细能有多细？这就要看机器的dpi了！ 按前面的说法：dpi即每英寸点。 所以如果印刷机的dpi是300，也就是说在1英寸里可以喷300个点， 所以最细的线可以是1*25.4/300≈0.0847mm。 如果线条粗细小于这个值，也会有东西喷出来的，但效果绝对不好，或者部分变粗，或者部分喷不出来，变虚线。 而且，0.0847mm还是在理想的状态下，毕竟还要考虑纸张的粗糙程度等因素， 所以，这里建议线条的最细值设置成0.1mm，求保险则设置成0.15mm， 另外，看清楚印刷机的dpi（很多是200dpi的），和纸张的质量，草纸什么的就别想印0.1mm了。 Anyway，问清楚厂家~ 以上推算过程完全是自己YY， 但0.1mm和0.15mm这倆数字则是个人经验，可以参考 2-4：iPhone 5S手机的分辨率：640x1136像素 错！640x1136px是尺寸，不是分辨率！ 然而现在很多卖手机卖电脑的，都会说机子分辨率是XXX x XXX 像素...... Anyway，有些事知道事实真相，不要盲目的从众就够了，不必要太较真。 PART3：尺寸 像素、英寸都属于尺寸 前者（像素）电商用，即一切放在数码产品的图像都是用像素来作为尺寸单位 。 后者（英寸）纸媒用，即需要打印喷绘时，需结合分辨率一起使用。 英寸还可以选择米、厘米、毫米等，它们都可以相互转换。这时的尺寸则是指喷绘出来的实际产品的大小，分辨率则影响产品的质量（图像清晰度）。 PART4：常用尺寸的应用规范 这里内容量比较大...请备好枕头方便随时入睡，本人在写这部分的那几个晚上都睡的非常的舒服~ 4-1：web 下面在说网页尺寸规范前，我们先来看看市场调研机构StatCounter对“2014年最主流的屏幕尺寸”的统计报告（调查范围应该是米国） 诸位应该能看懂吧...已经被广大接受的1920x1080并不是最多人用的！而已经用了好久的1366x768却是占了最大比重！或许是因为笔记本显示器问题。Anyway，这些数据还是非常有参考意义的，最起码是知道不要一味最求1920x1080，即使整个公司的显示器都是这个分辨率，还需考虑用户真实的需求。所以，开工前最好是能做个类似这样的调查，没钱调查就上网找别人的统计报告看看，除非产品是做个你自己一个人用的。 以上4个数据为目前最常用的四个网页宽度尺寸，其中考虑到浏览器边框宽度，以及上下滚动条宽度，实际尺寸可能会与上述数据有点出入。但在设计时按上面的去设计是没问题的，后面真正应用时，按程序员的要求去切图就好。而且，切图还不一定是你设计师的工作。 其中，1000px全网适用(也有人是用960px的，其实差不多)，其他3个则不一定所有人都适用，有多少人合适可以按上述的统计报告预估。 所以优秀的策划会根据产品的主要受众来决定产品细节，如QQ官网，由于什么用户都有，所以理所当然的适用了1000px。 诚意推荐做法： 做1920px的，主要内容放在1000px内，1000px外放相关元素背景或超级大图。 网页正文推荐大小：14px 这个数值绝对是综合性比较好的数值~ 实际情况（客户无理且硬性需求），灵活面对 4-2：手机 这里且不说主流手机的尺寸是多少多少了，还是和web一样：了解产品的定位，了解产品的主要用户是用什么移动端的，这些移动端的尺寸又是什么？ 上面的信息肯定不是由设计师去提供，但了解设计的初衷是非常重要的！ 不然，你就一美工。 若有朋友需求不同界面的最适合标准，请留言告知，如果有朋友已有这些数据，也麻烦好心告知一下，本人会更新贴上来（其实是我懒得找了...好困） 讲多无谓，食多会滞，举个栗子来说吧！
也有人是用18px的，但这个太小我接受不了... 而对于40、88、98这三组数据，知道有这回事就行了，因为随着ios系统的更新，这三者的形式也变得非常的多。设计前看看别的app是怎么设计的 4-3：吐槽 1. 说在前面：无论是图片还是字体，大小设置不能小于1，也不能为非整数，尽量不要用奇数像素(特别是图片)。程序员懂为什么是最好的，就能指导设计该怎么设置大小。要是不懂！！！哪天发现界面中某张图片变得模糊，字体又不知道为什么感觉怪怪的，便一起陷入毫无头绪的无限修改中了... 2. 切记！！！不要以为在你的显示器上觉得没问题就OK，放去其他分辨率的显示器上再看看？设计师的显示器和程序员的显示器非常有可能是不同尺寸的，这就很有肯能导致设计稿和最终稿完全不一样。不要只怪程序猿不懂设计，麻烦下次好好想想是不是自己太年轻。 3. 程序猿那边为了减少产品的大小，很多时候会用一些“聪明”的方法去编程，比如一个400*400px的纯色块，他们只需放上一个1*1px的纯色块，然后用“九宫格”将它拉伸成400*400px，还有什么@2x、@3x等乱七八糟的专业术语。 但是！我们是射妓湿！！！这些东西交给前端去完成就好了！我们做的产品是什么尺寸的，你就按什么尺寸去做！640px宽就做640px，做你先人板板的320px！！！切记做成矢量就好（图片除外）。如果公司没有前端，只有你才会切图，那...请好好沟通... 4-4：纸媒 4-4-1：印刷文件最适分辨率 随着科技进步，印刷机的dpi越来越高，印刷出的质量也越来越高。 以下数据纯供参考，如果厂家能印更高的质量记得往更高的质量走（分辨率） A4：300~450ppi A3：220~300ppi A2：150~220ppi X展架（900mm x1800mm）：72~120ppi 3m x 4m左右的户外展板、背景板、广告版：30ppi 足球场那么大：<1ppi 电脑配置高，就往高的设置。配置般就低一些，需要上网发送打印文件给厂家，公司网速一般...那也选择较低的那个数值吧，但不能再低了！ 4-4-2：印刷文件所需分辨率的计算方法 这里给大家提供一个计算方法，同理可算出99%物料印刷时应设置的分辨率。 首先明确一点：在A4纸上印刷时，分辨率设置在300~450ppi是最合适的。（这一点如果不赞成那下面的可以不看了） 下面我们计算在A3纸上印刷时应该使用的分辨率： 因为A4=210*297mm，A3=297*420mm 且两者长边与长边，短边与短边的比率都约等于1.414 又因为分辨率=像素/英寸，同一素材在A4，A3上的像素都保持不变 所以A4分辨率/A3分辨率=A3纸的尺寸/A4纸的尺寸=1.414 所以根据A4纸分辨率的最合适范围——300~450ppi可以算出 A3纸分辨率的最合适范围约为220~300ppi 这里取整数方便记忆。 假如！我要印刷一个长条状的卷轴，尺寸为420mm*3000mm，那分辨率应该设置成多少呢？ 显然，在这种尺寸奇怪的情况下，并不能通过上面的方法去算。那我就再说一个非常简单的方法：看印刷文件的最短边！ 比方这个420mm*3000mm的卷轴，那只需看其最短边——420mm即可，然后思考420mm应该用多大的分辨率。（答案是：220~300ppi） 4-4-3：印刷尺寸须知 画册等产品其实并不是A4大小，一般会用210mmx 285mm，因为厂家需要留位置裁剪、装订。所以产品尺寸的选择往往会影响到成本。 比如现在要去打印店打印一张220mm*300mm的海报，那就很有可能需要付出比用A4打印高一倍的价钱。为什么？问问你小学老师。所以，产品的尺寸在设计前最好还是问问你主管，了解清楚成本的问题。 爱护地球资源，从选尺寸开始。 4-4-4：字体大小 对于需要近距离阅览的印刷品，如：画册，小折页 正文：7pt（绝对不小，8pt已经微大了，10pt是给老人院做的产品） 最小字体大小：5.5pt（已经基本看不清了，名片可以再小0.5） 对于海报、X展架等物料的字体要用多大....这个就要凭经验凭感觉了... 经验少些的，可以拿尺子在墙上比划一个尺寸，感觉舒服，不大不小刚刚好，然后在AI里文字就按这个尺寸去设置。 若有朋友需求不同版面的最适合标准，请留言提问，如果有朋友已有这些数据，也麻烦好心告知一下，本人会更新贴上来 PART5：电商用图不用考虑分辨率！看px就够了！ 某天策划部姐姐给了个这样的需求： “做一个高大上的banner，1920px*600px，72dpi。” 这种时候，完全可以忽略“72dpi”这个信息 而且，这里应该用ppi，不要再问我为什么。 为什么不用考虑分辨率——ppi？下面我举一个栗子~
两张图的分辨率如上图所示，1和10000，分辨率完全不一样， 但两张图片的大小都是98.9KB，清晰度都一样！ 不信就右键——另存为，再右键——属性看看吧 如果想自己要找张图片尝试一下，请切记： 1. 要保持尺寸不变，PS里更改分辨率时尺寸会跟着改变
2. 若在PS里只更改了分辨率，图片大小却变化了，那是因为在另存为JPG时有个图片质量选项。试试以相同的图片质量先另存一张01.jpg，改分辨率再另存一张02.jpg。现在看看大小还不一样么？
5-2：显示器的分辨率 显示器的分辨率是什么鬼？72dpi？96dpi？ 下面一起来看看教程网上用户名为“歪博士”用户的见解： “操作系统的DPI并不是指显示器的分辨率，而是指对于屏幕显示的所有非栅格对象的采样分辨率。非栅格对象不仅包括文字、图形等矢量对象，对于系统而言，还包括应用程序的界面等。因为这些非栅格对象在显示时必须转换为栅格才能显示，这就涉及到了采样分辨率的问题。采样分辨率是以96DPI为基准的，即100%时的采样分辨率为96DPI。 这个96来源于早期的WIN系统显示器，那时显示器的分辨率基本是固定的，但是随着显示器制造技术的提高以及技术规格的多样性，如今这个96早已物是人非了，大多数显示器的分辨率不是96，比如博士（应该是指作者本人）的就是90。这种情况下，系统就假定用户的显示器分辨率为96，并以此为基准来生成非栅格对象的采样分辨率。可见，这个96，既是操作系统的一种无奈，同时也是一个历史的印记。目前，显示器的分辨率是以实际拥有的像素数来衡量的，而且用户是可以调整的，这种情况下显示器的DPI自然就是变化的了。” 而72这个数呢，据小编的朋友所说，则是来源于早期的苹果系统显示器。
话说回来：电商用图是否还需要设置分辨率（ppi）？！通过上面的洗脑，您是否已经同意本人的看法呢？ 不服来辩！拿出您的依据！ PART6：图片质量也不需要考虑分辨率！ 做设计、写文章、发微博、发微信时，绝对少不了上网找图这一环节 哪些图片合适，只需看两样东西！ 6-1：图片的尺寸（像素） 首先，了解产品，比如微信最大封面的配图，那我就得找一张360*200px的图片 如果是想在210x285mm画册的单页满页，那配图对应210mm边的像素少说也要1600px，最好是大于2500px，前者还要用修图软件硬性撑一下，后者直接用没问题。 要是尺寸不符合上述数值，也是没所谓的，就质量差一些，整本画册还不够精致而已，只要是客服能接受，绝对没问题~ 图片像素最小值 =画册边长*印刷机的分辨率 =210/25.4*300≈2480px 其中印刷机的分辨率不详，有的是450dpi，有的是200dpi，也有的为了提高颜色丰富度，用720dpi，这里用一个不大不小的300dpi来算，应该就刚刚好了。 当然是建议问问厂家这个数值，或者用之前的案例推算出这个值 6-2：经验，用双眼去感受 用双眼去看这张图显示100%时是否清晰，看着是否舒服 虽说像素越高图片质量越高 但还有其他的因素影响着，如摄影师技术，相机镜头质量等 用自己双眼去把关，这是决定图片质量的最重要因素。 |
|
|
来自： free_light > 《待分类》
