作者：Bicycl
作者授權早讀課發表，轉載請聯繫作者。
歡迎投稿到早讀課，投稿郵箱：mm@zaodula.com
說在前面：
1. 該文章不屬於教程，更應稱為討論，文章內容純屬個人觀點；
2. 歡迎各位對文章內容提出自己的看法，共同討論出正確的答案，本人會在有結果時對該文章進行更新，更新在本人站酷帳號上；
3. 也歡迎各位提出自己一直疑惑的問題，我會盡力解答。問題有趣也會更新在文章中；
4. 若需轉發，請私聊，每次更新都準備了word版；
5. 最後更新：2015.08.23
其中，像素單位為px，英寸單位為in，為了更通俗易懂，下面我舉個慄子！
在PS cc 2015(試用版)中新建的一個文檔
對於該文檔，圖中的每一個小黑格就是1像素（px）
1. 像素並沒有明確的實際大小，它是用來衡量圖片質量的一個數據；
2. 每1像素可以理解為1個非漸變的色塊。
3. 電腦上看到的每一張圖片都是由n個像素拼成的；
4. 任何一張圖片，若需保持它的質量不變，那它的像素肯定也是固定不變的。
上圖的寬是1英寸，高是1.5英寸，解析度是10（這裡為了展示，明顯放大了的）
將公式轉換一下可以得到：
像素=英寸*解析度
所以橫向可以數到10個黑格子（像素），豎向則可以數到15個黑格子（像素）。
還記不記得某些手機的宣傳單？「3百萬像素，XXX鏡頭！」其實那就是說該手機拍處的照片的大小（像素）相乘約等於3000000，它裡面有3百萬個像素小格。然而看到這裡你可能會疑惑：像素表示的是長度還是面積？其實我也不知道，但不知道又有什麼所謂？知道又有什麼卵用？數學考一百分？
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，有些事知道事實真相，不要盲目的從眾就夠了，不必要太較真。
像素、英寸都屬於尺寸。前者（像素）電商用，即一切放在數碼產品的圖像都是用像素來作為尺寸單位 。後者（英寸）紙媒用，即需要列印噴繪時，需結合解析度一起使用。
英寸還可以選擇米、釐米、毫米等，它們都可以相互轉換。這時的尺寸則是指噴繪出來的實際產品的大小，解析度則影響產品的質量（圖像清晰度）。
這裡內容量比較大...請備好枕頭方便隨時入睡，本人在寫這部分的那幾個晚上都睡的非常的舒服~
4-1：web
下面在說網頁尺寸規範前，我們先來看看市場調研機構StatCounter對「2014年最主流的屏幕尺寸」的統計報告（調查範圍應該是米國）
諸位應該能看懂吧...已經被廣大接受的1920x1080並不是最多人用的！而已經用了好久的1366x768卻是佔了最大比重！或許是因為筆記本顯示器問題。Anyway，這些數據還是非常有參考意義的，最起碼是知道不要一味追求1920x1080，即使整個公司的顯示器都是這個解析度，還需考慮用戶真實的需求。所以，開工前最好是能做個類似這樣的調查，沒錢調查就上網找別人的統計報告看看，除非產品是做個你自己一個人用的。
以上4個數據為目前最常用的四個網頁寬度尺寸，其中考慮到瀏覽器邊框寬度，以及上下滾動條寬度，實際尺寸可能會與上述數據有點出入。但在設計時按上面的去設計是沒問題的，後面真正應用時，按程式設計師的要求去切圖就好。而且，切圖還不一定是你設計師的工作。
其中，1000px全網適用(也有人是用960px的，其實差不多)，其他3個則不一定所有人都適用，有多少人合適可以按上述的統計報告預估。
所以優秀的策劃會根據產品的主要受眾來決定產品細節，如QQ官網，由於什麼用戶都有，所以理所當然的適用了1000px。
誠意推薦做法：做1920px的，主要內容放在1000px內，1000px外放相關元素背景或超級大圖。網頁正文推薦大小：14px這個數值絕對是綜合性比較好的數值~實際情況（客戶無理且硬性需求），靈活面對
4-2：手機
這裡且不說主流手機的尺寸是多少多少了，還是和web一樣：了解產品的定位，了解產品的主要用戶是用什麼移動端的，這些移動端的尺寸又是什麼？
上面的信息肯定不是由設計師去提供，但了解設計的初衷是非常重要的！
不然，你就一美工。
若有朋友需求不同界面的最適合標準，請留言告知，如果有朋友已有這些數據，也麻煩好心告知一下，本人會更新貼上來（其實是我懶得找了...好睏）
講多無謂，食多會滯，舉個慄子來說吧！
其中建議字體最小：20px。也有人是用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）？！通過上面的洗腦，您是否已經同意本人的看法呢？不服來辯！拿出您的依據！
做設計、寫文章、發微博、發微信時，絕對少不了上網找圖這一環節哪些圖片合適，只需要看兩樣東西！
6-1：圖片的尺寸（像素）
首先，了解產品，比如微信最大封面的配圖，那我就得找張360*200px的圖片，如果是想在210x285mm畫冊的單頁滿頁，那配圖對應210mm邊的像素少說也要1600px，最好是大於2500px，前者還要用修圖軟體硬性撐一下，後者直接用沒問題。
要是尺寸不符合上述數值，也是沒所謂的，就質量差一些，整本畫冊還不夠精緻而已，只要是客服能接受，絕對沒問題~
圖片像素最小值=畫冊邊長*印刷機的解析度=210/25.4*300≈2480px
其中印刷機的解析度不詳，有的是450dpi，有的是200dpi，也有的為了提高顏色豐富度，用720dpi，這裡用一個不大不小的300dpi來算，應該就剛剛好了。當然是建議問問廠家這個數值，或者用之前的案例推算出這個值
6-2：經驗，用雙眼去感受
用雙眼去看這張圖顯示100%時是否清晰，看著是否舒服。雖說像素越高圖片質量越高，但還有其他的因素影響著，如攝影師技術，相機鏡頭質量等。用自己雙眼去把關，這是決定圖片質量的最重要因素。
Anyway，完全不用理解析度！
原文連結：http://www.zcool.com.cn/article/ZMTcyNzcy.html
網際網路早讀課，每天八點，風雨無阻
專注產品、設計、交互、運營
微博：@網際網路早讀課
QQ 10群：215027395
加群密碼：地區-職位-暱稱
網際網路早讀課是WeMedia自媒體成員之一，
WeMedia是自媒體第一聯盟，覆蓋5000萬人群