設計分享-標題

回首頁設計分享列表設計分享

-網頁設計- 像素、解析度與影像尺寸

time : 2009/4/28 下午 07:41:11    瀏覽次數:9736

 

 www.loopland.net    Lopland  | US 美國

loopland

Lopland是由Allan Sanders所設計的網站,內容包含了Allan的手繪稿與作品集,很有80年代的美式風格。

---------------------------------------------------------------------------------------------------------------------

像素


單的說,像素(pixel) 是構成數位影像的最小單位。

像素好比馬賽克牆上的其中一塊小磁磚,利用不同的顏色整齊排列在牆上,密度越高、圖像也就越清晰。

而電腦螢幕上所呈現出來的圖案,就是由像素組合而成的。

 

解析度


析度 (resolution)
指的是每一單位長度內所含的像素數目,而長度單位一般多使用 英吋(inch)

因此,解析度的表示方式為 像素 / 英吋 (pixels / inch)。

換句話說,解析度就是每一英吋中所擁有的 像素數目(pixels per inch,ppi)。

一般來說解析度又可分為 影像解析度與輸出解析度。

 

影像解析度


位影像中的解析度越高,即表示其每一英吋鐘內含的像素數目越多,相對的所能呈現的顏色就越多,品質也就越好。

雖然解析度越高,影像的品質越好,但是如果在編輯時將所有影像的解析度都調高,那麼所花費的成本也就越高。

因為解析度越高,其資料量也越大,所需的記憶體容量和CPU處理時間也就跟著提高,使用在網路上傳輸的時間也就越長。

因此,在編修數位影像時,首先要決定的是最終輸出的影像尺寸和品質要求,才能在限制的條件下,選擇最適當的解析度。

舉一個例子來說,電腦的資料量是以Byte來記錄,換算的公式如下:

 

1 byte = 8 bits; 1 KBytes = 1024 bytes

1Mbytes = 1024 kbytes ; 1 Gbyte = 1024 Mbytes

 

現在有一張 8英吋 X 10英吋的影像,如果以解析度100 ppi來製作,

那麼它所含有的像素數目便等於:8 X 100 X 10 X 100 = 800,000 pixels;

若此影像為RGB全彩模式,則每個像素需要 24bits 資料來記錄,

影像大小就是:800,000 pixels X 24 bits = 19,200,000 bits,經過換算可以得到資料量(檔案大小)約為:2.3 Mbytes。

 

19,200,000 bits / 8 = 2,400,000 Bytes

2,400,000 Bytes / 1024 = 2343.75 Kbytes

2343.75 Kbytes / 1024 大約等於 2.3 Mbytes

 

經由上面的例子可以瞭解,數位影像的檔案大小,是由影像尺寸解析度色彩模式決定的。

解析度的大小關係著影像品質,而資料的多寡又決定了記憶體容量和作業時間。

因此,在處理影像之前應先考慮輸出圖形的尺寸和解析度,在可接受的品質範圍之內儘量降低解析度,以減少檔案資料量。

 

輸出解析度


出設備的解析度,是指每單位長度內所能表現的點數,同樣的,點數越高所能表現的影像就越清晰、越鮮明。

就螢幕和印表機而言,一般是以 dpi (dot per inch)為單位,而網站印刷則是以網線的密度 lpi (line per inch)為單位。

傳統分色時,是經由過網程序產生網點,因此網點的密度和網線密度是相對應的。

螢幕的解析度,與其尺寸及顯示介面有直接的關聯,為了讓網路上大多數使用者可以看到完整正確的畫面,

一般均使用 72 dpi 做為網路影像的標準。

就印刷品而言,高品質的印刷多半採用150 或 175 lpi,要獲得最好的輸出品質,

影像的解析度應該就設定為輸出線術的2倍(2:1),超過2倍以上的畫,品質的提升很有限且肉眼不易察覺,

因此可不必使用過高的解析度,以免浪費記憶體和消耗執行的時間。

如果不要求太過完美的印刷品質,或受限於目前電腦設備的情況下,

可以將解析度降低,但影像解析盡量不低於網線數為訴求。

 

影像尺寸


像尺寸指的是圖像的寬度與高度的尺寸,它的單位可以用像素或公分來顯示。

當像素數目固定時,影像尺寸便決定了解析度,同理,解析度變動後影像尺寸也必定會跟著改變。

但在實務上,常常需要再不改變解析度的情形之下調整影像尺寸,或是固定影像尺寸而調整解析度。

面臨這種情況時,像素數目必須隨著改變,換句話說必須在影像中增加或刪除部分像素。

這個時候,Photoshop會進行重新取樣(resampling)工作,如此才能在失真最少的情形下,

移除部分像素或是在像素之間插入像素。

 

相關文章: -網頁設計- 點陣式與向量式影像

             -網頁設計- 數位影像的檔案格式

---------------------------------------------------------------------------------------------------------------------

標籤:網頁設計像素解析度影像尺寸


 

相關連結:http://sony1708.pixnet.net/blog/post/24788919

 

 

上一頁