参考谷歌官网:Webp: A new image format for the Web

Webp是Google强推的新一代网络图片格式,特点就是:高质量压缩。
能压缩多少呢?5MB的原图,不降低效果,转换成webp格式后大小是几百KB。100KB的图,转换后是9KB。

虽然目前所有主流浏览器都支持这种图片格式,但不幸的是所有主流系统如Mac、Win等都还没有默认支持打开它的程序,更无法显示它的预览、缩略图。

如果想查看,最简单的方法是把*.webp文件的打开方式设定为Chrome等浏览器,双击打开在浏览器中查看。

还有很多时候我们需要对这种文件进行转换。

Google提供了一组工具集合,叫libwebp,其中包括各种webp相关转换的命令:

  • cwebp -- 将其它图片转为webp格式图片 (不包括GIF)
  • dwebp -- 将webp格式图片转为其它格式图片
  • vwebp -- webp图片浏览器
  • webpmux -- WebP muxing tool
  • gif2webp -- 将GIF转换为webp图片

下载安装参考官网:Downloading and Installing WebP

Ubuntu安装libweb库:

$ sudo apt-get install webp

Mac安装libwebp库:

$ brew install webp

注意:Homebrew安装的webp并不包括上面所有的工具,而只有cwebpdwebp

如果我们想要所有的工具,有两种方法:

  • 到官网找到自己OS对应版本的二进制包,直接运行使用
  • 自己编译

最简单就是到官网下载列表里找到自己的OS对应版本的二进制包,下载下来解压缩直接使用。
官方下载列表:https://storage.googleapis.co...

比如我的系统是Mac 10.12,那么就找到libwebp-0.6.0-mac-10.12.tar.gz这个压缩包下载:

cd /tmp
wget https://storage.googleapis.com/downloads.webmproject.org/releases/webp/libwebp-0.6.0-mac-10.12.tar.gz
tar xvzf libwebp-*.tar.gz
cd libweb-*

然后在~/.zshrc~/.bash_profile中的PATH环境变量中加入刚才二进制文件包中的bin目录,或者直接设置alias,即可开始像别的命令开始用了。

如果没有自己所用系统的二进制包,那么就只能自己编译了。每种平台的编译方法不一样,需要按照官网方法一步一步安装。

编译方法参考官方:Compiling the Utilities

将各种图片转换为Webp格式

参考:https://developers.google.com...

目前输入格式支持:png, jpg

$ cwebp INPUT.png -o OUTPUT.webp

将Webp图片转换为其它格式图片

参考:https://developers.google.com...

$ dwebp INPUT.webp -o OUTPUT.png

将GIF转换为Webp格式

参考:https://developers.google.com...

$ gif2webp INPUT.gif -o OUTPUT.webp

浏览webp图片

这个命令不是在命令行终端里浏览图片,而是在桌面上弹出一个GUI窗口显示图片,所以需要依赖本地电脑的GUI桌面。

 
$ vwebp INPUT.webp

转载:https://segmentfault.com/a/1190000018178569

帮谷歌推广Webp图片格式之:Webp的格式转换的更多相关文章

  1. 如何让Ubuntu系统支持WebP图片格式

    本文主要向大家介绍如何让 Ubuntu 系统支持查看 WebP 图片格式,以及如何将 WebP 转为 JPEG 或 PNG 图片格式的方法. 什么是WebP图片 Google开发并推出 WebP 图片 ...

  2. 【图像处理】使用SDL预览webp图片

    写在前面的话 WebP是Google开发的一种图像格式,支持图像数据的有损和无损压缩.保留动画和alpha透明通道数据. 可以创建和JPEG.PNG和GIF图像格式在质量相同或质量更高,但是数据更小的 ...

  3. WebP图片格式

    腾讯科技讯 科技博客Gig‍‍‍aOM近日撰文称,谷歌(微博)试图让WebP图片格式取代JPEG等现有图片格式.虽然谷歌无法很快达成所愿,但WebP仍然会对互联网产生重大影响. 文章全文如下: 受够了 ...

  4. 让浏览器全面兼容WebP图片格式

    WebP格式 WebP是Google推出的一种图片格式,它基于VP8编码,可对图像大幅压缩.与JPEG相同,WebP也是一种有损压缩,但在画质相同的情况下,WebP格式比JPEG图像小40%. Wik ...

  5. 关于webp图片格式初探

    前言 不管是 PC 还是移动端,图片一直是流量大头,以苹果公司 Retina 产品为代表的高 PPI 屏对图片的质量提出了更高的要求,如何保证在图片的精细度不降低的前提下缩小图片体积,成为了一个有价值 ...

  6. nodejs应用转换png,jpg,gif为webp图片格式

    本博客列表缩略图在支持webp格式的浏览器下,使用的是webp格式图片,不支持webp图片下使用的是原图片(如png,gif,jpg等) webp使用指南,请参考 https://www.imqian ...

  7. 在html中如何兼容使用WebP格式的图片【图片升级到WebP】

    把已有的图片转换为WebP格式 要使用WebP格式,需要将你网站用到的图片都制作一份WebP格式的版本,如果你使用CDN服务商,它们一般都会提供转码到WebP格式的选项.如又拍云: 增加这样的配置后, ...

  8. 提升网站用户体验—WebP 图片的高效使用

    一.WebP 的由来 现代图像压缩技术对我们的生活方式影响很大.数码相机能将上千张高质量图片存储到一张内存卡里.智能手机可以与邻近设备快速分享高分辨率的图片.网站与手机等移动设备能快速展示各种富媒体. ...

  9. 网站页面优化必然趋势—WebP 图片!

    本文梗概:众所周知,浏览器可以通过 HTTP 请求的 Accpet 属性 来指定接收的内容类型.依靠这个技术,可以在不修改任何 HTML/CSS 或者图片的情况下,向浏览器提供优化的图片,从而降低带宽 ...

随机推荐

  1. 用java代码实现构造目录树

    怎么用java代码实现上面这样的目录树? 首先创建数据表 每条数据记录自己的id以及父节点的id 然后进入java代码部分: public String directory(String author ...

  2. 邮件学习过程中关于request.POST的使用

    今天的话主要的精力都集中在邮件系统demo的实现,因为自己个人技术有限,所以做出来的相当简陋,在其中碰到的问题其实也是比较多的,对于基于django的邮件相对来说比较容易,然后就是在提交数据,获取po ...

  3. centos7小命令

    修改时区:timedate [root@centos2 ~]# timedatectl set-timezone Asia/Shanghai 修改语言:localectl [root@centos2 ...

  4. C++Primer第五版 练习8.6答案详解

    重写7.1.1节书店程序(第299页),从文件中读取一个交易记录.将文件名作为一个参数传递给main. 本题所需源文件如下: Sales_data.h文件: #pragma once #include ...

  5. Type mismatch: cannot convert from element type Object to String 解决办法

    首先放上我的源码,看看你的代码是不是我这个类似的. @Test void predicateTest() throws Exception { List<String> languages ...

  6. Linux硬盘满了,系统速度贼慢,居然是Jenkins.log太大了

    用查找命令找出大于1G的文件 find / -size +1G -print 为什么jenkins.log会产生40+G的文件? 以上在Windows上的时候,运行了几个月,也没有发生这种现象? 而在 ...

  7. linux网络编程之socket编程(四)

    经过两周的等待,终于可以回归我正常的学习之旅了,表哥来北京了在我这暂住,晚上回家了基本在和他聊天,周末带他在北京城到处乱转,几乎剥夺了我自由学习的时间了,不过,亲人之情还是很难得的,工作学习并不是生活 ...

  8. Excel技巧大全

    1.一列数据同时除以10000 复制10000所在单元格,选取数据区域 - 选择粘性粘贴 - 除 2.同时冻结第1行和第1列 选取第一列和第一行交汇处的墙角位置B2,窗口 - 冻结窗格 3.快速把公式 ...

  9. 4.1 vue-resource

    全局拦截器.配置全局地址等:

  10. Dubbo源码分析(5):ExtensionLoader

    背景 Dubbo所有的模块加载是基于SPI机制的.在接口名的上一行加个@SPI注解表明要此模块要通过ExtensionLoader加载.基于SPI机制的扩展性比较好,在不修改原有代码,可以实现新模块的 ...