WebP 是 Google 发明的更小的替代 JPEG 和 PNG 的格式。最近有很多关于WebP支持的迷惑，细说来便是可以用它做什么，不能做什么，比如说浏览器支持，CMS 支持等等。本日我想打消你所有可能的疑虑。WebP 的支持程度实际上比你想的可能要好得多。
WebP 浏览器支持并非所有浏览器都支持 WebP，以是很主要的是你得清楚哪些浏览器是支持的，这可能会影响你做决定，是否在你的网站或项目中转换并采取 WebP 图片。下面是所有主流浏览器及其 WebP支持程度。
截至 2016 年 7 月，环球浏览器对 WebP 支持率是 69.6% – caniuse.com
Google Chrome 官方自 Chrome 23 起开始支持 WebP）（最初发布于 2012 年 11 月），自 Chrome 9 起部分支持。部分支持指的是并不支持无损的、支持 alpha 通道的 WebP。
Google 的安卓浏览器（Google’s Android browser）从 4.2 版本起开始官方支持 WebP（最初发布于 2012 年 11 月），4 版本起开始部分支持。Google Chrome 安卓版（ Google’s Chrome for Android browser）从 Chrome 50 起开始支持 Webp。
Opera WebPOpera 官方自 Opera 12.1 开始支持 WebP（最初发布于 2012 年 11 月），自 Opera 11.5 起部分支持。部分支持指的是并不支持无损的、支持 alpha 通道的 WebP。
Opera mini 浏览器当前所有版本都官方支持 WebP。
FireFox WebPFirefox 当前不支持 WebP。Mozilla 论坛的 bug 856375 正在谈论此事。
Internet Explorer WebPInternet Explorer 和他们新的 Edge 浏览器，都不支持WebP。而且目前并无添加支持的任何打算。不过，已有用户发声谈论，人们哀求微软将 Webp 支持加入 Edge。
Safari WebPApple 的 Safari 浏览器及其 iOS Safari 浏览器都不支持WebP。不过，最近 HTML5test 有条推文说我们有望在 iOS 10 看到Safari支持 WebP。iOS 10 目前处于 beta 测试阶段，以是韶光会解释统统。
你该利用 WebP 吗?由于环球 WebP 支持度在 70% 旁边浮动，利用这种图片格式来替代 PNG 和 JPEG 是极故意义的。还有主要的一点要提到，无论如何实现 WebP，你只是为支持的浏览器供应 WebP 做事，而为其他浏览器供应 PNG 和 JPEG。利用 WebP 并不会毁坏你的图片。把这当做增值，而非改变。还有其余一些东西须要考虑，如浏览器市场份额，当前流量，WebP 相对付 PNG 和 JPEG 的文件体积。
1. 浏览器市场份额决定是否利用 WebP 的时候，记得看下浏览器市场份额，由于 Chrome 和 Opera 支持 WebP，以是有必要看下他们的占比。我们从一些不同来源网络了一些统计数据，它们都有自己不同的数据网络办法：
StatCounter 浏览器市场份额
StatCounter 截至 2016 年 6 月的数据显示，Chrome 霸占市场份额为 58% 的，Firefox 以大约 16% 排名第二。
W3Counter 浏览器市场份额
W3Counter 截至 2016 年 6 月的数据显示，Chrome 霸占约 57% 的市场比例，Safari 以约 14% 跻身第二。
W3Schools 浏览器市场份额
W3Schools 截至 2016 年 5 月的数据显示，Chrome 霸占约 71% 的市场份额，Firefox 以约 17% 居于其后。
Clicky 浏览器市场份额
Clicky 截至 2016 年 7 月的数据显示，Chrome 霸占约 50% 的市场份额，Firefox 以约 18% 位居第二。
从上面的数据可以看到，Chrome 均匀霸占约 59% 的市场份额，以是必须意识到，如果在项目中加入 Webp 图片，大多数访客都会看到 WebP 版本。Opera 仅拥有市场份额的一小部分，但它们的用户也可以看到。
2. Google Analytics只管浏览器市场份额对大多数人来说可能方向于 Chrome，并不虞味着你的网站/项目也是如此。确认数据总是很主要的。做起来很随意马虎，点击 Google Analytics 的 “浏览器与操作系统”（“Browser & OS”）部分就能看到。不才面的例子中，可以看到将近 70% 的流量来自 Chrome。在这种情形下，WebP 是很有利的，这意味着 70% 的访客会看到更小体积的文件。
还有，别忘了移动端！
可以在 Google Analytics 的“设备”（“Devices”）部分看到。如你所见，大部分流量来自苹果设备。以是如果 iOS 10 完备支持 WebP 的话会颇故意思，这样一来会大量的移动端流量将会有戏剧性的不同。
3. WebP 文件体积
已经有大量研究比较了 WebP 与 PNG、JPEG 的文件体积。一定要去看看它们。
JPG 转 WebP – 压缩大小比较WebP 均匀减小了 85.87% 的文件提交。加载韶光降落了 11%，页面整体大小减少了 29%。PNG 转 WebP – 压缩大小比较WebP 均匀减小了42.8% 的文件提交。加载韶光降落了 3%，页面整体大小减少了 25%。WordPress 缓存开启下的 WebP 案例研究还须要考虑本钱效益比（cost-benefit ratio）。对 WordPress 这样的 CMS 来说，现在有两种图片，一个是 JPEG 或 PNG，还有一个 WebP。因此利用 WebP 会占用做事器更多的硬盘空间。但事实是，更小体积的图片带来的是更快的加载韶光。不应忽略节省下来的流量：取决于不同项目，积累下来的数量相称可不雅观。
其他人正在利用 WebP，虽然你可能没把稳到。Dollar Shave Club 可以将其 App 的大小由 230 MB 减少到 30 MB！
结果便是，利用 WebP 格式将体积减少了七倍。
CMS WebP 支持
接着平台支持的问题就来了，不管你是利用 WordPress 或 Joomla 这样 的 CMS，或者仅仅是像 Laravel 这样的 PHP 框架搭建的大略的静态站点。下面我们将会先容一点关于如何在在不同平台上支持 Webp 图片的内容。
WordPress WebP事实上，WordPress 很随意马虎实现 WebP 支持。你可以利用我们的集成图片优化(Image Optimizer) 插件，在将图片上传至 WordPress 媒体库时候自动转换为 WebP 格式。
然后你可以利用免费的 WordPress Cache Enabler 插件来为访客供应 WebP 图片。
重点是，Cache Enabler 做的实在是判断浏览器支持，为支持的浏览器供应 WebP，而为其他浏览器供应 JPEG 或 PNG。它实际上已经自动为你做好了切换事情。
Joomla WebPYireo 的免费的 WebP Joomla 扩展，许可在浏览器支持的情形下启用 WebP 支持。其侦测浏览器对 WebP 的支持，基于 user-agent 大略检测（这样就能精确匹配 Chrome）以及额外的 JavaScript 检测。如若检测到支持 WebP，扩展会解析输出的 HTML，确保那些支持图片（png，jpg，jpeg）的链接被 Webp 图片更换掉。
Magento WebPYireo 的免费的 WebP Magento 扩展，许可在浏览器支持的情形下启用 WebP 支持。其侦测浏览器对 WebP 的支持，基于 user-agent 大略检测（Chrome）以及额外的 JavaScript 检测（这样也能够匹配其他浏览器）。如若检测到支持 WebP，扩展会解析 HTML 输出，确保那些支持图片（png，jpg，jpeg）的链接被 Webp 图片更换掉。
其他平台上的 WebP对付其他平台，你该当去看看我们的这篇如何供应 WebP (how to deliver WebP)。某些平台启用 WebP 支持，可能须要修正你的 .htaccess 文件或者 Nginx 配置。
小结如你所见，WebP 的支持程度可能比你最初想的要好得多。当然该当讲浏览器市场份额以及当前的浏览数据纳入考虑中。比方说，如果 70% 以上的流量都来自 Chrome，那利用 WebP 来加速网站意义重大。如果你在利用 CMS，统统都很大略，由于有很多插件来帮你完成 WebP 的转换。
本文转载自：众成翻译
