在 WordPress 站点中优化图片的策略

最后更新时间为 2018年8月11日

对大多数的网站来说，图片占据了流量的大头，无论你的图片是存储在中间的服务器上还是使用类似七牛这样的第三方静态文件存储，优化这些图片来提升网站的性能，我觉得都是非常重要的。

图片的优化可以帮助你从百度图片搜索、Google 图片搜索中吸引到访客，增加网站流量，是构建成功网站的重要部分。

下面我列举一些在 WordPress 中优化图片的常用的策略，可能很多你都知道，但我觉得没关系，总会有人不知道的：

保存图片为 Web 所用格式

如果想要网站加载速度足够快，在图片方面，则需要缩小图片的文件大小。

实际场景中，最少有一半的访客希望打开的网站在不到 3 秒内加载完毕，如果无法在这个时间内打开网页，这些访客大部分都会选择关闭页面，离开你的网站。

在使用类似 「Adobe PhotoShop」这样的图像编辑软件时，可以使用「存储为 Web所用格式」来减小图片等文件大小；它允许你尽可能的调整图片大小而不去破坏图片的质量。

压缩图片

压缩在 WordPress 上出现的图片，减少图片文件大小，也是一个重要的策略。

压缩可以通过消除人眼无法识别的图像信息来降低图片的大小。推荐使用 TinyPNG 网页版来进行图片的压缩。如果你使用的是 Mac，那么可以试试 Squash 和 PP鸭。

或者你也可以直接安装 EWWW Image Optimizer 插件。该插件是在 WordPress 上压缩高分辨率图片的最佳选择。激活插件后，你可以在上传时自动优化所有图片。

延迟加载

删除网站中不必要的图片会让网站加载速度变快，但这个方法并不能适用于所有人。

如果你想在 WordPress 网站上使用大量的图片，并且希望减少加载时间，那么建议你在网站上开启图片延迟加载。延迟加载只会在用户看到你的图片时加载该图片。

在 WordPress 内启用延迟加载，最简单的方法就是安装 Lazy Load 插件。该插件可启用后直接奏效，不需要进行额外的配置。
WordPress 图片延时加载 Lazy Load 插件

使用 CSS 替换装饰图片

网站通常会有各式各样的设计元素，包括背景图片、按钮等；
很多情况下，其实你可以使用 CSS 来替换这些装饰图片。另外你还可以使用 CSS 来生成各式各样的形状。

在使用 CSS 替换图片时，需要注意浏览器的兼容性。并不是所有的浏览器都支持这些。

为图片增加 Alt 标签

图片 Alt 标签是对图片的一个解释，用于图片无法显示时，在图片区域显示的说明解释文字。

从搜索引擎角度来看，虽然爬虫可以识别图片，但还无法精确识别图片中具体的内容意义，当搜索引擎抓取网站内容时看不懂图片路径的字符时，就会认为是对用户无意义的内容从而不进行抓取，所以图片也无法被搜索引擎图片库进行收入。所有我们需要对图片添加 Alt 标签，帮助搜索引擎看懂图片，增加搜索引擎的友好度。

从用户体验的角度来看，当访客处于网络不佳状态时浏览网页，图片可能无法加载，但通过 Alt 标签内的说明文字就哭大致知道图片的内容，增加了用户的友好度。

但最好不要填写过多的关键词，而是要根据图片内容进行说明撰写，不然很有可能被搜索引擎判定为过度优化而受到惩罚。