WebP 文件格式是一種基于 RIFF(資源互換文件格式)的文檔格式。

WebP 是 2010 年 Google 開(kāi)發(fā)的一種圖片格式，它為網(wǎng)頁(yè)上的圖片提供了卓越的無(wú)損和有損壓縮。網(wǎng)站開(kāi)發(fā)者們可以使用 WebP 來(lái)創(chuàng)建尺寸更小、細(xì)節(jié)更豐富的圖片，以此來(lái)提高網(wǎng)站的速度。更快的加載速度對(duì)于網(wǎng)站的用戶體驗(yàn)和網(wǎng)站的營(yíng)銷(xiāo)效果是至關(guān)重要的。

為了在所有設(shè)備和用戶中達(dá)到最佳加載效果，網(wǎng)站上的圖片文件大小最好不超過(guò) 500 KB。

與 PNG 圖片相比，WebP 無(wú)損圖片通常至少要比 PNG 圖片小 25%。在同等的 SSIM(結(jié)構(gòu)相似度)質(zhì)量指標(biāo)下，WebP 有損圖片通常比 JPEG 圖片小 25% 到 34%。

無(wú)損 WebP 也支持透明度。而在可接受有損 RGB 壓縮的情況下，有損 WebP 也支持透明度，通常其大小比 PNG 文件小三倍。

Google 報(bào)告稱(chēng)，把動(dòng)畫(huà) GIF 文件轉(zhuǎn)換為有損 WebP 后文件大小減少了 64%，轉(zhuǎn)換為無(wú)損 WebP 后文件大小減少了 19%。

現(xiàn)在全球在用的 80% 的 web 瀏覽器兼容 WebP 格式。目前，Apple 的 Safari 瀏覽器還不兼容。

創(chuàng)建更小的 WebP 圖片

測(cè)試的頁(yè)面返回了三張圖片。在它生成的報(bào)告中，它提供了推薦和目標(biāo)。我選擇了它報(bào)告有 650 KB 的 app-graphic 圖片。通過(guò)把它轉(zhuǎn)換為 WebP 格式，預(yù)計(jì)可以把圖片大小降到 61 KB，節(jié)省 589 KB。我在 Photoshop 中把它轉(zhuǎn)換了，用默認(rèn)的 WebP 設(shè)置參數(shù)保存它，它的文件大小為 44.9 KB。比預(yù)期的還要好！從下面的 Photoshop 截圖中可以看出，兩張圖在視覺(jué)質(zhì)量上完全一樣。

左圖：650 KB(實(shí)際大小)。右圖： 44.9 KB(轉(zhuǎn)換之后的目標(biāo)大小)。

把圖片轉(zhuǎn)換為 WebP

你也可以用 Linux 的命令行工具把圖片從 JPG/PNG 轉(zhuǎn)換為 WebP：

在命令行使用 cwebp 把 PNG 或 JPG 圖片文件轉(zhuǎn)換為 WebP 格式。你可以用下面的命令把 PNG 圖片文件轉(zhuǎn)換為質(zhì)量參數(shù)為 80 的 WebP 圖片。

cwebp?-q?80?image.png?-o?image.webp

你還可以用 Image Magick，這個(gè)工具可能在你的發(fā)行版本軟件倉(cāng)庫(kù)中可以找到。轉(zhuǎn)換的子命令是 convert，它需要的所有參數(shù)就是輸入和輸出文件：

convert?pixel.png?pixel.webp

使用編輯器把圖片轉(zhuǎn)換為 WebP

要在圖片編輯器中來(lái)把圖片轉(zhuǎn)換為 WebP，可以使用 GIMP。從 2.10 版本開(kāi)始，它原生地支持 WebP。

如果你是 Photoshop 用戶，由于 Photoshop 默認(rèn)不包含 WebP 支持，因此你需要一個(gè)轉(zhuǎn)換插件。遵循 Apache License 2.0 許可證發(fā)布的 WebPShop 0.2.1 是一個(gè)用于打開(kāi)和保存包括動(dòng)畫(huà)圖在內(nèi)的 WebP 圖片的 Photoshop 模塊，在 https://github.com/webmproject/WebPShop 可以找到。

為了能正常使用它，你需要把它放進(jìn) Photoshop 插件目錄下的 bin 文件夾：

Windows x64 ：C:Program FilesAdobeAdobe PhotoshopPlug-insWebPShop.8bi

Mac：Applications/Adobe Photoshop/Plug-ins/WebPShop.plugin

WebP 和未來(lái)

WebP 是一個(gè)健壯而優(yōu)化的格式。它看起來(lái)更好，壓縮率更高，并具有其他大部分常見(jiàn)圖片格式的所有特性。

總結(jié)

以上是生活随笔為你收集整理的webp转换gif_用 WebP 创建尺寸更小、细节更丰富的图片，以此来提高网站的速度...的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。