专注WordPress外贸建站实用教程,提供基于WordPress的外贸建站服务!
文章分类
文章标签

WordPress网站如何做好图片压缩?

文章导航

图片压缩可以提升网站页面的打开速度,所以我们在一定要控制好上传到网站图片的大小,本文介绍如何进行图片压缩,包括上传到网站之前的图片如何压缩,以及站内图片如何压缩。

1、网站为什么要做图片压缩

我们平时用相机、手机拍摄以及使用图像处理工具生成的图片都是有大小的,根据图像的格式不同,尺寸不同,像素不同,图像的大小也会不同。

图片压缩

一个网站的页面大小是由这个页面承载的内容决定的,这些内容包含HTML、CSS、JS、图片、视频、音频等等。而页面大小影响到用户打开页面的时间(这个时间建议保持在4S以内),如果这时间太长用户没有耐性等待就会跳出网站。搜索引擎也在监控你的网站,如果它发现大量的用户跳出你的网站,将会降低推荐和索引。慢慢的你的用户将很难在看到你的网站,即使你做广告投放,大量的用户跳出也会影响最终的转化效果。

所以当你希望在页面增加更多内容时,就需要考虑这些内容会不会让我的页面变得更大,尤其是图片。大部分情况下,媒体文件(图片、视频等)的加载相对其他的内容(HTML、CSS、JS等)需要消耗更多资源,因为媒体资源要大得多!

通过这张图你就会明白,图片资源在页面总资源中的占比总是很高!

image 180 - WordPress网站如何做好图片压缩? - NUTSWP

通过瀑布图,我们也可以看出来,加载时间的较长的几乎都是图片。

image 182 - WordPress网站如何做好图片压缩? - NUTSWP

2、网站图片大小的基本要求

首先,从用户阅读体验的角度来说,并不提倡页面完全不使用图片,有时候为了帮助用户更好的理解内容,我们可以配图来提升阅读体验,只需要我们对图片做好压缩优化,就不会对网站速度产生较大影响。

我们在网站放图片时,建议采用以下基础标准和要求:

2.1 超级大图 <400KB

宽度在1920px以上,通常包括网站banner图,或者某一个模块背景图等。

image 183 - WordPress网站如何做好图片压缩? - NUTSWP

2.2 大图 <300KB

宽度在1000px以上,通常包括网页中展示图、背景图等。

image 184 - WordPress网站如何做好图片压缩? - NUTSWP

2.3 中图 <200KB

宽度在600PX以上,通常包括产品的封面和相册图片

image 186 - WordPress网站如何做好图片压缩? - NUTSWP

2.4 更小的图片或logo <100KB

通常是宽度小于600px的小图标,网站LOGO之类。

image 187 - WordPress网站如何做好图片压缩? - NUTSWP

3、如何压缩上传之前的图片?

3.1 原始图片大小>3M

如果原始图片大于3M,建议使用专业的图片处理软件进行处理,例如Photoshop。

主要操作就是缩小图片尺寸、压缩图片大小。

image 188 - WordPress网站如何做好图片压缩? - NUTSWP

如果你没有这个软件或者不会使用,请找专业的人员代为处理。

3.2 原始图片大小<3M

可以使用一些在线的压缩工具进行压缩,如果使用工具进行图片压缩的结果和最佳效果相差较大时,建议使用专业的工具对图像进行优化。下面介绍几款好用的在线压缩工具。

Squoosh网网址:https://squoosh.app/

优势:无需代理、可以手动选择压缩百分比并显示压缩后的大小,同时查看压缩前后对比效果

劣势:同时只能压缩单张图片

image 189 - WordPress网站如何做好图片压缩? - NUTSWP

shortpixel 网址:https://shortpixel.com/online-image-compression

优势:单词可以同时压缩多张图片,显示压缩后的效果

劣势:需要代理,压缩只有三个等级可以选择,点击图片可以看到压缩前后效果对比

image 190 - WordPress网站如何做好图片压缩? - NUTSWP

智图 网址:https://zhitu.isux.us/

优势:可以自动转换图片格式,根绝自己的需要下载对应的图片

劣势:每次只能处理单张

image 191 - WordPress网站如何做好图片压缩? - NUTSWP

4、网站内图片压缩

网站内可以使用插件,对上传的图片再进行一个压缩,reSmush.it Image Optimizer是一款免费的图片压缩,基本可以满足网站图片压缩的需求。

只需要安装并启用,安装之后使用默认配置即可。

image 192 - WordPress网站如何做好图片压缩? - NUTSWP

上传之后可以检测网站现有图片,进行一次压缩

image 193 - WordPress网站如何做好图片压缩? - NUTSWP

同时针对上传的文件也会进行自动压缩。

当然除了reSmush.it Image Optimizer插件,你还可以选择其他插件你帮助进行网站图片的压缩工作。

想快速搭建一个完全属于自己的外贸独立站?
本站提供专业的外贸建站服务,如果你不想自己花时间精力搭建网站,可以将你的需求告诉我,我来帮助你搭建一个专业外贸独立站!
微信联系我
Whatsapp联系我
文章分类
文章标签
专注WordPress外贸建站实用教程,提供基于WordPress的外贸建站服务!
外贸建站交流群
广告勿扰
企业微信
文章导航
建站咨询请联系企业微信
感谢你的信任!
咨询和购买请通过微信和我联系!