使用WebP圖片格式節省網站流量、帶寬和存儲空間,加快網站加載速度。
目前在互聯網上,圖片流量仍佔據較大的一部分。因此,在保證圖片質量不變的情況下,節省流量帶寬是大家一直需要去解決的問題。傳統的圖片格式,如 JPEG,PNG,GIF 等格式圖片已經沒有太多的優化空間。因此 Google 於 2010 年提出了一種新的圖片壓縮格式 — WebP,給圖片的優化提供了新的可能。
什麼是WebP
WebP(發音:weppy)是一種同時提供了有損壓縮與無損壓縮(可逆壓縮)的圖片文件格式,派生自影像編碼格式VP8,被認為是WebM多媒體格式的姊妹項目,是由Google在購買On2 Technologies後發展出來,以BSD授權條款發佈。
WebP最初在2010年發佈,目標是減少文件大小,但達到和JPEG格式相同的圖片質量,希望能夠減少圖片檔在網絡上的發送時間。2011年11月8日,Google開始讓WebP支持無損壓縮和透明色(alpha通道)的功能,而在2012年8月16日的參考實做libwebp 0.2.0中正式支持。根據Google較早的測試,WebP的無損壓縮比網絡上找到的PNG檔少了45%的文件大小,即使這些PNG檔在使用pngcrush和PNGOUT處理過,WebP還是可以減少28%的文件大小。
WebP支持的像素最大數量是16383x16383。有損壓縮的WebP僅支持8-bit的YUV 4:2:0格式。而無損壓縮(可逆壓縮)的WebP支持VP8L編碼與8-bit之ARGB色彩空間。又無論是有損或無損壓縮皆支持Alpha透明通道、ICC色彩配置、XMP詮釋數據。
WebP有靜態與動態兩種模式。動態WebP(Animated WebP)支持有損與無損壓縮、ICC色彩配置、XMP詮釋數據、Alpha透明通道。
兼容性
現在主流的瀏覽器都支持WebP了,Safari和Firefox可能需要較新版本才支持,我測試的最新版本Firefox已經支持WebP,IE不支持。Chrome內核的瀏覽器都支持。微信和QQ測試也支持。
目前很多大型網站都已經使用WebP格式的圖片了,微信公眾號文章在很早之前也已經開始使用了,還有很多CDN支持將圖片轉換為WebP。
圖片轉WebP格式
這裡推薦幾個在線轉webp圖片的網站和工具:
webp2jpg:https://renzhezhilu.gitee.io/webp2jpg-online/
支持jpeg、jpg、png、gif、svg、ico、bmp轉webp,可批量。
注:這個網站gif只支持轉換第一幀圖片。
智圖:https://zhitu.isux.us/
智圖是騰訊ISUX前端團隊開發的一個專門用於圖片壓縮和圖片格式轉換的平臺,其功能包括針對png,jpeg,gif等各類格式圖片的壓縮,以及為上傳圖片自動選擇最優的圖片格式。同時,智圖平臺還會為用戶轉換一份webp格式的圖片。
注:不支持超過5M的圖片,超過5M的格式需要下載客戶端。客戶端可以批量轉換,轉換不是離線的,需將圖片上傳服務器轉換,對gif支持好像有點問題。
客戶端下載地址:http://go.zeruns.tech/N
Any To WebpTool:https://zeruns.lanzous.com/id7zqab
支持jpg、png、gif,壓縮效果很好,對gif支持也不錯。下面的效果圖都是用這個軟件轉換的。
效果圖
普通圖片轉webp圖片質量和大小對比。
下面三張原圖大小和壓縮為webp後大小分別為:
原圖 | webp |
---|---|
4.91MB | 323KB |
6.01MB | 3.70MB |
3.36MB | 454KB |
圖片請看原文:https://blog.zeruns.tech/archives/547.html
推薦文章
- 高性價比和便宜的VPS/雲服務器推薦:https://blog.zeruns.tech/archives/383.html
- 各大CDN平臺速度評測:https://blog.zeruns.tech/archives/506.html
- 學生優惠權益大全:https://blog.zeruns.tech/archives/321.html
- 怎樣搭建個人博客:https://blog.zeruns.tech/archives/218.html
- 使用阿里雲搭建網站並實現站庫分離:https://blog.zeruns.tech/archives/513.html
- 各大雲服務器廠商618活動優惠大全:https://blog.zeruns.tech/archives/549.html