存儲(chǔ)技巧,講解AI存儲(chǔ)為WEB所用格式的一些知識(shí)

雖然這是講解AI的存儲(chǔ),但photoshop也可以參考一下。在AI中“存儲(chǔ)為WEB所用格式”的目的是為了優(yōu)化圖片在網(wǎng)站或其他屏幕端的展示效果,例如平板或手機(jī)。“優(yōu)化”這個(gè)詞是指在圖片大小和品質(zhì)之間的最優(yōu)組合。我們希望在網(wǎng)頁里能盡快加載圖片,那么圖片就必須要小,但是我們又不希望因此而損害圖片的品質(zhì)。“保存為WEB所用格式”這一命令讓我們可以預(yù)覽被優(yōu)化后的矢量圖,以便我們能調(diào)試到最佳效果。

我們會(huì)在這篇文章中帶大家回顧一下保存為WEB的圖片的格式,然后向大家展示哪類作品適合保存于哪種格式。UI設(shè)計(jì)師們快學(xué)起來!

一、保存為WEB的對(duì)話框

進(jìn)入【文件>存儲(chǔ)為WEB所用格式】就會(huì)彈出對(duì)話框,可以說這個(gè)命令幾乎就是一個(gè)獨(dú)立的應(yīng)用,所以這個(gè)對(duì)話框窗口占據(jù)了整個(gè)屏幕。

存儲(chǔ)技巧,講解AI存儲(chǔ)為WEB所用格式的一些知識(shí)_www.theoat.com.cn

你可以通過三種方式瀏覽你的作品。最左邊的“原稿”可以簡單地展示原稿效果,但由于你是要預(yù)覽被優(yōu)化后的效果,因此這個(gè)選項(xiàng)幾乎沒有作用。你也可以來到“優(yōu)化”這個(gè)選項(xiàng),在這里可以預(yù)覽到優(yōu)化后的效果,或者你還可以選擇“雙聯(lián)”,這個(gè)選項(xiàng)會(huì)讓你將原稿和優(yōu)化后的作品左右對(duì)比進(jìn)行預(yù)覽。在下圖中,左邊的是原稿,右邊是優(yōu)化后的效果(在本例中,是作為GIF格式進(jìn)行優(yōu)化的)。

存儲(chǔ)技巧,講解AI存儲(chǔ)為WEB所用格式的一些知識(shí)_www.theoat.com.cn

在左下角的下拉框選項(xiàng)中選擇預(yù)覽的比例值,你可以輸入比例來縮放預(yù)覽的圖片,也可以通過快捷鍵方式來調(diào)整和縮放圖片。

點(diǎn)擊左下角的“預(yù)覽”按鈕,你立刻能在自己的默認(rèn)瀏覽器中看到這張圖片的展示效果,如果你還想知道別的瀏覽器的效果,你就需要點(diǎn)擊按鈕右邊的地球圖標(biāo)來添加更多。

存儲(chǔ)技巧,講解AI存儲(chǔ)為WEB所用格式的一些知識(shí)_www.theoat.com.cn

保存為WEB格式的界面中最為重要的部分就是圖片大小,在每個(gè)預(yù)覽圖的下方都會(huì)出現(xiàn)這個(gè)圖片的文件類型和大小。在下圖中可以看到,我們的左邊的原稿是ai格式,文件大小是1.85M,而右邊優(yōu)化后為GIF格式,文件大小變?yōu)榱?4.53K。既然是要在文件大小和品質(zhì)之間找到最佳平衡,因此你需要時(shí)刻保持對(duì)文件大小的關(guān)注。

存儲(chǔ)技巧,講解AI存儲(chǔ)為WEB所用格式的一些知識(shí)_www.theoat.com.cn

教程未完,請(qǐng)看下一頁!

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

  • 打開ps,跟著教程做一遍,做完的圖要到這里交作業(yè):提交作業(yè)
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:ps新手求助
  • 加官方微信,隨時(shí)隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們微博:@photoshop教程論壇
  • 想學(xué)更多的同學(xué),可以訂閱我們郵件,每天都有新教程發(fā)給你:http://t.cn/Rzm5o8Y
PS教程自學(xué)網(wǎng) 歡迎投稿教程:http://i.16xx8.com

    你心似海是我 說: 感謝
    溢香的腳丫子 說: 我就是在這網(wǎng)站學(xué)會(huì)的
    古族語言 說: 這個(gè)網(wǎng)站對(duì)新手真心不錯(cuò)
    琴弦難 說: 天天來這看教程
    你不行換人 說: 早想學(xué)這種了
    說: 來支持了
    抗婊愛國青年 說: 頂一下
    夠不夠久情 說: 大棒了,以后天天來
    愛你一萬年 說: 好棒的教程
    李玉子涵 說: 這里教程真全
    攝影設(shè)計(jì) 說: 學(xué)習(xí)了 謝謝