如何减小 JPEG 和其他图像文件的大小

已发表: 2021-01-20

您在网站上使用的图像是最重要的元素之一。 您不仅希望拥有视觉上引人注目的图像,而且您也不希望这些图像过大以致减慢您网站的加载时间。 站点滞后的主要原因之一是其中包含的图像尚未调整大小以实现最佳站点性能。

在本文中,我们将探索在 Photoshop 中缩小图像大小的手动方法,包括使用“为 Web 保存”功能更改文件类型、调整大小和压缩文件。 如果那些寻找更自动化的东西,我们也会看看一些插件和基于网络的选项。

订阅我们的 YouTube 频道

更改文件类型

图像文件的“文件大小”是指每英寸的像素数。 通常,每英寸的像素越多,文件包含的信息越多,因此其大小就越大。

两种最常见的图像文件类型是 JPG 和 PNG。

  • PNG – 便携式网络图形 – 这种文件类型主要用于图形文件,如徽标、图标、插图和文本。 在像 Photoshop 这样的照片编辑应用程序中进行编辑时,这些文件在您操作或压缩它们时不会丢失太多数据。 因此,它们被称为“无损”。 出于这个原因,这些文件的大小往往更大。
  • JPEG – 联合图像专家组这是 Internet 上大多数图像最常见的文件类型。 这种文件类型可以管理数百万种颜色,可以在保持质量的同时进行高度压缩。 这些被称为“有损”,因为压缩它们的过程会从图像中删除像素。

任何一种文件类型都可以工作。 您选择哪一个实际上取决于您的站点、您选择使用的照片数量和类型。

这是一张示例照片。 其原始格式为 JPG 文件。

我在Photoshop中使用了文件>另存为命令,选择了PNG格式,完成了保存功能。

当我更改文件类型时,文件大小从 646 MB 变为 1.3 KB。 如上所述,PNG 文件通常更大,因此对于这种具有大量颜色和细节的图片,最好使用 JPEG 版本以确保更快的加载时间。 如果您知道您的图像需要能够在不降低分辨率的情况下放大,请使用 PNG 版本。

请注意,还有许多其他文件格式可用。 我专注于 JPEG 和 PNG,因为它们是最受欢迎的。

在 Photoshop 中手动调整大小

在 Photoshop 中,您可以使用图像>图像大小功能手动调整图像大小。 该工具如下所示:

在Photoshop中减小文件大小

您可以在工具顶部看到当前的图像大小和像素尺寸。 您在此处所做的任何调整都会改变大小。

适合是一个具有预设大小和像素设置的下拉列表。

在Photoshop中调整图像文件大小

如果我选择该列表中的第一个选项来调整每英寸 (ppi) 的尺寸和像素,我可以看到文件大小将如何变化。

在Photoshop中调整图像文件大小

您可以尝试使用这些设置来确定下拉菜单中的标准尺寸是否有效,或者您是否需要手动更改宽度、高度或分辨率选项以获得您需要的尺寸。

保存为 Web 功能

Save for Web 与 Save As 的不同之处在于,Web 选项会在保存之前从文件中删除元数据(有关图像类型和来源的详细信息)。 此功能专门用于将在 Internet 上显示的图像,因此它可以是一种在保持质量的同时调整大小的非常快速的方法。

通过导航到“文件”>“导出”>“为 Web 保存”找到“为 Web 保存”选项:

在Photoshop中调整图像大小

当 Save for Web 窗口打开时,您会注意到此功能的另一个好处。 如果您选择顶部的 2-up 选项卡,您可以看到原始图像与更改后的图像并排的比较。

在Photoshop中调整图像大小

从这里,使用右上角的预设选择 JPG 格式并根据需要调整质量。 进行更改后,您可以通过图像预览查看新文件是否符合您的质量标准,并且您可以通过查看每个图像下的数据来验证文件大小的更改:

请注意,您还可以使用右下角的宽度和高度字段更改大小。 由于本文专门针对调整大小,因此我们不会介绍“另存为 Web”屏幕中显示的其他选项,但您可以阅读此处了解更多详细信息。

WordPress 图片优化工具

如果您想自己转动刻度盘以自己减小图像文件大小,Photoshop 是一个不错的选择。 如果您正在寻找更自动化的东西来帮助调整图像大小,那么有很多 WordPress 插件选项可以提供帮助。 以下是一些流行选项的列表及其优点的简要说明:

Imagify – 一次性优化所有图像,轻松调整大小并在需要时将照片恢复到原始版本。 它也很实惠。 此插件可免费下载,包含 20 MB 的文件空间。 其他选项是 500MB 每月 5 美元,无限空间每月 10 美元。

ShortPixel – 没有文件大小限制和多个站点的一个 API 密钥,可以充分利用此插件。 他们还提供一次性和月度计划以实现预算灵活性。

Optimole – 对于面向数据的用户,Optimole 提供了一个仪表板,您可以在其中查看优化统计数据。 他们的免费计划允许每月 5,000 名访问者和无限带宽。

有关这些选项和其他一些选项的更完整比较,请参阅本文。

用于图像优化的 Web 资源

如果您时间和/或金钱紧张,有很多免费的在线图像优化工具。

Compressjpg 允许您上传多个文件并一次调整它们的大小。 它还具有将 iPhone HEIC 格式照片转换为 JPEG 的功能。 其他类似的网站有 Tinypng 和 Image Compressor。

Canva Pro 是另一个受欢迎的网站,它不仅可以调整大小,还可以让您设计和制作图像动画,以及将它们格式化以供网络或社交媒体使用。 它的布局直观且易于使用。

包起来

不要低估优化图像的重要性。 慢速网站不仅会关闭浏览器,而且它们也不会在 Google 搜索中受到关注。 快速加载、清晰的图像可以提供一些额外的东西,使您的网站与众不同。 优化的网站将使访问者返回更多。

您是否使用这些方法中的任何一种来调整图像大小? 如果没有,您认为您会先尝试哪个? 在评论中告诉我们!

精选图片来自 Prihanto Edi/shutterstock.com