「明明就跟美工說了，我要一張1024 DPI的圖，結果她還是給我一張3千多的！」

網頁設計的工作，常會碰到工程師和美工設計的溝通上，出現這樣的問題，其實，圖片的尺寸在工程師和美工的理解上，經常都有著不同的理解。

在工程師的世界裏

網頁、App是工程師最常會用到圖片的地方；工程師因為各種瀏覽器、手機、平板的螢幕解析度與密度的不同，會接觸到如px, dp, sp等單位，這些單位的意義：

• px指的是pixel，即點陣圖中的寬、高計算單位，圖片放大後的每一個點就是一個pixel
• dp指的是Density independent Pixel，通常在高解析度的螢幕中，螢幕的密度會是1.5或2.0倍，所以可以顯示出較細緻的畫面；當某一張圖片被設定為以400 x 400 dp的大小，那麼在螢幕密度為2.0裝置上，必須提供實際大小是800 x 800 px的圖片。
• sp指的是Scale-independent Pixel，在行動裝置上可以設定字體放大、縮小比例，而這個單位是在行動裝置上，配合使用者自訂的字體大小，而自動跟著縮放的單位。

在美工的世界裏

許多美工是從平面設計起步，逐步接觸網頁或App設計，才開始與工程師合作的；美工人口中說的DPI，如400 DPI，乍聽之下與400 dp、400 px都很像，也因此在溝通上常發生誤解；工程師以為美工說的400 DPI，就是400 px；而美工則以為工程師要一張400 px的圖，就是出一張400 DPI的圖給他？

• DPI指的是dots per inch，指的是當圖片列印出來的時候，每一英寸裏有多少點，換言之，DPI數值越大，列印出來的圖片越精細，圖片的解析度也就越高。

因此，當工程師要一張400 x 400 px的圖，要告訴美工：「我要寬、高各400個像素(pixel)的圖片」；而美工則請不要再跟工程師談DPI了，這是平面設計在用的東西，網頁/App的切版完全不管這個單位，所以工程師是聽不懂的！