如何通过图像处理，提升页面加载速度！

页面加载速度对于SEO排名和用户体验非常重要，但是很多站长往往忽略了一个问题，就是通过图片处理和有效选择来提高页面加载速度。

对图像处理简单的理解就是通过选择图像的类型，修改图像的大小，甚至对图像进行有效的压缩来优化图像，使图像对网页加载速度的影响降到最低。

为什么图像处理对页面加载速度如此重要？

在我们多年的SEO优化实践中，我们发现大部分网站加载速度慢并不是一个深刻的技术问题，而是很多时候因为图像质量高导致页面尺寸过大，经常会遇到一个尺寸超过10M的页面，这对于搜索引擎来说是不可想象的，尤其是对于电商网站。如果我们不能有效地压缩图像和修改图像大小，这肯定会影响用户体验。

那么，如何通过图像处理来提高页面加载速度呢？

不要通过CMS自己的系统调整图片大小。

一些常见的CMS系统通常只调整图像大小，有些还会瞬间压缩。这个压缩比之前已经设定好了，但是即使图片经过压缩，上传之前还是会比正确压缩高25%左右，而且还会占用一些服务器资源。

如果一个页面有多张图片，会有一定的影响。为此，我尽量在上传图片前进行有效的处理优化。

那么，在上传图片之前，我们需要做哪些修改呢？

1、调整图像尺寸

调整图像大小非常重要。如果你的图片是800像素宽，你只需要在网站上显示一张484像素宽的图片，即使你在你的CMS中调整了它的大小，它也会被要求压缩800像素图片中的所有信息，这将使图像变得更大。

建议您在上传前将图片的物理尺寸改为484像素。虽然CMS会做调整，但是一定要保证初始图小。

2.选择图像类型

首先你要调整图片大小，压缩它，然后上传。但是在上传问题之前，不仅要调整大小和压缩，还要简单的选择正确的文件类型，这都是问题。现在很多在网站上处理图片的人，往往没有图像方面的经验，所以在使用PNG的时候会使用JPG，反之亦然。

常见的文件类型有：jpg、gif、PNG、webp。我们将重点介绍JPG、gif和WebP这三种形式。毕竟除了特殊站点，GIF很少用。

使用jpeg文件交换格式存储的编码图像文件扩展名

JPG使用所谓的“有损”压缩，这意味着当文件被压缩时，一些数据会永久丢失。眼睛通常不容易发现丢失的数据，所以你得到一个更小的文件与最小的减少。

当然，这取决于被救的JPG的质量。质量越低，丢失的数据就越多。如果保存的质量太低，图像可能会出现“阴影”。如果你想避免这个问题，不要保存低于50%质量的图像。

png

使用所谓的“无损”压缩。无损意味着保存文件时数据不会丢失。图像被重新采样，并且在编译数据时可能使用“最近邻”(相似颜色)，但是数据不会从文件中删除。

PNG：有两种，一种是24位，一种是8位。当您尝试减小文件大小时，您需要一个8位PNG设置。您可能还想更进一步，从PNG文件中删除颜色。

WebP

WebP的优势来自于它的图像压缩算法，可以将图像尺寸压缩到最小，支持有损和无损两种模式，同时保证肉眼不可见。与JPG和巴新相比，WebP更加优秀和稳定。

不过值得注意的是，只有部分浏览器能够获得良好的支持。