為了讓電腦直接識(shí)別webp圖片嗦枢，介紹一下電腦直接預(yù)覽webp的插件方淤。
webp是Google開發(fā)的一種支持有損壓縮和無損壓縮的圖片格式（也支持alpha通道，動(dòng)畫）逃魄。在相同尺寸下會(huì)比jpg筋蓖、png有更小的體積卸耘，同時(shí)清晰度也可以保障，所以在網(wǎng)絡(luò)傳輸上會(huì)比png和jpg更快粘咖。
UI設(shè)計(jì)師除了要完成界面設(shè)計(jì)外蚣抗，還要給程序員提供頁面的圖片資源---切圖。我們經(jīng)常使用的切圖格式有jpg瓮下、png翰铡、gif動(dòng)圖這幾種位圖，當(dāng)然也有svg這種矢量格式圖片讽坏，以及iconfont解決方案锭魔。下面是簡單的介紹對(duì)比。
jpg-有損壓縮路呜，適合畫面復(fù)雜的照片類圖片迷捧。png-無損壓縮，支持alpha透明胀葱，切圖首選漠秋。gif-動(dòng)態(tài)圖片，支持alpha索引透明抵屿。Iconfont-代碼化庆锦、矢量化的前端圖標(biāo)解決方案。svg-矢量圖片轧葛，體積小不失真搂抒。
隨著時(shí)代和技術(shù)的發(fā)展，傳統(tǒng)的圖片格式慢慢不適用如今的網(wǎng)絡(luò)環(huán)境和用戶需求朝群，webp就是一種在體積和視覺表現(xiàn)方面都比較好的格式燕耿。不過在瀏覽器支持這方面，webp還是沒法和png姜胖、jpg相比誉帅，由于是Google開發(fā)的，所以自家的Chrome瀏覽器還是很好支持的右莱。
既然webp有著非常好的優(yōu)點(diǎn)蚜锨，所以目前有越來越多的網(wǎng)站使用÷眩可是下載到電腦中卻無法顯示預(yù)覽亚再。尤其是Mac電腦。
很多時(shí)候我們直接按空格鍵晨抡，使用QuickLook就可以預(yù)覽很多格式的文件氛悬。比如查看PSD文件则剃，不需要打開PS，直接按空格就可以查看如捅。同樣的PDF棍现、PPT、Word都可以直接預(yù)覽镜遣。這樣的操作有個(gè)傳神的名字：一指禪己肮。
但是預(yù)覽webp就不行了。只能把webp圖片拖動(dòng)到瀏覽器里面去查看悲关。不過谎僻，作為一名追求工作效率的UI設(shè)計(jì)師，我可忍受不了把webp圖片拖到Chrome去查看這種復(fù)雜糟糕的體驗(yàn)寓辱。
所以給大家推薦一個(gè)插件：WebP.qlgenerator艘绍，屬于QuickLook的增強(qiáng)型插件。直接讓webp像jpg讶舰、png那樣正常去看鞍盗。
QuickLook插件安裝
1、首先下載插件：百度云盤鏈接：?https://pan.baidu.com/s/1YQuVAgu7mx5YtkCX3a4y8w? 提取碼: ncbj
2跳昼、移動(dòng)插件到QuickLook目錄：復(fù)制路徑/Library/QuickLook般甲，打開Finder，依次選擇：前往-前往文件夾-粘貼路徑后回車鹅颊，然后把下載的插件復(fù)制到這個(gè)目錄敷存，這時(shí)候會(huì)提示輸入你的電腦密碼。
3堪伍、用終端重啟QuickLook：打開終端（Terminal）锚烦，輸入qlmanage -r并回車，之后出現(xiàn)resetting quicklookd提示就可以帝雇。
我們?cè)倏纯磩偛艧o法預(yù)覽的webp圖片涮俄，已經(jīng)可以預(yù)覽了。
webp動(dòng)圖：svg其實(shí)是支持動(dòng)圖的尸闸，驚不驚喜彻亲，意不意外？知乎上有分享svg動(dòng)圖的知識(shí)吮廉。webp動(dòng)態(tài)圖像的體積相比gif也會(huì)小很多苞尝，但是目前這個(gè)插件還無法直接識(shí)別webp動(dòng)圖，只支持靜態(tài)圖片預(yù)覽宦芦。
Win電腦查看webp的方法：
Win電腦下webp也是無法直接顯示縮略圖的宙址，使用Win的同學(xué)可以安裝Windows WebP 編解碼組件：?https://www.cr173.com/soft/72994.html
