當(dāng)前位置:首頁(yè)>ps入門(mén)教程>ps基礎(chǔ)教程>技巧教程>教程內(nèi)容

PS存儲(chǔ)到網(wǎng)頁(yè)格式的最佳方式

來(lái)源:網(wǎng)絡(luò) 作者:西部宰牛 學(xué)習(xí):5811人次
當(dāng)需要把圖片存儲(chǔ)為網(wǎng)頁(yè)所用格式時(shí),為了確保圖片無(wú)卡頓地清晰顯現(xiàn),考慮它的品質(zhì)和大小總是很必要的。這個(gè)教程就會(huì)教給你關(guān)于"存儲(chǔ)為web所用格式"你需要知道的知識(shí)。

存儲(chǔ)為web所用格式

互聯(lián)網(wǎng)幾乎是當(dāng)今最大的藝術(shù)、圖形和相片分享平臺(tái)之一,因此掌握一些保存為網(wǎng)頁(yè)格式的基礎(chǔ)知識(shí)就非常重要了。實(shí)際上,保存為網(wǎng)頁(yè)格式是一項(xiàng)平衡藝術(shù)——你必須在圖片品質(zhì)和介質(zhì)的文件尺寸之間做好平衡,以便滿(mǎn)足你的個(gè)人需求。

在速度相對(duì)重要的地方(如迅速地加載網(wǎng)站),你可能需要犧牲一些圖片品質(zhì)。而在品質(zhì)重要的地方,則需要犧牲一點(diǎn)速度。這堂課程的目的就是向你介紹一些方法,在這兩個(gè)因素之間尋求平衡,與此同時(shí)保留非常好的圖像品質(zhì)。

無(wú)損 vs 損耗數(shù)據(jù)

雖然存在有非常多的圖片格式(僅舉幾例,如jpeg,gif和png),但是依據(jù)壓縮方法不同,所有的圖片都能進(jìn)一步歸類(lèi)為兩大類(lèi)別:無(wú)損和有損。無(wú)損數(shù)據(jù)壓縮保證了圖像在沒(méi)有任何品質(zhì)和信息丟失的情況下重現(xiàn),而有損數(shù)據(jù)壓縮的結(jié)果就是可能造成品質(zhì)和信息的丟失。在平面設(shè)計(jì)領(lǐng)域最主流的無(wú)損媒介格式包括GIF,PNG,以及TIFF,而JPEG是最主流的有損壓縮的圖形格式。

如何用PHOTOSHOP保存網(wǎng)頁(yè)格式

PS擁有非常好的方法來(lái)為網(wǎng)頁(yè)優(yōu)化圖片。在ps中,選擇文件>存儲(chǔ)為web格式或者使用快捷鍵ctrl+alt+shift+s。一個(gè)新的對(duì)話(huà)框?qū)?huì)彈出,這里有所有為網(wǎng)頁(yè)保存和優(yōu)化圖片的設(shè)置。

PS存儲(chǔ)到網(wǎng)頁(yè)格式的最佳方式

我會(huì)通過(guò)以下一些生活中的案例來(lái)演示如何使用對(duì)話(huà)框中的設(shè)置。

為網(wǎng)頁(yè)存儲(chǔ)圖像

由于圖片巨大的文件體積,它們更多是以有損壓縮格式來(lái)保存的。甚至在拍照時(shí),相對(duì)于數(shù)倍大小的RAW格式,相機(jī)也傾向于用有損格式(如JPEG)來(lái)保存圖片。

JPEG是日常中首選的圖片格式,它是以它的創(chuàng)造者"聯(lián)合圖像專(zhuān)家小組"來(lái)命名的。Jpeg之所以能夠成為標(biāo)準(zhǔn),是因?yàn)樗趬嚎s圖像數(shù)據(jù)的同時(shí)可以保留高品質(zhì),并且在相關(guān)信息上能夠接近無(wú)損圖像的效果。

當(dāng)你在保存圖片的時(shí)候,有幾種網(wǎng)頁(yè)格式預(yù)設(shè)可供選擇。對(duì)于一張圖片,你應(yīng)該考慮是使用JPEG 低、JPEG 中,還是JPEG高。觀(guān)察下面的對(duì)比圖,(可以)發(fā)現(xiàn)案例中的圖片經(jīng)過(guò)壓縮后并沒(méi)有多大的品質(zhì)損耗。相比起超過(guò)250KB的源文件,我們選擇中等質(zhì)量或者高等質(zhì)量的壓縮預(yù)設(shè)就能夠得到一個(gè)大小不超過(guò)30KB,并有合適品質(zhì)的圖片。

PS存儲(chǔ)到網(wǎng)頁(yè)格式的最佳方式

GIF圖像

有些時(shí)候,你會(huì)被要求用無(wú)損格式來(lái)保存,以便最好地優(yōu)化你正在創(chuàng)作的任何作品。這在網(wǎng)頁(yè)設(shè)計(jì)中時(shí)常遇到,在布局上使用比普通圖片更少的顏色。

GIF,全稱(chēng)為"圖像互換格式",是一種只用到256個(gè)顏色調(diào)色板的圖片格式,這讓它成為不需要使用太廣泛色域的網(wǎng)頁(yè)圖片的理想選擇。GIF也能將單個(gè)像素設(shè)置成透明,不過(guò)這并不在這個(gè)教程的討論范圍之內(nèi)。下面展示了一張(使用著256個(gè)顏色的)GIF圖像和JPEG圖像的對(duì)比照,它們擁有同樣的大小.正如你所見(jiàn)到的,無(wú)損GIF圖片能更好的接近源文件。

PS存儲(chǔ)到網(wǎng)頁(yè)格式的最佳方式

因?yàn)镚IF圖像受到256色的限制,它本應(yīng)該極少被用到圖片中,但是他們恰好適合那些使用純色或是有限色彩的圖像。對(duì)于圖片來(lái)說(shuō),通常來(lái)說(shuō)不是使用JPEG有損壓縮,就是GIF無(wú)損格式。

高品質(zhì)圖像和無(wú)損PNG

PNG,全稱(chēng)為"可移植網(wǎng)絡(luò)圖形",是一種類(lèi)似于GIF的無(wú)損格式,只是它支持更為豐富的色彩(有時(shí)候也讓它的體積變大),而且可以支持帶透明圖層的Alpha通道,而非單一透明像素。

PNG圖像正在日漸取代GIF,主要是因?yàn)樵谥С指S富的色彩方面,png通常比gif的壓縮效果要更好。雖然它還不想GIF有廣泛的支持,但是無(wú)疑它正朝著那個(gè)方向前進(jìn)。

當(dāng)圖片必須保留完整品質(zhì)在網(wǎng)絡(luò)上進(jìn)行傳輸?shù)臅r(shí)候,PNG是最佳的選擇。比起用JPEG傳輸圖片,(PNG)會(huì)令你得出更大的圖片大小,但是有時(shí)候這是一個(gè)非常有必要的犧牲。當(dāng)一個(gè)圖片包含銳利的線(xiàn)條、以及必須保留清晰的文字時(shí),PNG通常是一個(gè)更好的選擇,當(dāng)然了,最終還是要由設(shè)計(jì)師來(lái)決定使用哪一種格式。

學(xué)習(xí) · 提示

  • 一定要打開(kāi)PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習(xí)時(shí),大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問(wèn):新手求助
  • 加官方微信,隨時(shí)隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們學(xué)更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評(píng)論 | 交作業(yè) -
最新評(píng)論
ywsapassjie2018-10-08 02:41
贊喔
愛(ài)哭的小女孩酷2018-10-08 10:06
喜歡
心無(wú)旁騖FH2017-05-28 07:12
支持,支持
隨欲而安19902017-05-28 12:41
虛心學(xué)習(xí)
zonghao2017-05-27 09:36
給力

關(guān)注大神微博加入>>

網(wǎng)友求助,請(qǐng)回答!