图片压缩工具
@imagesizereducer
页面加载慢，源头在一张图
页面里最重的东西通常是图片，而它偏偏是设计定稿后没人再看的部分。一张按原始分辨率导出的首图，重量可能超过页面其他内容的总和，每个访客打开时都要为它再付一次时间。
压缩是唯一不用改设计、不用改版式就能做的提速动作。无损那一遍不动画面，读者能感知到的差别只剩页面收敛得快一点，而图片压缩工具会在下载之前先把省下的量报出来。
压缩这个文件图片变轻，画质不动
图片压缩工具
图片压缩工具做的是一件很具体的事：把已有的图片文件变轻，同时尽量不动画面。做页面、上架商品、发邮件、写文档的人都用得着，因为这些文件的重量会在每次加载和下载时被重复支付。
- 先做无损压缩，像素一个不动
- 尺寸超标时才缩小边长
- 下载前先看压缩后的体积
- 透明区域和长宽都保留
- 全程在浏览器里跑，不用安装
什么是图片压缩
把同一个画面用更少的字节写下来，必要时也重建像素网格。
输入是一个文件，输出是同一个画面里更轻的版本。能做到这件事的路径有两条：压缩只是换一种更省的写法去描述同一批像素，屏幕上看到的结果完全一致；缩小尺寸改变的是像素数量，体积掉得更多，画面能承载的细节也跟着变少。
该走哪条取决于文件为什么重。只用在 400 像素宽位置上的图，没必要留着 3000 像素的细节；一份要送去印刷的文件需要每一个像素，只能在编码上找空间。分清这两件事是这一页最先帮你做的判断，报出的体积就是依据。图片压缩工具要做的，是把新数字摆出来，而不是藏在下载按钮后面。
为什么用这个图片压缩工具
两条路径的先后是刻意的：先把编码变省，只有报出的体积说明有必要时，才去动像素网格。
第一遍不改动画面
重新编码让同一批像素用更短的写法描述。结果已经够小，事情就到此为止，没有留下视觉上的让步。
缩边长解决另一种重
当多余的部分在边长而不是编码里，网格可以缩到图片真正被展示的尺寸，这一步能挪动的体积比压缩大得多。
结果是被量出来的
每次尝试都会报出它产出的体积，减重变成一个能跟原文件、跟目标值比较的数字，而不是一句保证。
透明是图像数据的一部分
透明通道跟颜色一起重新编码，不会被压平，所以镂空图的边缘和空像素在两种操作之后都还在。
文件不会被上传
文件由你眼前这个浏览器标签页读取，省掉了等服务器、注册账号，以及担心副本被存到哪里的问题。
图片压缩工具
@imagesizereducer
上传表单嫌文件太大
电商后台、招聘系统、报名表都会写明体积上限，而手机照片或截图经常刚好压线。常见的应对是打开图片编辑器，凭感觉拉一个质量数值，导出，才发现猜错了。
从报出的数字出发就不用猜。载入文件，先看一遍压缩后会是多少，再决定接受哪种代价：更强的编码，还是更小的边长。比较的过程不用上传任何东西。
压缩这个文件图片压缩工具
@imagesizereducer
素材文件夹只增不减
设计文件夹会自己堆积版本。每一轮修改都导出一次，旧的那份因为没人确定还在不在用而留了下来。项目很少一开始就重，是一次一次被忽略的导出把它堆重的。
把整个文件夹过一遍枯燥，但结果明确。已经上了站的图片走无损重写，源文件保留全部像素，两种取舍不再混淆。
压缩这个文件图片压缩工具
@imagesizereducer
图片存得比显示的大得多
一张 4000 像素宽的商品图，实际只显示在 600 像素宽的框里，多余的那些细节没有任何屏幕能显示出来。浏览器把整张图下载下来，绘制时再丢掉大部分。
这种情况缩小尺寸比压缩有效，因为多余的部分在网格里而不在编码里。先定好边长再跑编码，文件最后和它真正被展示的空间对得上。
压缩这个文件图片压缩工具
@imagesizereducer
重的不只是画面
导出文件里装的不只是像素。色彩配置文件、编辑历史，以及别的软件写进去的预览缩略图，能给一个画面看不出差别的文件加上几十上百 KB。
清掉这些随行物，屏幕上的结果不变，是风险最低的一种减重方式。如果文件因为印刷必须保留色彩配置，也可以留着，报出的体积会告诉你留着它花了多少。
压缩这个文件图片压缩工具
@imagesizereducer
带透明背景的图不能变成白底
处理镂空图片最容易出事，因为那些空像素本身就是设计的一部分。为了让体积小一点把它们压成白底，标志会变成一个白方块，放到有色背景上就露馅。
这里的透明通道被当作图像数据一起重新编码，而不是被丢掉。压缩和缩放之后背景依然透明，结果可以直接替换原文件，不用再回页面确认。
压缩这个文件图片压缩工具
@imagesizereducer
截图从来没被压过
截图是从剪贴板直接进文档、工单或评审意见的，中间不经过任何导出设置，抓到多大就是多大。一份文档里放上几张，打开就会明显变慢。
截图也正好是压缩效果最好的素材，因为大片同色界面没多少可描述的内容。一次压缩往往能去掉相当大一部分体积，图片压缩工具会在替换之前先把结果给你看。
压缩这个文件图片压缩工具
@imagesizereducer
要把文件发给网络不好的人
在办公室宽带上一秒传完的附件，换到酒店网络或手机热点上可能要一分钟。发的人察觉不到，收的人一定察觉得到。
发出之前先减重只多一步，却能省掉大部分等待，也决定了这封邮件能不能顺利送到。
压缩这个文件图片压缩工具
@imagesizereducer
不知道这次压缩值不值
关于压缩的说法经常是一个百分比承诺。已经优化过的文件再压也不会怎么动，而一张原始截图第一次压缩就可能掉一大半，这跟页面上的承诺无关。
把数字报出来，两个方向的猜测都省了。你可以确认一份文件本来就很轻，接受这个结论，不再去找一个并不存在的档位。只有在能对你说「不必了」的时候，图片压缩工具才真的有用。
压缩这个文件怎么用这个图片压缩工具
四步，只有第三步需要你做个决定。
Step 1
载入图片
把文件放进工作区，它当前的体积会被记下来，后面每次尝试都是跟这个基准比。
Step 2
先看第一遍的结果
走一遍无损压缩，看它产出了多少。已经达到目标的文件到这里就结束了，不用再做选择。
Step 3
不够时再决定下一步
如果节省量还不够，判断哪种代价可以接受：更强的编码、更小的边长，或者去掉存下来的元数据。每个候选结果都会先报出来。
Step 4
下载更轻的那份
保存你选中的版本。它的边长和透明区域是你设定的样子，可以直接放回原来的页面、文件夹或邮件里。
谁在做图片减重
四种把图片体积当成持续成本、而不是一次性麻烦的工作。
WD
前端开发
产品页与营销页
页面速度会被测量、被汇报，而图片通常是清单上最大的一项。无损压缩是少数不用再跟设计确认的性能优化。
OS
电商卖家
有上传上限的商品图
每个平台都写了自己的体积上限，一批图要同时满足全部。上架前先看一遍体积，比被拒之后重新提交快。
NS
邮件营销
图片较多的营销邮件
邮件客户端对付不了太重的图，一封渲染很慢的邮件会在第一段之前就丢掉读者。文件轻一点，打开快一点，版式不用改。
DH
设计交付
在团队之间流转的源文件
每交接一次就多一份副本，每份都加重量。约定一份减过重的主文件，文件夹会清爽很多，也不会再用到过期的导出件。
常见问题
这个工具改什么、不改什么，以及报出的数字从哪里来。
关于数字
在看到文件之前，没人能承诺一个百分比
能省多少完全取决于文件是怎么产生的，事先给出的比例都只是猜测。无损压缩是最稳妥的起点，因为它不改动画面；如果还不够，再调整边长。遇到本来就很轻的文件，直接这么告诉你才是对的。
文件更小，画面不变。
- Add Artifacts to PNG
- Skew a PNG
- Add a Border to PNG
- Add Dithering to PNG
- Add a Glow Effect to PNG
- Add Noise to PNG
- Add an Outline to PNG
- Add Padding to PNG
- Add a Background to PNG
- Add a Sepia Tone to PNG
- Add a Shadow to PNG
- Add Space Around PNG
- Add a Stroke to PNG
- Add Text to PNG
- Add a Watermark to PNG
- Add a Whirl to PNG
- Analyze a PNG File
- Blur a PNG
- Censor a PNG
- Center a PNG
- Change PNG Brightness
- Change PNG Color Tone
- Change Colors in a PNG
- Change PNG Contrast
- Change PNG Hue
- Change PNG Opacity
- Change PNG Quality
- Change Stamp Color
- Check If a PNG Is Transparent
- Clone a PNG
- Compress a PNG
- Convert Base64 to PNG
- Convert BMP to PNG
- Convert Color Names to PNG
- Convert Data URI to PNG
- Convert GIF to PNG
- Convert Handwriting to PNG
- Convert ICO to PNG
- Convert Icon to Stamp
- Convert Image to Stamp
- Convert JPG Signature to PNG
- Convert JPG to PNG
- Convert Landscape PNG to Portrait
- Convert Logo to Stamp
- Convert PNG to Black and White
- Convert PNG to Silhouette
- Convert PNG to Stencil
- Convert Portrait PNG to Landscape
- Convert SVG to PNG
- Convert Text to PNG
- Convert WebP to PNG
- Create a Date Time Stamp
- Create a Grayscale PNG
- Create a PNG From an Emoji
- Create a Rectangular Stamp
- Create a Round Icon
- Create a Round PNG
- Create a Round Stamp
- Create a Square Icon
- Create a Stamp From Text
- Create a Star PNG
- Create a Symmetric PNG
- Create a Translucent Icon
- Create a Wavy PNG
- Crop a PNG
- Cut a PNG
- Downscale a PNG
- Draw a PNG Grid
- Duplicate a PNG
- Extract a Barcode From an Image
- Extract a Signature From an Image
- Flip a PNG Horizontally
- Flip a PNG Vertically
- Generate a Colorful PNG
- Generate a PNG Alpha Mask
- Invert PNG Colors
- Make an Icon Thicker
- Make an Icon Thinner
- Make a PNG Opaque
- Make PNG Transparent
- Make a PNG Rounded
- Mirror a PNG
- Multiply a PNG
- Optimize a PNG
- Pick a Color From a PNG
- Pixelate a PNG
- Posterize a PNG
- Preview a PNG on a Background
- Quantize a PNG
- Refine PNG Edges
- Remove the Alpha Channel
- Remove a Border From a PNG
- Remove a Color From a PNG
- Remove a PNG Background
- Remove a PNG Chroma Key
- Resize a PNG
- Reverse PNG Colors
- Reverse a PNG
- Rotate a PNG
- Sharpen a PNG
- Show Transparent Areas
- Swap Colors in a PNG
- Transparent Icon Maker
- Transparent Logo Maker
- Transparent Signature Maker
- Upscale a PNG
- Wrap a PNG in a Polaroid
- Zoom a PNG