JPEG 101: JPEG速成课程指南

WebFX总统。Bill在互联网营销行业拥有超过25年的经验,专长于搜索引擎优化、用户体验、信息架构、营销自动化等。William在Shippensburg和MIT的科学计算和教育背景为MarketingCloudFX和WebFX的其他关键研究和开发项目提供了基础。

JPEG 101: JPEG速成课程指南JPEG,一种为摄影优化的压缩算法图片,是我们经常遇到的事情。JPEG不受限于特定数量的颜色(例如,不像GIF),并且由于其可变的压缩范围而流行,这意味着您能够更容易地控制压缩的数量,从而控制最终的图像质量。在本指南中,我们将讨论关于JPEG你需要知道的重要事情用户体验

JPEG快速概览

以下是关于JPEG你应该知道的一些事情:

  • JPEG是一种有损压缩算法;这意味着它将丢弃图像中的一些数据以减少其文件大小
  • JPEG常被读作“jay peg”。
  • JPEG是联合摄影专家组该组织开发了JPEG格式
  • .jpg和.jpeg是使用JPEG压缩算法压缩的图像最常见的文件扩展名;它们是一样的,但是旧的DOS系统对文件扩展名有3个字符的限制——现代操作系统同时识别.jpg和.jpeg
  • 其他使用JPEG压缩算法的文件格式有.jpe、.jfif和.jif

语义和消除歧义:JPEG vs. JFIF/Exif

许多人将任何使用JPEG压缩算法的图像格式称为“JPEG文件”。然而,大多数图像捕捉设备(如数码相机)和图像编辑程序实际上在JFIF或Exif格式。无论出于何种目的,当人们说“JPEG文件”或当一个软件应用程序说他们将您的工作保存为JPEG格式时,您可以将其视为一个使用JPEG算法的文件,无论它是真正的JFIF还是Exif。

为什么使用JPEG ?

JPEG允许您通过调整压缩参数来控制“损耗”的程度。通过这种方式,您可以实现非常小的文件,而只需要您真正需要的最低质量。

JPEG的第二个重要优势是它存储全色信息:每像素24位(这意味着1600万种颜色)。GIF是另一种在网络上广泛使用的图像格式,每像素只能存储8位(256种颜色)。这种存储颜色的能力就是为什么JPEG压缩对于显示色彩丰富且具有摄影质量的图像非常有用的原因。

JPEG压缩

相反的PNG格式(它使用无损压缩算法),JPEG使用有损压缩方法。有损压缩通过丢弃信息来减少图像大小。可以把有损压缩看作是对您正在阅读的一本书中重要和有趣部分的优秀总结。

例如,你可以总结一本书的冗长和冗余的散文,只有一页的笔记,只包含真正重要的信息。那么问题就来了,当您想要从一页的书摘要中重新创建原书时;这是不可能的。另一个问题是,如果你继续总结这本书的摘要,那么你会失去更多的保真度和准确性比原来的书。

对于有损压缩,再次压缩图像意味着丢失更多的数据,这意味着图像质量下降。

基线JPEG vs.渐进JPEG

JPEG有两种形式:基线而且进步.基线JPEG是使用JPEG压缩算法创建的图像,它将在数据可用时逐行显示图像。在网络浏览器中,你可以看到基线格式的JPEG图像,从图像的顶部到底部慢慢显示出来。

递进式JPEG以这样一种方式显示一张模糊/低质量的图片,然后随着图片数据被下载得更充分而变得更清晰。基线JPEG vs.渐进JPEG渐进效果很好,因为用户从一开始就能对图片的效果有个大概的了解,尽管它不像最终的图片那么清晰,这对于网络连接速度较慢的人来说非常好。这是一个很好的方法提高网页设计.渐进式JPEG格式也提高了网页性能,因为它不像基线那样以增量方式加载。

JPEG基线/渐进格式在Photoshop中

当你使用Photoshop的时候另存为功能(文件>另存为)以JPEG格式输出您的作品,您将看到以下格式选项:JPEG基线/渐进格式在Photoshop中

  • 基线:图像将在屏幕上逐行显示
  • 基线优化:与Baseline相同,但进一步优化使用霍夫曼编码
  • 进步:您可以指定3-5次扫描,这意味着在显示最终图像之前将有3-5个阶段

何时使用JPEG格式

色彩丰富/高亮度的图片最适合JPEG压缩。当你想要更好/更容易地控制你想要用于你的图像的压缩量时,使用JPEG。这可以帮助你最大化小文件的大小和质量。

什么时候应该避免JPEG

JPG算法不适用于边缘尖锐的图像,如文本、卡通图画等。您应该选择PNG或GIF这样的图像。此外,如果你有一些颜色简单的文件,比如徽标、图标,网站图标,和矢量绘图,您将得到更小的文件大小和相同(或更好的)JPEG质量。

要了解更多关于JPEG和PNG/GIF的信息,请阅读网页设计师指南的PNG图像格式什么时候应该避免JPEG

保存jpeg在Photoshop中

下面是保存在不同JPEG压缩级别的相同图像的比较。

原始
原始文件大小:23.2 KB 非常高的文件大小:21.8 kb
文件大小:14.6 KB 媒介文件大小:6.73 KB
文件大小:3.78 KB 0质量文件大小:2.72 KB

显微镜下的JPEG压缩

下面是放大后的8x8px区域的图片,从原始画质到最低画质的细微差别:

透明使用JPEG可能吗?

JPEG目前不支持传统的透明度。如果你需要透明度,比如当你把一张图片放在另一张图片上,想让背景通过它显示,你应该使用支持透明度的压缩算法,比如PNG或GIF。

下面是JPEG和PNG透明度的模拟:模拟JPEG和PNG的透明度

WebP:一种新的图像格式,竞争JPEG

WebP是一种新的图像格式,它可以像JPEG一样对图像进行有损压缩。不久前,谷歌宣布了WebP(发音为“weppy”)图形格式以及它的研究。研究表明,与主流的JPEG文件格式相比,使用它可以减少40%的图像文件大小。

这意味着更快的文件传输和减少网络负担。由于许多浏览器(还)不支持它,它目前在网络使用中是无效的。阅读更多WebP。

使用JPEG的实用技巧

  • 使用Smush.it作为一个进一步优化工具为你的jpeg文件;这是一个无损的优化器,所以质量得以保留
  • 要实现JPEG文件的无损编辑(如裁剪或旋转),您可以使用Jpegtran
  • 如果您正在寻找一个好的替代JPEG格式,那么PNG-24是一个不错的选择;对于摄影图像,它的文件尺寸会更大,但它采用无损压缩
  • 如果一个JPEG图片被打开,编辑,并再次保存,它会导致额外的图像退化,所以当你在多个会话中编辑图像时,将中间的图像保存为未压缩/原始格式,如TIFF或编辑软件的原生格式(如。psd用于Adobe Photoshop或。psp用于PaintShop Pro)

相关内容

WebFX职业

加入我们的使命,为全球企业提供行业领先的数字营销服务——同时建立您的个人知识和个人成长。

我们招聘! 视图30 +职位空缺!