图像质量损失检测方法
您是否知道在上传到 WordPress 之前优化图像会对您的网站速度产生巨大影响？
您是否知道在上传到 WordPress 之前优化图像会对您的网站速度产生巨大影响？
When 开始一个新博客, many beginners simply upload images without optimizing them for web. These large image files make your website slower.
创建新博客时 ，许多初学者只是上传图像而没有针对网络进行优化。 这些较大的图像文件会使您的网站变慢。
您可以通过使用图像优化最佳实践作为常规博客例程的一部分来解决此问题。
您可以通过将图像优化最佳实践纳入您的常规博客日常工作来解决此问题。
在本文中，我们将向您展示如何优化图像以获得更快的网络性能而不损失质量。我们还将分享 WordPress 的自动图像优化插件，可以让您的生活变得轻松。
在本文中，我们将向您展示如何优化图像以提高网络性能而不损失质量。我们还将分享 WordPress 的自动图像优化插件，可以让您的生活变得轻松。
由于这是关于网络图像优化的综合指南，我们创建了一个易于理解的目录：
由于这是关于网络图像优化的综合指南，因此我们创建了一个易于理解的目录：
- 什么是图像优化？ （优化与未优化的图像）
- 什么是图像优化？ （优化与未优化的图像）
- 为什么图像优化很重要？有什么好处？
- 为什么图像优化很重要？ 有什么好处？
- 如何保存和优化图像以提高网络性能？如何保存和优化图像以提高网页性能？
- 最佳图像优化工具和程序最佳图像优化工具和程序
- WordPress 最佳图像优化插件WordPress 最佳图像优化插件
什么是图像优化？ (优化与未优化图像) （What is Image Optimization? (Optimized vs Unoptimized Images)）
图像优化是在不降低整体图像质量的情况下以尽可能小的文件大小保存和交付图像的过程。
图像优化是以尽可能小的文件大小保存和交付图像而不降低整体图像质量的过程。
虽然这个过程听起来很复杂，但现在实际上很简单。您可以使用众多图像优化插件和工具之一自动将图像压缩高达 80%，而不会造成任何明显的图像质量损失。
虽然这个过程听起来很复杂，但现在实际上非常简单。您可以使用众多图像优化插件和工具之一自动将图像压缩 80%，而不会明显损失图像质量。
以下是优化与未优化图像的示例：
以下是优化图像与未优化图像的示例：
正如您所看到的，经过适当优化后，同一图像可以比原始图像小 75%，而质量不会有任何损失。
正如您所看到的，通过适当的优化，相同的图像可以比原始图像小 75%，而质量不会有任何损失。
图像优化如何工作？
图像优化如何工作？
简而言之，图像优化通过使用“有损”和“无损”等压缩技术来实现，这有助于减少整体文件大小，而不会造成任何明显的质量损失。
简而言之，图像优化是通过使用“有损”和“无损”等压缩技术来实现的，这些技术有助于减小文件的整体大小，而不会显着降低质量。
优化图像意味着什么？
优化图像意味着什么？
If you ever received a recommendation to optimize images by your WordPress 托管 support or by a speed test tool, then all it means is that you need to reduce the file size of your images by optimizing them for web.
如果您曾经收到过通过WordPress 托管支持或速度测试工具优化图像的建议，那么这意味着您需要通过针对网络进行优化来减小图像的文件大小。
为什么图像优化很重要？ 图像优化的好处是什么？ （Why is Image Optimization Important? What are the Benefits of Image Optimization?）
虽然优化图像有很多好处，但以下是您应该了解的主要好处：
优化图像有很多好处，但以下是您应该了解的最重要的好处：
- Faster website speed 更快的网站速度
- Improved SEO rankings 提升SEO排名
- Higher overall conversion rate for sales and leads 更高的销售和潜在客户总转化率
- Less storage and bandwidth (which can reduce hosting and CDN cost) 更少的存储和带宽(可以减少托管和CDN成本)
- Faster website backups (also reduces cost of backup storage) 更快的网站备份(也降低了备份存储成本)
Outside of video, images are the next heaviest item on a web page. According to HTTP 存档, 图片平均占网页总权重的 21%.
在视频之外，图像是网页上的下一个最重要的项目。 根据HTTP文件 ， 图片平均占整个网页权重的21% 。
由于我们知道快速的网站在搜索引擎 (SEO) 中排名更高并且具有更好的转化率，因此图像优化是每个商业网站如果想在网上取得成功就必须做的事情。
由于我们知道快速网站在搜索引擎 (SEO) 中排名较高并且具有更好的转化率，因此图像优化是每个商业网站要想在网上取得成功必须要做的事情。
现在您可能想知道图像优化到底能带来多大的改变？
现在，您可能想知道图像优化到底能带来多大的改变？
根据 Strangeloop 的研究，网站加载时间延迟一秒可能会导致销售额下降 7%、浏览量减少 11%、客户满意度下降 16%。
根据 Strangeloop 的一项研究，网站加载时间延迟一秒可能会造成 7% 的销售额损失、11% 的页面浏览量减少以及 16% 的客户满意度降低。
如果这些还不足以加速您的网站，那么您应该知道像谷歌这样的搜索引擎也会对加载速度更快的网站给予优先的搜索引擎优化处理。
如果这还不足以加快您的网站速度，您应该知道 Google 等搜索引擎也为快速加载网站提供 SEO 优势。
This means that by optimizing your images for web, you can both 提高网站速度 and boost WordPress SEO 排名.
这意味着，通过优化网络图像，既可以提高网站速度，又可以提高WordPress SEO 排名 。
影片教学 （Video Tutorial）
如果您更喜欢书面说明，请继续阅读。
如果您更喜欢书面说明，请继续阅读。
如何保存和优化图像以提高Web性能？ （How to Save and Optimize Images for Web Performance?）
成功进行网络性能图像优化的关键是在最小文件大小和可接受的图像质量之间找到完美平衡。
Web 性能 成功图像优化的关键是在最小文件大小和可接受的图像质量之间找到完美平衡。
在图像优化中发挥巨大作用的三件事是：
在图像优化中发挥重要作用的三件事是：
- Image file format (JPEG vs PNG vs GIF) 图像文件格式(JPEG，PNG和GIF)
- Compression (Higher compression = smaller file size) 压缩(较高的压缩率=较小的文件大小)
- Image Dimensions (height and width) 图像尺寸(高度和宽度)
通过选择三者的正确组合，您可以将图像尺寸缩小多达 80%。
通过选择三者的正确组合，您可以将图像尺寸缩小多达 80%。
让我们更详细地看一下每一个。
让我们更详细地看看每一个。
1. 图像文件格式
1. 图像文件格式
对于大多数网站所有者来说，唯一真正重要的三种图像文件格式是 JPEG、PNG 和 GIF。选择正确的文件类型在图像优化中起着重要作用。
对于大多数网站所有者来说真正重要的唯一三种图像文件格式是 JPEG、PNG 和 GIF。选择正确的文件类型在图像优化中起着重要作用。
为了简单起见，您希望对具有多种颜色的照片或图像使用 JPEG，对简单图像或需要透明图像时使用 PNG，仅对动画图像使用 GIF。
为了简单起见，您希望对具有多种颜色的照片或图像使用 JPEG，对简单图像或需要透明图像时使用 PNG，对动画图像使用 GIF。
对于那些不知道每种文件类型之间差异的人来说，PNG 图像格式是未压缩的，这意味着它是更高质量的图像。缺点是文件大小要大得多。
对于那些不知道每种文件类型之间差异的人来说，PNG 图像格式是未压缩的，这意味着它是更高质量的图像。缺点是文件大小较大。
另一方面，JPEG 是一种压缩文件格式，它会稍微降低图像质量，以提供更小的文件大小。
另一方面，JPEG 是一种压缩文件格式，会稍微降低图像质量以提供小得多的文件大小。
而 GIF 仅使用 256 色以及无损压缩，这使其成为动画图像的最佳选择。
另一方面，GIF 仅使用 256 色和无损压缩，使其成为动画图像的最佳选择。
在 WPBeginner 上，我们根据图像类型使用所有三种图像格式。
在 WPBeginner 上，我们根据图像类型使用所有三种图像格式。
2.压缩
2. 压缩
接下来是图像压缩，它在图像优化中发挥着巨大作用。
接下来是图像压缩，它将在图像优化中发挥巨大作用。
有不同类型和级别的图像压缩可用。每个设置将根据您使用的图像压缩工具而有所不同。
图像压缩有不同的类型和级别。每个设置都会根据您使用的图像压缩工具而有所不同。
Most image editing tools like Adobe Photoshop, On1 照片, GIMP, Affinity Photo, and others come with built-in image compression features.
大多数图像编辑工具(例如Adobe Photoshop ， On1 照片 ，GIMP，Affinity Photo等)都具有内置的图像压缩功能。
You can also save images normally and then use a web tool like 小PNG or 迷你JPEG for easier image compression.
您也可以正常保存图像，然后使用诸如小PNG或迷你JPEG的网络工具来简化图像压缩。
虽然有点手动，但这两种方法允许您在将图像上传到 WordPress 之前对其进行压缩，这就是我们在 WPBeginner 上所做的。
虽然有点手动，但这两种方法允许您在将图像上传到 WordPress 之前对其进行压缩，这正是我们在 WPBeginner 所做的。
There are also several popular WordPress plugins like 奥普莫勒, EWW图像优化器, and others that can automatically compress images when you first upload them. Many beginners and even large corporations prefer to use these image optimization plugins because it’s easy and convenient.
还有一些流行的WordPress插件，例如奥普莫勒 ， EWW图像优化器 ，以及其他一些可以在首次上传图像时自动压缩图像的插件。 许多初学者甚至大型公司都喜欢使用这些图像优化插件，因为它既简单又方便。
我们将在本文后面分享有关这些 WordPress 插件的更多信息。
我们将在本文后面分享有关这些 WordPress 插件的更多信息。
3. 图像尺寸
3、图像尺寸
通常，当您从手机或数码相机导入照片时，它具有非常高分辨率和大文件尺寸（高度和宽度）。
通常，当您从手机或数码相机导入照片时，它具有非常高的分辨率和很大的文件大小（高度和宽度）。
通常，这些照片的分辨率为 300 DPI，尺寸从 2000 像素以上开始。这些高质量的照片非常适合印刷或桌面出版。它们不适合网站。
通常，这些照片的分辨率为 300 DPI，尺寸从 2000 像素甚至更大。这些高质量的照片非常适合打印或桌面出版。它们不适用于网站。
Reducing file dimensions to something more reasonable can significantly decrease image file size. You can simply 调整图像大小 using an image editing software on your computer.
将文件尺寸减小到更合理的尺寸可以显着减小图像文件的大小。 您可以使用计算机上的图像编辑软件简单地调整图像大小 。
例如，我们优化了一张原始文件大小为1.8 MB、分辨率为300 DPI、图像尺寸为4900×3200像素的照片。
例如，我们优化了一张原始文件大小为1.8 MB、分辨率为300 DPI、图像大小为4900×3200像素的照片。
我们选择 jpeg 格式进行更高的压缩，并将尺寸更改为 1200×795 像素，并将图像文件大小减小到 103 KB。这比原始文件大小小 94%。
我们选择 jpeg 格式进行更高的压缩，并将尺寸更改为 1200×795 像素，将图像文件大小减小到 103 KB。这比原始文件大小小 94%。
现在您已经了解了图像优化的三个重要因素，让我们来看看适合网站所有者的各种图像优化工具。
现在您已经了解了图像优化的三个重要因素，接下来我们就来看看适合网站站长使用的各种图像优化工具。
最佳图像优化工具和程序 （Best Image Optimization Tools and Programs）
正如我们之前提到的，大多数图像编辑软件都带有图像优化和压缩设置。
如前所述，大多数图像编辑软件都带有图像优化和压缩设置。
除了图像编辑软件之外，还有一些功能强大的免费图像优化工具，您可以使用它们来优化网络图像（只需单击几下）。
除了图像编辑软件之外，还有一些功能强大的免费图像优化工具，可用于优化网络图像（只需单击几下）。
我们建议您在将图像上传到 WordPress 之前使用这些工具来优化图像，特别是如果您是完美主义者。
我们建议在将图像上传到 WordPress 之前使用这些工具来优化图像，特别是如果您是完美主义者。
此方法可以帮助您节省 WordPress 托管帐户上的磁盘空间，并且由于您手动检查每个图像，因此可以保证速度最快且质量最好的图像。
此方法可以帮助您节省 WordPress 托管帐户上的磁盘空间，并且由于您手动检查每个图像，因此可以保证最快的图像和最佳质量。
Adobe Photoshop
Adobe Photoshop
Adobe Photoshop is a premium software that comes with a feature to save images optimized for the web. Simply open your image and click on the “File » Save for Web” option.
Adobe Photoshop是一款高级软件，具有保存针对网络优化的图像的功能。 只需打开图像，然后单击“文件»另存为Web”选项。
这将打开一个新对话框。在右侧，您可以设置不同的图像格式。对于 JPEG 格式，您将看到不同的质量选项。当您选择选项时，它还会在左下角显示文件大小。
这将打开一个新对话框。在右侧，您可以设置不同的图像格式。对于 JPEG 格式，您将看到不同的质量选项。选择选项时，它还会在左下角显示文件大小。
GIMP
GIMP
GIMP is a free and open source alternative to popular Adobe Photoshop. It can be used to optimize your images for the web. The downside is that it is not as easy to use as some other solutions on this list.
GIMP是流行的Adobe Photoshop的免费开源替代品。 它可用于优化网络图像。 缺点是，它不像此列表中的其他解决方案那样容易使用。
First, you need to open your image in GIMP and then select 文件 » 导出为 option. This will bring up the save file dialog box. Give your file a new name and then click on the export button.
首先，您需要在GIMP中打开图像，然后选择文件»导出为选项。 这将打开保存文件对话框。 给您的文件起一个新的名字，然后点击导出按钮。
这将显示图像导出选项。对于 jpeg 文件，您可以选择压缩级别以减小文件大小。最后，点击导出按钮保存优化后的图像文件。
这将显示图像导出选项。对于 jpeg 文件，您可以选择压缩级别以减小文件大小。最后，单击“导出”按钮保存优化后的图像文件。
TinyPNG 是一款免费的网络应用程序，它使用智能有损压缩技术来减小 PNG 文件的大小。您所要做的就是访问他们的网站并上传您的图像（简单的拖放）。
TinyPNG 是一款免费的 Web 应用程序，它使用智能有损压缩技术来减小 PNG 文件的大小。您所要做的就是访问他们的网站并上传图像（简单的拖放）。
They will compress the image, and give you the download link. You can use their sister website, 小JPG, for JPEG image compression.
他们将压缩图像，并为您提供下载链接。 您可以使用其姐妹网站小JPG进行JPEG图像压缩。
他们还有 Adobe Photoshop 的扩展，我们将其用作图像编辑过程的一部分，因为它结合了 Photoshop 中 TinyPNG 和 TinyJPG 的优点。
他们还有 Adobe Photoshop 扩展，这是我们在图像编辑过程中使用的扩展，因为它结合了 Photoshop 中 TinyPNG 和 TinyJPG 的优点。
对于开发人员来说，他们有一个 API 可以自动转换图像，对于初学者来说，他们有一个 WordPress 插件可以自动为您完成此操作（稍后会详细介绍）。
对于开发人员来说，他们有一个可以自动转换图像的 API，对于初学者来说，他们有一个 WordPress 插件可以自动为您完成此操作（稍后会详细介绍）。
JPEGmini 使用无损压缩技术，可显着减小图像的大小而不影响其感知质量。您还可以比较原始图像和压缩图像的质量。
JPEGmini 使用无损压缩技术显着减小图像大小，而不影响图像的感知质量。您还可以比较原始图像和压缩图像的质量。
您可以免费使用他们的网络版本，或者为您的计算机购买该程序。他们还有一个付费 API 来自动化您服务器的流程。
您可以免费使用其网络版本，或为您的计算机购买该程序。他们还有一个付费 API，可以为您的服务器自动执行该流程。
ImageOptim 是一款 Mac 实用程序，通过查找最佳压缩参数并删除不必要的颜色配置文件，您可以在不损失任何质量的情况下压缩图像。
ImageOptim 是一款 Mac 实用程序，通过查找最佳压缩参数并删除不必要的颜色配置文件，您可以在不损失质量的情况下压缩图像。
Windows alternative to this is 修剪图像.
Windows的替代方法是修剪图像 。
适用于WordPress的最佳图像优化插件 （Best Image Optimization Plugins for WordPress）
We believe that the best way to optimize your images is by doing it before uploading them to WordPress. However, if you run a multi-author site or need an automated solution, then you can try a WordPress 图片压缩插件.
我们认为，优化图像的最佳方法是在将图像上传到WordPress之前先进行操作。 但是，如果您运行一个多作者网站或需要一个自动化的解决方案，则可以尝试使用WordPress 图片压缩插件 。
以下是我们最好的 WordPress 图像压缩插件列表：
以下是我们最好的 WordPress 图像压缩插件列表：
- 奥普莫勒 – popular plugin by the team behind ThemeIsle.奥普莫勒 – ThemeIsle背后的团队流行的插件。
- EWW图像优化器EWW图像优化器
- 压缩 JPEG 和 PNG 图像 – plugin by TinyPNG team mentioned above in the article.压缩 JPEG 和 PNG 图像 –本文中提到的TinyPNG小组的插件。
- 想象 – plugin by the popular 想象 –由流行的WP火箭 plugin team.WP火箭插件团队提供的插件。
- 短像素图像优化器ShortPixel 图像优化器
- WP 斯马什WP 斯马什
- 重新Smush.it转发
使用任何这些 WordPress 图像优化插件都将帮助您加快网站速度。
使用任何这些 WordPress 图像优化插件都可以帮助加快您的网站速度。
图像优化的最终想法和最佳实践 （Final Thoughts and Best Practices for Image Optimization）
如果您没有保存针对网络优化的图像，那么您需要立即开始这样做。这将对您的网站速度产生巨大的影响，您的用户会因此感谢您。
如果您没有保存针对网络优化的图像，则需要立即开始。这将对您的网站速度产生巨大影响，您的用户会因此感谢您。
更不用说，更快的网站对于 SEO 非常有用，您可能会看到搜索引擎排名的提高。
更不用说，更快的网站对于 SEO 非常有用，您可能会看到搜索引擎排名有所提高。
Outside of image optimization, the two things that will significantly help you speed up your website is using a WordPress 缓存插件 and using a WordPress CDN.
除了图像优化之外，使用WordPress 缓存插件和WordPress CDN可以显着帮助您加快网站访问速度的两件事。
Alternatively, you can use a WordPress 托管 company because they often offer both caching and CDN as part of the platform.
另外，您可以使用WordPress 托管公司，因为它们通常同时提供缓存和CDN作为平台的一部分。
We hope this article helped you learn how to optimize your images in WordPress. You may also want to see our guide on 如何提高 WordPress 安全性 and the 适用于商业网站的最佳 WordPress 插件.
我们希望本文能帮助您学习如何在WordPress中优化图像。 您可能还需要查看我们的指南，以了解如何提高 WordPress 安全性以及适用于商业网站的最佳 WordPress 插件 。
If you liked this article, then please subscribe to our YouTube 频道 for WordPress video tutorials. You can also find us on 推特 and Facebook.
如果您喜欢这篇文章，请订阅我们的YouTube 频道 WordPress视频教程。 您也可以在推特和Facebook上找到我们。
翻译自: https://www.wpbeginner.com/beginners-guide/speed-wordpress-save-images-optimized-web/
图像质量损失检测方法