记得收藏【国际动画教程网】,赶快注册吧!
注册

合作站点账号登陆

QQ登录

只需一步,快速开始

扫一扫,访问微社区

快捷导航
查看: 14833|回复: 0
收起左侧

[设计经验] 聊聊又爱又恨的图形压缩吧[含5P]

[复制链接]
发表于 2018-1-12 09:48:22 | 显示全部楼层 |阅读模式
国画家路易·达盖尔有一天在一个小山丘上画日落,突引发一个念头,为什么不能想办法把真实的情景留下来呢,经过数次的研究实验,终于在1839年发明了银版照相。第一代相机属于新鲜事物,他们的主要的作用是替代了画家记录时代的职责,随着摄影技术越来越简单,相机便宜到每个家庭都有一台,它的推广促进了新闻业,全球化和出国旅行,手机和其它数码产品设置拍照功能,使照片得以广泛共享。


          自互联网的发明者蒂姆·伯纳斯-李于1992年上传第一张照片以来。互联网图片的数量就呈滚雪球式的增长,每天会增加几亿张图片,我们需要图片被快速的加载,快速的打开,快速的浏览。对于内容编辑,设计师,前端工程师,图片压缩几乎已经成为了他们必备的工具。帮助他们平衡高分辨率和图片体积之间的冲突,最终给用户无感知的图片加载体验。


        现在已有不少优秀的图片压缩算法和各具特色的压图软件,今天我们来介绍3个在线压缩工具, 能够高效地帮你完成PNG和JPG压缩任务。


1、Tinypng


        tinypng  图片压缩工具是一款可以帮助网页设计师们优化图片的工具,在线上传一次最大上传20张图片,每张最大5M,只需要简单的两步就可以完成对PNG和JPG图片的高压缩而且还不会影响图片的质量,能最大限制的压缩图片,据官方说是无损压缩的,至于是不是真的,反正压缩之后的图片和之前的几乎看不出有什么区别,这样就可以解决网页设计师因图片太大而影响网站加载网页速度的难题。





        网站名称:Tinypng
        网站链接:https://tinypng.com/



2、Goimg.io


        打开 Goimg.io  的主界面,把需要压缩的文件直接拖入即可开始工作。免费版支持10张图片批量压缩,最大5M的图片,基本满足日常需求。看网站下面的备案,这货应该是由国人团队打造,出乎意料的是有人工智能,压缩模型基于TensorFlow对早期采集的海量图片进行压缩后,通过数据采样训练出来的智能图像压缩算法,目前支持PNG和JPG图片压缩。


        另外 Goimg.io  十分注意对于隐私的保护,当你的图片压缩完成的60分钟后,将会永久从网站的服务器删除,同时文件链接即失效,传出也都是SSL加密状态。可能是出于简洁考虑,Goimg.io  只做了最基本的压缩工作,把调整大小,编辑等其他需求交给别的应用,这可能也是吸引我的地方吧。





        网站名称:Goimg.io
        网站链接:https://goimg.io/




3、Online Image Compression


         图片无损压缩(ps:官网是这么说的,不过我认为只要是文件体积压缩,就必定是有损的。),提供png、jpg图片的在线可选择的无损压缩服务,最大支持3M图片,可以批量拖拽上传和批量打包下载,分为有损压缩和最大尺寸压缩俩种模式,可根据需求选择,同时支持下载后及时删除更保密





        网站名称:Online Image Compression
        网站链接:http://img.hust.cc/




下面简单测试一下几个工具的压缩效果:





        压缩前后的体积有了明显的变化,Tinypng和Goimg都超过了70%的压缩比率,但是画质并没有明显的降低,虽然体积的变化并没有官方宣称的80%那样惊人,但相比于这样的画质保留,效果也是立竿见影,几乎可以说是肉眼不可见的画质损失。




再来试试暗光环境的PNG图片





        经过压缩之后,Online Image Compression 压缩率达到了惊人的84%,3款工具都可观的减少了图片体积,并且并没有出现屏幕观感上的暗部细节丢失。


        很多同学在写文章时,常会遇到系统对上传图片的尺寸或大小有限制,此时正儿八经打开 Photoshop 来处理有些大材小用,而这些在线工具则相当称手。


        好在无论是 Tinypng,Goimg.io或者Online Image  Compression,它们从价格以及使用场景都有所区别,TinyPng为25$/年,最大支持25MB文件和一次性20张图片,Goimg目前在内测阶段,支持6$/月的付费功能,比如一次50张图片,没有图片上传大小限制,没有上传总量限制等等。即使功能可能是差不多的,使用者也可以根据自己的喜好和不同需求进行选择。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?注册

x




上一篇:交互设计的囚徒困境
下一篇:好的人机交互设计 (UX) 有哪些主要评判标准?
一起共享资源,共建精品资源平台。记得一定要收藏我们网站。www.gjdhjc.com ||||| 还有我们的网址导航:www.58q8.com【链接失效可以留言看到第一时间补帖,如果懒的回复我也是没办法了】
快速回复 返回顶部 返回列表