超好用的WebP圖片新格式 : 檔案最小 支援透明圖檔

 

 

圖片對網站速度的影響

每次要架設網時，網頁都會加入許多圖片，使網站的觀賞性和可讀性增加，但其實圖片並非越多越好，過多的圖片會大大降低網站開啟的速度。

 

除了圖片的數量要適當外，圖片大小當然也會影響網站速度。如果要把圖片上傳到網站上，首先最好要裁切軟體或壓縮軟體，把圖片的檔案大小降低後再放上去比較好，有些圖片的原始檔案非常大，若直接就把圖片上傳到網站，那麼網站開啟速度肯定很慢，很多時候訪客等得不耐煩就關掉網頁了。

 

網站的圖片格式

目前網站用的主要圖片格式，大部分是JPG為主，其次是PNG、SVG等。

 

最近為了追求更加友善的網站開啟速度，尤其是圖片較多的電子商城店家，就很希望圖片檔案能再更小一點，以利網站的瀏覽與開啟，所以Google於2010年公布了WebP的這項新的圖片格式。

 

網站中的WebP格式

WebP是一種次世代的新圖片格式，可以提供高度的無失真壓縮，大大減少檔案大小，提高圖片檔案在網路上的傳送時間，但同時又能維持和JPG、PNG等格式相同的圖片品質。

 

根據官方資料顯示，WebP可以和PNG一樣，呈現透明背景的圖案，但是檔案大小比PNG檔少了45%，就算是PNG已經用壓縮工具壓縮處理過，WebP仍可以減少28%的檔案大小。

 

雖然WebP可以減少圖片檔案的大小，它有優點也有缺點。

 

WebP檔案較小

WebP圖片格式，和其他常見的格式相比，在相同的尺寸下去比較，檔案是所有檔案格式最小的，當然檔案較小，對網頁的載入速度也會更加友善。

 

可動態與透明化

WebP和PNG依樣，支援動畫與透明度，並分成失真、無失真壓縮模式。

 

在以前，網站圖片要呈現動畫(動態圖檔)，大多會選用GIF格式檔案來顯示，如果是背景透明的圖片會選用PNG格式，而現在則多了檔案較小的WebP可選。

 

大部分瀏覽器都支援

根據官方資料顯示，截至2021年6月，已有95%瀏覽器支援WebP的格式，但這也代表並非所有瀏覽器都支援。不過WebP是未來的圖片趨勢，現在尚未支援的瀏覽器，在未來最新版本肯定都會更新支援的，例如先前無法支援的瀏覽器Safari，也在iOS14和macOS 11 支援webp格式。